Merge

.github/CODEOWNERS

@@ -86,7 +86,7 @@ OverflowSet/  @micahgodbolt
 # Overlay/
 # Panel/
 # Persona/
-Persona/PersonaCoin.tsx @mtennoe @jakob101
+Persona/PersonaCoin/ @mtennoe @jakob101
 Persona/PersonaConsts.tsx @mtennoe @jakob101
 pickers/  @joschect
 # Pivot/
@@ -105,4 +105,59 @@ TeachingBubble/   @micahgodbolt
 Toggle/  @phkuo
 Tooltip/  @micahgodbolt
 
+## Docs
+# ActivityItem/docs/
+# Breadcrumb/docs/
+# Button/docs/
+Calendar/docs/   @lorejoh12 @sathi23
+Callout/docs/  @joschect
+# Check/docs/
+# Checkbox/docs/
+ChoiceGroup/docs/   @srideshpande
+# ColorPicker/docs/
+# ComboBox/docs/
+CommandBar/docs/   @micahgodbolt
+ContextualMenu/docs/  @joschect
+DatePicker/docs/   @lorejoh12 @sathi23
+# DetailsList/docs/
+# Dialog/docs/
+DocumentCard/docs/ @yiminwu @mikewheaton
+# Dropdown/docs/
+# Fabric/docs/
+# FacePile/docs/
+# FocusTrapZone/docs/
+# FocusZone/docs/
+GroupedList/docs/  @aditima
+HoverCard/docs/   @atneik @Jahnp
+# Icon/docs/
+# Image/docs/
+# Label/docs/
+Layer/docs/  @ThomasMichon
+# Link/docs/
+List/docs/  @cschleiden
+# MarqueeSelection/docs/
+# MessageBar/docs/
+# Modal/docs/
+# Nav/docs/
+OverflowSet/docs/  @micahgodbolt
+# Overlay/docs/
+# Panel/docs/
+# Persona/docs/
+pickers/docs/  @joschect
+# Pivot/docs/
+# Popup/docs/
+# ProgressIndicator/docs/
+Rating/docs/  @cschleiden
+ResizeGroup/docs/  @micahgodbolt
+# SearchBox/docs/
+# Slider/docs/
+# SpinButton/docs/
+# Spinner/docs/
+# SwatchColorPicker/docs/
+TeachingBubble/docs/   @micahgodbolt
+# TextField/docs/
+# Theme/docs/
+Toggle/docs/  @phkuo
+Tooltip/docs/  @micahgodbolt
+
 

.npm-version

@@ -1 +1 @@
-2.x
+5.6.0

.travis.yml

@@ -7,4 +7,4 @@ script:
     fi
   - npm run buildfast
   - npm run bundlesize
-  - npm run vrtest
+  - npm run vrtest

README.md

@@ -127,7 +127,7 @@ In Jest:
 
 For advanced usage including info about module vs. path-based imports, using an AMD bundler like Require, and deployment features, see our [advanced documentation](./ghdocs/BestPractices/Advanced.md).
 
-## Contribute to Office UI Fabric React
+## Contribute to Fabric React
 
 Please take a look at our [contribution guidelines](./ghdocs/Contributing/Contributing.md) for more info. Also read [Contribute Bug fixes](./ghdocs/Contributing/BugFixes.md) and [Contribute New component](./ghdocs/Contributing/NewComponent.md).
 

apps/fabric-website/CHANGELOG.json

