diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS new file mode 100644 index 00000000000000..c294b67e9f2ecd --- /dev/null +++ b/.github/CODEOWNERS @@ -0,0 +1,108 @@ +# 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 + +#### Core build stuff +scripts/ @dzearing + +#### Apps +# component-demo/ +# fabric-website/ +# ssr-tests/ +# test-bundle-button/ @dzearing +# todo-app/ + +#### Packages +# packages/example-app-base/ +packages/file-type-icons/ @KatherineThayerMicrosoft @jahnp @bigbadcapers +# 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/ +common/_semanticSlots.scss @phkuo +common/_themeOverrides.scss @phkuo +common/_common.scss @phkuo + +### Utilities +dateMath/ @lorejoh12 @sathi23 +dateValues/ @lorejoh12 @sathi23 + +## Components +# ActivityItem/ +# Breadcrumb/ +# Button/ +Calendar/ @lorejoh12 @sathi23 +Callout/ @joschect +# Check/ +# Checkbox/ +# ChoiceGroup/ +# ColorPicker/ +# ComboBox/ +CommandBar/ @micahgodbolt +ContextualMenu/ @joschect +DatePicker/ @lorejoh12 @sathi23 +# DetailsList/ +# Dialog/ +DocumentCard/ @yiminwu @mikewheaton +# Dropdown/ +# Fabric/ +# FacePile/ +# FocusTrapZone/ +# FocusZone/ +GroupedList/ @aditima +HoverCard/ @atneik @Jahnp +# Icon/ +# Image/ +# Label/ +Layer/ @ThomasMichon +# Link/ +List/ @cschleiden +# MarqueeSelection/ +# MessageBar/ +# Modal/ +# Nav/ +OverflowSet/ @micahgodbolt +# Overlay/ +# Panel/ +# Persona/ +Persona/PersonaCoin.tsx @mtennoe @jakob101 +Persona/PersonaConsts.tsx @mtennoe @jakob101 +pickers/ @joschect +# Pivot/ +# Popup/ +# ProgressIndicator/ +Rating/ @cschleiden +ResizeGroup/ @micahgodbolt +# SearchBox/ +# Slider/ +# SpinButton/ +# Spinner/ +# SwatchColorPicker/ +TeachingBubble/ @micahgodbolt +# TextField/ +# Theme/ +Toggle/ @phkuo +Tooltip/ @micahgodbolt + + diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 88fb78faa62cea..96596ef25f3730 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -1,10 +1,7 @@ #### Pull request checklist - [ ] Addresses an existing issue: Fixes #0000 -- [ ] Include a change request file if publishing -- [ ] New feature, bugfix, or enhancement - - [ ] Includes tests -- [ ] Documentation update +- [ ] Include a change request file using `$ npm run change` #### Description of changes @@ -13,19 +10,3 @@ #### Focus areas to test (optional) - - diff --git a/.gitignore b/.gitignore index e4b4a333dfaa8c..037b95769bc432 100644 --- a/.gitignore +++ b/.gitignore @@ -42,6 +42,7 @@ node_modules temp lib lib-amd +lib-es2015 coverage dist npm-debug.log @@ -104,11 +105,12 @@ 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/temp -common/rush-link.json -common/last-install.* -common/rush-recycler +# Gulp cache +gulp-cache + +# NPM debug logs +npm-debug.log.* + +package-lock.json \ No newline at end of file diff --git a/.npmrc b/.npmrc new file mode 100644 index 00000000000000..1df2a6d8579b70 --- /dev/null +++ b/.npmrc @@ -0,0 +1,2 @@ +registry=https://registry.npmjs.org/ +package-lock=false diff --git a/.travis.yml b/.travis.yml index 15fe4aacfbc8de..03a88d5329b50f 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,11 +1,10 @@ language: node_js node_js: - - 'node' -before_script: - - npm install -g gulp + - '8' script: - - npm run build -cache: - directories: - - node_modules - - common/node_modules + - if [ $TRAVIS_BRANCH == "master" ] && [ $TRAVIS_PULL_REQUEST == "true" ]; then + npm run checkchange; + fi + - npm run buildfast + - npm run bundlesize + - npm run vrtest diff --git a/.vscode/launch.json b/.vscode/launch.json index 43d411bfaede0d..d11601527a2526 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -2,13 +2,35 @@ "version": "0.2.0", "configurations": [ { - "name": "Launch", + "name": "Debug test", "type": "node", "request": "launch", - "program": "${workspaceRoot}/packages/office-ui-fabric-react/node_modules/gulp/bin/gulp.js", + "program": "${workspaceRoot}/scripts/debug-test.js", + "cwd": "${fileDirname}", "stopOnEntry": false, - "args": [], + "args": [ + "-i" + ], + "runtimeExecutable": null, + "runtimeArgs": [ + "--nolazy", + "--debug" + ], + "env": { + "NODE_ENV": "development" + }, + "sourceMaps": true + }, + { + "name": "Build fabric", + "type": "node", + "request": "launch", + "program": "${workspaceRoot}/scripts/build.js", "cwd": "${workspaceRoot}/packages/office-ui-fabric-react", + "stopOnEntry": false, + "args": [ + "ts" + ], "runtimeExecutable": null, "runtimeArgs": [ "--nolazy", @@ -17,9 +39,50 @@ "env": { "NODE_ENV": "development" }, - "externalConsole": false, - "sourceMaps": false, - "outDir": null + "sourceMaps": true + }, + { + "name": "Debug build Production", + "type": "node", + "request": "launch", + "program": "${workspaceRoot}/scripts/build.js", + "stopOnEntry": false, + "args": [ + "webpack", + "--", + "--production" + ], + "cwd": "${workspaceRoot}/apps/fabric-website", + "runtimeExecutable": null, + "runtimeArgs": [ + "--nolazy", + "--debug" + ], + "env": { + "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", @@ -40,9 +103,28 @@ "env": { "NODE_ENV": "development" }, - "externalConsole": false, - "sourceMaps": false, - "outDir": null + "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/.vscode/settings.json b/.vscode/settings.json index 4d90f661ad6c5c..e41d096237597b 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -12,16 +12,27 @@ "files.exclude": { "**/.git": true, "**/.DS_Store": true, - "**/bower_components": true, "**/coverage": true, "**/*.scss.ts": true }, + "files.watcherExclude": { + "**/.git": true, + "**/node_modules": true, + "**/lib": true, + "**/lib-amd": true, + "/**lib-es2015": 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": { "common": true, "**/node_modules": true, "**/lib": true, "**/lib-amd": true, + "**/lib-es2015": true, "**/dist": true, "**/*.scss.ts": true }, @@ -29,10 +40,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", - "tslint.autoFixOnSave": true + "typescript.tsdk": "./common/temp/node_modules/typescript/lib", + "tslint.autoFixOnSave": false } \ No newline at end of file diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md new file mode 100644 index 00000000000000..255d47afb7f6b8 --- /dev/null +++ b/CONTRIBUTING.md @@ -0,0 +1,111 @@ +# Contributing to Office UI Fabric + +## Components +Our components are a collection of small, independent, general-purpose UI components intended to be reused throughout an existing application. + +### 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_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. + +#### 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_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. +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_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 `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_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 `/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, 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`. +3. Create a `ExcitingNewComponent.types.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 { … 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.types';` + * Add your class to this file. + * Add the following example class + * `export class ExcitingNewComponent extends BaseComponent { };` +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.types';` + * 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/README.md b/README.md index 558795d769ab53..3cfb4c003e0161 100644 --- a/README.md +++ b/README.md @@ -7,40 +7,23 @@ 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) -- [Get started](#get-started) -- [Testing](#testing) -- [Advanced usage](#advanced-usage) -- [Roadmap](#roadmap) -- [Trello board](#trello-board) +- [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/), [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: - -1. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git` -2. `npm install` -3. `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: @@ -56,20 +39,27 @@ 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'; +import { PrimaryButton } from 'office-ui-fabric-react/lib/Button'; + +ReactDOM.render( + + I am a button. + , + document.body.firstChild +); +``` -const MyPage = () => (
); +## Browser support -ReactDOM.render(, document.body.firstChild); -``` +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. -## Rendering Fabric components on the server (SSR) +## 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: ```ts import { configureLoadStyles } from '@microsoft/load-themed-styles'; - + // Store registered styles in a variable used later for injection. let _allStyles = ''; @@ -77,13 +67,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(); - + console.log( ` @@ -99,46 +89,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). +## Contribute to Fabric React + +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 -## Roadmap +Before you get started, **make sure you have [node.js](https://nodejs.org/) and [git](https://git-scm.com/) installed.** -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. +To view the documentation including examples, contracts, component status, and to add functionality or fix issues locally, you can: -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! +1. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git` +2. `npm install` +3. `npm start` -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 +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. -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. +To build and run tests for all packages in the repo, you can run `npm run build` from the root. -## Trello board +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.) -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. +## Testing +For testing see our [testing documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/TESTING.md). -## Browser support +## Advanced building tips -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. +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 +``` -## Contribute to Fabric React +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.) -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 can also build up to a specific project using the `--to ` argument. For example, to build up to `office-ui-fabric-react`, you can run: +```bash +rush build --to office-ui-fabric-react +``` ## Licenses diff --git a/apps/fabric-website/.npmrc b/apps/fabric-website/.npmrc new file mode 100644 index 00000000000000..825c83e09df4da --- /dev/null +++ b/apps/fabric-website/.npmrc @@ -0,0 +1,2 @@ +registry=https://registry.npmjs.org/ + diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json index ac3998a25d25ee..8f555cf5ef13f1 100644 --- a/apps/fabric-website/CHANGELOG.json +++ b/apps/fabric-website/CHANGELOG.json @@ -1,6 +1,1223 @@ { "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 ", + "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", + "date": "Mon, 19 Mar 2018 10:27:55 GMT", + "comments": { + "patch": [ + { + "author": "Mark Polak ", + "commit": "882c389076125182e5703ad5eb64ae178546f6c4", + "comment": "Use arrow function properties instead of @autobind" + } + ], + "minor": [ + { + "author": "lynamemi ", + "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", + "date": "Wed, 14 Mar 2018 10:28:26 GMT", + "comments": { + "minor": [ + { + "author": "lynamemi ", + "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", + "date": "Tue, 13 Mar 2018 20:00:06 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "0904a98019ac935ed975f6188624cc68df477a25", + "comment": "Hide left nav on mobile." + } + ] + } + }, + { + "version": "5.3.3", + "tag": "@uifabric/fabric-website_v5.3.3", + "date": "Fri, 09 Mar 2018 11:13:58 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Thu, 01 Mar 2018 00:05:10 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Fri, 16 Feb 2018 11:23:29 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Mon, 22 Jan 2018 11:14:27 GMT", + "comments": { + "minor": [ + { + "author": "lynamemi ", + "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", + "date": "Fri, 22 Dec 2017 11:10:56 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Sat, 16 Dec 2017 05:07:22 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "e329c53575a45272da4d28dbc725804f7fac4062", + "comment": "GetStarted Page: More specific selectors for button with link to deal with UHF styles." + } + ], + "minor": [ + { + "author": "David Zearing ", + "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", + "date": "Thu, 14 Dec 2017 11:23:17 GMT", + "comments": { + "minor": [ + { + "author": "lynamemi ", + "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", + "date": "Wed, 06 Dec 2017 11:24:52 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Tue, 05 Dec 2017 02:04:27 GMT", + "comments": { + "patch": [ + { + "author": "Eddie Liu ", + "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", + "date": "Mon, 20 Nov 2017 11:12:47 GMT", + "comments": { + "patch": [ + { + "author": "Eddie Liu ", + "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", + "date": "Fri, 17 Nov 2017 17:36:36 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Tue, 31 Oct 2017 10:22:25 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Fri, 27 Oct 2017 10:25:09 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Tue, 24 Oct 2017 10:21:08 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Wed, 18 Oct 2017 10:21:25 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "5c408b0984d9d83323a2b3b22aa50b3768c2d711", + "comment": "TextField documentation style updates" + }, + { + "author": "lynamemi ", + "commit": "745cec67c600088d6d0423ed4daed8e1c8ed2909", + "comment": "Removed branding guidance pdf, updated fabric asset license pdf, and fixed link colors" + }, + { + "author": "lynamemi ", + "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", + "date": "Mon, 16 Oct 2017 20:00:51 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Thu, 12 Oct 2017 10:20:49 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "95f1a37bad9be2a5ab0d56ec6ea5e23dc7192230", + "comment": "Added Implementation Examples section to ComponentPage" + }, + { + "author": "erichdev ", + "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", + "date": "Mon, 09 Oct 2017 10:08:09 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "9a399cc9187ec81611acec92655e3393878e28e1", + "comment": "Added/removed Best Practices links for component pages that had/didn't have a Best Practices section." + }, + { + "author": "lynamemi ", + "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", + "date": "Fri, 06 Oct 2017 10:18:41 GMT", + "comments": { + "patch": [ + { + "author": "Jon Schectman ", + "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", + "date": "Wed, 04 Oct 2017 22:40:22 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "ca3473a1d65c8124901173ee0aeb7c7af5b220ef", + "comment": "Updated ResourcePage text and made padding more rtl friendly." + }, + { + "author": "lynamemi ", + "commit": "f9ff40b02ab05a1a3542b90a9f4e2fe51a6d42ed", + "comment": "Added section in Get Started page to document how to use icons in components." + }, + { + "author": "lynamemi ", + "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", + "date": "Fri, 29 Sep 2017 10:20:24 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "47af278daa76bc638871139ce6b0294edb8c9edb", + "comment": "Added initializeIcons() call to make all icons in examples on the website available." + }, + { + "author": "lynamemi ", + "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", + "date": "Thu, 28 Sep 2017 10:19:12 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "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", + "date": "Wed, 27 Sep 2017 00:20:58 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Fri, 22 Sep 2017 19:08:51 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "6812dbed7f05c698eb687bf7cf3d3481b4fe642b", + "comment": "Reinforced header tag styles across website pages to manage UHF counter-styles." + }, + { + "author": "lynamemi ", + "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", + "date": "Thu, 21 Sep 2017 06:23:58 GMT", + "comments": { + "patch": [ + { + "author": "John Miller ", + "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665", + "comment": "Brand icons page clean up." + }, + { + "author": "lynamemi ", + "commit": "4482809c3554c0147d37cffe8e4fa1e696be0f23", + "comment": "Updated reference to Fabric Core to the newly released 7.3.0 version." + }, + { + "author": "John Miller ", + "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665", + "comment": "Added a test case for dogfood check" + }, + { + "author": "John Miller ", + "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665", + "comment": "Initial loading spinner gif changed to mimic our spinner component." + }, + { + "author": "John Miller ", + "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 ", + "commit": "726494444365d178707d5605e9f6b63e099a0ff2", + "comment": "Removed trello reference from the Get Stated page." + }, + { + "author": "lynamemi ", + "commit": "98ac26378c4aa6493d419a720cc759590f5ea37d", + "comment": "Styling to fix UHF header overriding our styles." + }, + { + "author": "John Miller ", + "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 ", + "commit": "df65d1d5a44b0058256079c99cb7783233cdfedc", + "comment": "Visual bug fixes to accommodate UHF" + }, + { + "author": "lynamemi ", + "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", + "date": "Wed, 20 Sep 2017 10:19:01 GMT", + "comments": { + "patch": [ + { + "author": "Kris Brown ", + "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", + "date": "Tue, 19 Sep 2017 10:08:55 GMT", + "comments": { + "patch": [ + { + "author": "John Miller ", + "commit": "5c586f0d68efe83ed9eb7fa95e2f8926c566122d", + "comment": "Revised alt text best practes for ImageComponent." + }, + { + "author": "John Miller ", + "commit": "c258bfc71bb9d3a9aca60d75553d1db57410a343", + "comment": "Removed references to FabricJS from the website." + }, + { + "author": "John Miller ", + "commit": "055dd03c8ad9d74843f2bc3445d529a3c1fd8cb5", + "comment": "Visual bug fixes for UHF adoption for website" + } + ], + "major": [ + { + "author": "John Miller ", + "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", + "date": "Fri, 01 Sep 2017 16:51:57 GMT", + "comments": { + "patch": [ + { + "author": "Christian Gonzalez ", + "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", + "date": "Thu, 31 Aug 2017 15:41:56 GMT", + "comments": { + "patch": [ + { + "author": "Christian Gonzalez ", + "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", + "date": "Tue, 29 Aug 2017 20:55:35 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Wed, 23 Aug 2017 19:04:55 GMT", + "comments": { + "patch": [ + { + "author": "lynamemi ", + "commit": "f9295f56a26a91d6fd35776490ca91d7ae83bd40", + "comment": "Removed Trello reference" + }, + { + "author": "lynamemi ", + "commit": "d13adf8353d706d583a1e217135890ceaf6e49ff", + "comment": "Updated branding guidance pdf from the cdn." + }, + { + "author": "lynamemi ", + "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", + "date": "Mon, 21 Aug 2017 10:19:29 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Fri, 18 Aug 2017 16:32:33 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Fri, 11 Aug 2017 19:38:35 GMT", + "comments": { + "minor": [ + { + "author": "John Miller ", + "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", + "date": "Thu, 03 Aug 2017 10:13:03 GMT", + "comments": { + "patch": [ + { + "author": "Ryo Miyake ", + "commit": "c45ae1e1ba8ce08542de3f670c548e598a48ffc3", + "comment": "Fix utility class names, apply \"ms-\" prefix" + } + ], + "minor": [ + { + "author": "David Zearing ", + "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", + "date": "Fri, 21 Jul 2017 10:21:45 GMT", + "comments": { + "patch": [ + { + "author": "Peter Jahn ", + "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", + "date": "Sat, 08 Jul 2017 03:34:35 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Tue, 27 Jun 2017 01:26:31 GMT", + "comments": { + "patch": [ + { + "author": "Christian Gonzalez ", + "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", + "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", + "date": "Wed, 14 Jun 2017 06:02:15 GMT", + "comments": { + "patch": [ + { + "author": "David Zearing ", + "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", + "date": "Tue, 13 Jun 2017 10:13:21 GMT", + "comments": { + "patch": [ + { + "author": "Mike Wheaton ", + "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", + "date": "Mon, 12 Jun 2017 01:47:18 GMT", + "comments": { + "patch": [ + { + "author": "Christian Gonzalez ", + "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", + "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", + "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", + "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", + "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", + "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", + "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", + "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", + "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", + "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", + "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 8dba09bcbe253b..c385f0d33db7fe 100644 --- a/apps/fabric-website/CHANGELOG.md +++ b/apps/fabric-website/CHANGELOG.md @@ -1,16 +1,423 @@ # 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 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 + +### 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 + +### Minor changes + +- Theme generator: exposing to the website. + +## 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 + +### 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 + +### 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 + +### Patches + +- Left nav: Less jittery and component pages load in full height. + +## 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 + +### 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 + +### 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 + +### Minor changes + +- GetStarted page: updated to better reflect the current Fabric workflows. + +## 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 + +### Patches + +- Fix ScrollablePane page title + +## 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 + +### Patches + +- Updated asset license to newest version. + +## 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 + +### Patches + +- Fixed initializeIcons call to pull from cdn instead of dist. + +## 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 + +### 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 + +### Patches + +- Updating to Fabric Core 9.0 + +## 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 + +### 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 + +### 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 + +### 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 + +### 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 + +### Patches + +- Updated links in the SharePoint section of the ResourcesPage. + +## 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 + +### 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 + +### 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 + +### Patches + +- Changing high-contrast colors to system colors + +## 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 + +### Patches + +- Publish resize group on fabric-website + +## 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 + +### Patches + +- Adjusted build to produce sourcemaps with correct sourceRoot. + +## 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 + +### Patches + +- Updating project dependencies. + +## 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 + +### 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 + +### 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 + +### Patches + +- Remove erroneous usage of baseUrl to fix link to color accessibility guide + +## 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 + +### Patches + +- Enable forceConsistentCasingInFileNames tsconfig option + +## 4.5.39 +Wed, 21 Jun 2017 00:45:41 GMT + +*Version update only* + +## 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 + +### Patches + +- Fix issues with dev.office.com header + +## 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 + +*Version update only* + +## 4.5.34 +Tue, 06 Jun 2017 07:41:47 GMT + +*Version update only* + +## 4.5.33 +Tue, 06 Jun 2017 06:06:46 GMT + +*Version update only* + +## 4.5.32 +Tue, 06 Jun 2017 00:50:06 GMT + +*Version update only* + +## 4.5.31 +Fri, 02 Jun 2017 01:19:36 GMT + +*Version update only* + +## 4.5.30 +Thu, 01 Jun 2017 16:34:03 GMT + +*Version update only* + +## 4.5.29 +Wed, 31 May 2017 01:58:23 GMT + +*Version update only* + +## 4.5.28 +Tue, 30 May 2017 20:23:45 GMT + +*Version update only* + +## 4.5.27 +Tue, 30 May 2017 03:27:20 GMT + +*Version update only* + +## 4.5.26 +Fri, 26 May 2017 10:21:03 GMT + +*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/README.md b/apps/fabric-website/README.md index c59fab37bf310c..07dc1eb7fadc06 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). +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). -- - - +- - - 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/config/pre-copy.json b/apps/fabric-website/config/pre-copy.json new file mode 100644 index 00000000000000..baf19c00de4c5b --- /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/gulpfile.js b/apps/fabric-website/gulpfile.js deleted file mode 100644 index 04b3e087fb2501..00000000000000 --- a/apps/fabric-website/gulpfile.js +++ /dev/null @@ -1,57 +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 -); -build.tslint.setConfig({ - lintConfig: { rules }, - sourceMatch: ['src/**/*.ts', 'src/**/*.tsx', '!src/**/*.scss.tsx'] -}); -// TODO: remove this! There are a number of lint errors to fix. -build.tslint.isEnabled = () => false; - -// Configure TypeScript. -build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript')); - -build.text.setConfig({ textMatch: ['src/**/*.txt', 'src/**/*.Example.tsx', 'src/**/*.Props.ts'] }); - -build.postCopy.setConfig({ - copyTo: { - [distFolder]: [ - 'src/**/*.png', - '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'] }); - -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; - -// initialize tasks. -build.initialize(gulp); diff --git a/apps/fabric-website/homepage.htm b/apps/fabric-website/homepage.htm new file mode 100644 index 00000000000000..1699835101d087 --- /dev/null +++ b/apps/fabric-website/homepage.htm @@ -0,0 +1,80 @@ + + +
+
+ Loading +
+
+ + \ No newline at end of file diff --git a/apps/fabric-website/index.html b/apps/fabric-website/index.html index 9d9079489db5ac..4a0ec3a93ccfa4 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; @@ -30,31 +29,12 @@
- Loading
- - - - - - \ 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 9088588c2adbcb..00000000000000 --- 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 4109e49ee9262a..8d6e9cd2610268 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": "5.5.1", "description": "Reusable React components for building experiences for Office 365.", "main": "lib/index.js", "typings": "lib/index.d.ts", @@ -9,50 +9,37 @@ "url": "https://github.com/OfficeDev/office-ui-fabric-react" }, "scripts": { - "build": "gulp", - "clean": "gulp clean", - "start": "gulp serve" + "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", + "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": { - "@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", - "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.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" + "@types/es6-promise": "0.0.32", + "@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/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-highlight": "^0.10.0", + "write-file-webpack-plugin": "^4.1.0" }, "dependencies": { - "@uifabric/example-app-base": "1.3.13", + "@microsoft/load-themed-styles": "^1.7.13", "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.32.0 <3.0.0", - "@uifabric/utilities": ">=1.10.0 <2.0.0" + "json-loader": "^0.5.7", + "office-ui-fabric-react": ">=5.70.0 <6.0.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 38f28d927bf303..00000000000000 --- 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.scss b/apps/fabric-website/src/components/App/App.scss index c50357077e9a67..247d3048affa83 100644 --- a/apps/fabric-website/src/components/App/App.scss +++ b/apps/fabric-website/src/components/App/App.scss @@ -2,163 +2,82 @@ @import '../../styles/mixins'; :global { - .App { - background-color: $ms-color-neutralDark; - justify-content: center; - } - // Element that wraps everything except for the header .App-wrapper { - display: flex; - flex-direction: column; margin: 0 auto; max-width: $App-maximumWidth; - 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 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; - } + position: relative; } // Nav is hidden off screen by default .App-nav { -webkit-overflow-scrolling: touch; // Improves scrolling performance - bottom: 0; - @include left(-$Nav-width); overflow-y: auto; - position: fixed; - top: $Header-height + $App-mobileNavBarHeight; - transition: $ms-duration2 $ms-ease1; - @include transition-property(left); + 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. } .App-content { @include contentPadding(); 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-duration2 $ms-ease1; + 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 $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; - } - } - // Overlay to dim content and dismiss the mobile nav (hidden by default) - .App-mobileNavOverlay { - display: none; - } + // 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); + } - // 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) { - .App.is-navOpen { - bottom: 0; - left: 0; - overflow: hidden; - position: absolute; - right: 0; + .App-nav { top: 0; - - .App-mobileNavBar { - @include padding-left(36px); // Align to menu items - } - - .App-mobileNavOverlay { - background: transparent; - bottom: 0; - display: block; - position: absolute; - @include left($Nav-width); - @include right(0); - top: 0; - z-index: 1; - } - - .App-nav { - @include left(0); - } - - .App-content { - @include left($Nav-width); - opacity: 0.5; // Dim the content - } + bottom: 0; + overflow-y: auto; + overflow-x: hidden; } - } - // Show the nav at all times, to the left of the content - @media screen and (min-width: $ms-screen-xl-min) { - .App-wrapper { - flex-direction: row; + .App-content { + max-width: calc(100% - #{$Nav-width}); // IE needs max-width, it was ignoring width + width: calc(100% - #{$Nav-width}); + @include ms-left($Nav-width); } + } - .App-mobileNavBar { - display: none; + @media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) { + .App { + @include ms-padding-right($App-padding-right-sm); + @include ms-padding-left($App-padding-left-sm); } .App-nav { - @include left(auto); - top: auto; // Mobile nav bar is no longer there - position: relative; - overflow-y: visible + @include ms-margin-left(18px); } .App-content { - margin-top: 0; // Mobile nav bar is no longer there - flex-grow: unset; width: calc(100% - #{$Nav-width}); - } - - // Reset values for the nav and content if opened on larger screens - .App.is-navOpen { - .App-nav { - @include left(auto); - } - - .App-content { - @include left(auto); - } + @include ms-left($Nav-width + 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 a57f726f2cd16f..38b5c98c5e03ad 100644 --- a/apps/fabric-website/src/components/App/App.tsx +++ b/apps/fabric-website/src/components/App/App.tsx @@ -1,82 +1,113 @@ 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 { Footer } from '../Footer/Footer'; -import { Header } from '../Header/Header'; +import AttachedScrollUtility from '../../utilities/AttachedScrollUtility'; +import { Fabric } from 'office-ui-fabric-react/lib/Fabric'; import { Nav } from '../Nav/Nav'; export interface IAppProps extends React.Props { } export interface IAppState { - isNavOpen: boolean; + isAttached: boolean; + navHeight: number; } export class App extends React.Component { + private _attachedScrollThreshold: number; + private _appContent: HTMLDivElement; + private _appContentRect: ClientRect; + constructor(props: IAppProps) { super(props); this.state = { - isNavOpen: false + isAttached: false }; } - public render() { - let { isNavOpen } = this.state; + public componentDidMount() { + window.addEventListener('scroll', this._handleNavPositioning); + window.addEventListener('resize', this._handleNavPositioning); - let toggleIcon; - let siteTitle; - if (isNavOpen) { - toggleIcon = ; - siteTitle = ''; - } else { - toggleIcon = ; - siteTitle =
Fabric
; - } + this._attachedScrollThreshold = AttachedScrollUtility.calculateAttachedScrollThreshold(); + this._handleNavPositioning(); + } + + public componentWillUnmount() { + window.removeEventListener('scroll', this._handleNavPositioning); + window.removeEventListener('resize', this._handleNavPositioning); + } + + public render() { + let { navHeight } = this.state; + let navPosition: 'fixed' | 'absolute' = this.state.isAttached ? 'fixed' : 'absolute'; + let navStyle = { + height: navHeight, + position: navPosition + }; return ( - -
+
-
- - { siteTitle } -
-
-
-