@@ -1,6 +1,44 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/fabric-website_v5.7.0",
+      "date": "Tue, 17 Apr 2018 18:47:11 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8829b1fde1bbe2e6920b5e619727835184a15b45",
+            "comment": "GetStarted page: Give titles links to their corresponding pages."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.82.1 <6.0.0` to `>=5.82.2 <6.0.0`"
+          }
+        ]
+      }
+    },
+    {
+      "version": "5.6.1",
+      "tag": "@uifabric/fabric-website_v5.6.1",
+      "date": "Mon, 16 Apr 2018 10:23:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6f8a180ae2ecca66d09be97e48e8e03cc17d4d9e",
+            "comment": "Updating build to React 16.3.1."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.81.1 <6.0.0` to `>=5.82.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/fabric-website_v5.6.0",

apps/fabric-website/CHANGELOG.md

@@ -1,6 +1,20 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 05 Apr 2018 10:15:39 GMT and should not be manually modified.
+This log was last generated on Tue, 17 Apr 2018 18:47:11 GMT and should not be manually modified.
+
+## 5.7.0
+Tue, 17 Apr 2018 18:47:11 GMT
+
+### Minor changes
+
+- GetStarted page: Give titles links to their corresponding pages.
+
+## 5.6.1
+Mon, 16 Apr 2018 10:23:26 GMT
+
+### Patches
+
+- Updating build to React 16.3.1.
 
 ## 5.6.0
 Thu, 05 Apr 2018 10:15:39 GMT

apps/fabric-website/index.html

@@ -45,8 +45,8 @@
     }
 
     var scripts = [
-      '//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',
+      '//cdnjs.cloudflare.com/ajax/libs/react/16.3.1/umd/react.production.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.3.1/umd/react-dom.production.min.js',
       '/fabric-sitev5.js'
     ];
 

apps/fabric-website/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "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",
@@ -22,24 +22,24 @@
     "@types/node": "8.0.26",
     "@types/prop-types": "15.5.2",
     "@types/resemblejs": "~1.3.28",
-    "@types/react": "16.0.25",
-    "@types/react-dom": "16.0.3",
+    "@types/react": "16.3.10",
+    "@types/react-dom": "16.0.5",
     "@types/webpack-env": "1.13.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "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": "^16.2.0",
-    "react-dom": "^16.2.0",
+    "react": "^16.3.1",
+    "react-dom": "^16.3.1",
     "react-highlight": "^0.10.0",
     "write-file-webpack-plugin": "^4.1.0"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.81.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.85.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }

apps/fabric-website/src/components/App/App.tsx

@@ -27,20 +27,20 @@ export class App extends React.Component<IAppProps, any> {
     };
   }
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     window.addEventListener('scroll', this._handleNavPositioning);
     window.addEventListener('resize', this._handleNavPositioning);
 
     this._attachedScrollThreshold = AttachedScrollUtility.calculateAttachedScrollThreshold();
     this._handleNavPositioning();
   }
 
-  public componentWillUnmount() {
+  public componentWillUnmount(): void {
     window.removeEventListener('scroll', this._handleNavPositioning);
     window.removeEventListener('resize', this._handleNavPositioning);
   }
 
-  public render() {
+  public render(): JSX.Element {
     let { navHeight } = this.state;
     let navPosition: 'fixed' | 'absolute' = this.state.isAttached ? 'fixed' : 'absolute';
     let navStyle = {

apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx

@@ -49,7 +49,7 @@ export class CodeBlock extends React.Component<ICodeBlockProps, ICodeBlockState>
     this._onToggleClicked = this._onToggleClicked.bind(this);
   }
 
-  public render() {
+  public render(): JSX.Element {
     let { language, isCollapsible, isLightTheme, children } = this.props;
     let { isOpen } = this.state;
 

apps/fabric-website/src/components/ColorTable/ColorTable.tsx

@@ -14,7 +14,7 @@ export interface IColorTableState {
 }
 
 export class ColorTable extends React.Component<IColorTableProps, IColorTableState> {
-  public render() {
+  public render(): JSX.Element {
     let { content } = this.props;
 
     return (

apps/fabric-website/src/components/DOIcon/DOIcon.tsx

@@ -12,7 +12,7 @@ export class DOIcon extends React.Component<IDOIconProps, {}> {
     ariaHidden: true
   };
 
-  public render() {
+  public render(): JSX.Element {
     return (
       <i
         className={ 'od-Icon od-Icon--' + this.props.iconClass + ' ms-bgColor-' + this.props.bgColor }

apps/fabric-website/src/components/DONavigation/DONavigation.tsx

@@ -31,7 +31,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
   private headerel;
   private navcontainerel;
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     let currentButton;
     let submenu;
     let currentContainer;
@@ -76,7 +76,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     this._processResize();
   }
 
-  public render() {
+  public render(): JSX.Element {
     return (
       <div className='od-Navigation'>
         <div className='od-Navigation-searchContainer'>
@@ -174,7 +174,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     return linkElements;
   }
 
-  private _mouseMoveHandler(e) {
+  private _mouseMoveHandler(e): void {
     let linkContainer = document.querySelector(this.OPEN_LINK_CONTAINER);
     let subMenuContainer;
     let targetHeight;
@@ -240,7 +240,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _processHamburger(e, isKeyEvent?: boolean) {
+  private _processHamburger(e, isKeyEvent?: boolean): void {
     let linkEL: HTMLElement;
     if (!this.hbuttonel.classList.contains(this.HAMBURGER_OPEN_STATE)) {
       this.hbuttonel.classList.add(this.HAMBURGER_OPEN_STATE);
@@ -256,7 +256,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _closeDropdownHandler(e) {
+  private _closeDropdownHandler(e): void {
     if (!this._isDescendant(this.headerel, document.activeElement)) {
       this._removeDropdown();
     }
@@ -278,7 +278,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _hamburgerHandler(e: any) {
+  private _hamburgerHandler(e: any): void {
     if (e.keyCode) {
       if (e.keyCode === 13) {
         this._processHamburger(e, true);
@@ -290,7 +290,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _processMenuToggle(e) {
+  private _processMenuToggle(e): void {
     let ancestor;
     if (e.target.classList.contains(this.CONTAINER_CLASS)) {
 
@@ -316,7 +316,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _toggleMenuHandler(e) {
+  private _toggleMenuHandler(e): void {
     if (e.keyCode) {
       if (e.keyCode === 13) {
         this._processMenuToggle(e);
@@ -328,7 +328,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _isDescendant(parent, child) {
+  private _isDescendant(parent, child): boolean {
     let node = child.parentNode;
     while (node) {
       if (node === parent) {
@@ -345,7 +345,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private _findAncestor(el, cls) {
+  private _findAncestor(el, cls): void {
     let newCLS = cls.replace('.', '');
     let newEL = el;
 

apps/fabric-website/src/components/DONavigation/DONavigationLink.tsx

@@ -13,22 +13,22 @@ export interface IDONavigationLinkState {
 }
 
 export class DONavigationLink extends React.Component<IDONavigationLinkProps, IDONavigationLinkState> {
-    public static defaultProps = {
-      role: 'menuitem'
-    };
+  public static defaultProps = {
+    role: 'menuitem'
+  };
 
-    public render() {
-      return (
-        <a className='od-Navigation-subMenuItem' href={ this.props.href } role={ this.props.role }>
-          { this._getIcon() }
-          { this.props.label }
-        </a>
-      );
-    }
+  public render(): JSX.Element {
+    return (
+      <a className='od-Navigation-subMenuItem' href={ this.props.href } role={ this.props.role }>
+        { this._getIcon() }
+        { this.props.label }
+      </a>
+    );
+  }
 
-    private _getIcon() {
-      if (this.props.icon) {
-        return <DOIcon iconClass={ this.props.icon.iconClass } bgColor={ this.props.icon.bgColor } />;
-      }
+  private _getIcon() {
+    if (this.props.icon) {
+      return <DOIcon iconClass={ this.props.icon.iconClass } bgColor={ this.props.icon.bgColor } />;
     }
+  }
 }