Merge pull request #1 from interactivellama/sudowork-global-header-avatar

Add global header tests

Author: sudowork

.eslintrc.json

@@ -12,7 +12,7 @@
 			"modules": true
 		}
 	},
-	"plugins": ["filenames", "json"],
+	"plugins": ["filenames", "json", "prefer-object-spread"],
 	"env": {
 		"browser": true
 	},
@@ -112,6 +112,8 @@
 		"no-tabs": "off",
 		// _ is not really private.
 		"no-underscore-dangle": ["error", { "allowAfterThis": true }],
+		//
+		"prefer-object-spread/prefer-object-spread": [2, "always"],
 		// Increases readability of function name
 		"space-before-function-paren": [2, "always"],
 

.github/config.yml

@@ -0,0 +1,28 @@
+# Configuration for new-issue-welcome - https://github.com/behaviorbot/new-issue-welcome
+
+# Comment to be posted to on first time issues
+newIssueWelcomeComment: >
+  Thanks for opening your first issue! :wave: 
+
+  If you have found this library helpful, please star it. A maintainer will try to respond within 7 days. If you haven’t heard anything by then, please bump this thread.
+
+# Configuration for new-pr-welcome - https://github.com/behaviorbot/new-pr-welcome
+
+# Comment to be posted to on PRs from first time contributors in your repository
+newPRWelcomeComment: >
+  Thanks for opening this pull request! :100: 
+    
+  This is a community-driven project, and we can't do it without your participation. Please check out our [contributing guidelines](https://github.com/salesforce/design-system-react/blob/master/CONTRIBUTING.md) and review the Contributor Checklist if you haven't already, to make sure everything is squared away. TravisCI will take about 10 minutes to run through the same items that are on the Contributor checklist with a pass/fail check below. Please fix any issues that cause TravisCI to fail or ask for clarification--we try, but sometimes the errors can be unclear.
+
+  A maintainer will try to respond within 7 days. If you haven’t heard anything by then, please bump this thread.
+
+# Configuration for first-pr-merge - https://github.com/behaviorbot/first-pr-merge
+
+# Comment to be posted to on pull requests merged by a first time user
+firstPRMergeComment: >
+  Congrats on merging your first pull request to Design System React! :tada:
+ 
+  On behalf of Salesforce's customers, partners, product specialists and employees, we would like offer sincere thanks and appreciation for helping make our user experience better. We look forward to working with you more in the future.
+  
+  ![Alt Text](https://media.giphy.com/media/lcYFNTaz4U9jy/giphy.gif)
+

.storybook/middleware.js

@@ -12,6 +12,15 @@ const expressMiddleWare = (router) => {
 			)
 		)
 	);
+	router.use(
+		'/assets',
+		express.static(
+			path.join(
+				__dirname,
+				'../assets/'
+			)
+		)
+	);
 };
 
 module.exports = expressMiddleWare;

.travis.yml

@@ -5,7 +5,7 @@ node_js:
 install:
   - npm install npm -g
   - npm config set audit false
-  - npm ci
+  - npm install
 script:
   - npm run travis-ci
 env:

README.md

@@ -28,7 +28,7 @@ Welcome to the project! :wave: This library is the [React](https://facebook.gith
 
 ### Quick Setup (CommonJS)
 
-For a no hassle setup and compatibility with Create React App v1, a CommonJS version has been included within the NPM package to allow usage without transpiling. Use the following named `import` syntax to access CommonJS components from `/lib/index.js`:
+For a no hassle setup and compatibility with Create React App v1, a CommonJS version has been included within the NPM package. If using this setup, please re-write the `import` statement in the documentation site examples. Use the following named `import` syntax to access CommonJS components from `/lib/index.js`:
 
 ```
 import { Button } from '@salesforce/design-system-react';
@@ -59,10 +59,6 @@ import Button from '@salesforce/design-system-react/components/button';
 
 This library does not contain any Cascading Style Sheets (CSS). You will need to add `<link rel="stylesheet" type="text/css"  href="/node_modules/@salesforce-ux/design-system/assets/styles/salesforce-lightning-design-system.min.css" />` to your page and serve that file from a publicly available folder.
 
-### Icon Usage
-
-Prior to v0.7.0, SLDS icons were bundled with the JavaScript. The 400KB+ icons bundle from [SLDS](https://www.lightningdesignsystem.com/) is no longer included. You will need to download the SLDS CSS and icons separately.
-
 #### Serve icons publicly
 
 Typically, scripts should be downloaded in the background without blocking the DOM. With React, this works best with [server side rendering](https://reactjs.org/docs/react-dom-server.html#rendertostaticmarkup). SLDS recommends placeholder stencils while scripts are initializing if the HTML cannot be served immediately. If you can serve the HTML, then icon SVGs should not be bundled and served like any other file. Set a path `context` for all child components with `<IconSettings>` at the top of your render tree:
@@ -85,7 +81,7 @@ ReactDOM.render(
 
 ```
 // ExpressJS example
-app.use('/assets/icons', express.static('node_modules/@salesforce-ux/icons/dist/salesforce-lightning-design-system-icons/'));
+app.use('/assets/icons', express.static('node_modules/@salesforce-ux/design-system/assets/icons/'));
 ```
 
 #### Bundle icons
@@ -94,7 +90,6 @@ If you use a module bundler, like Webpack, you can let your module bundler manag
 
 ```
 import IconSettings from '@salesforce/design-system-react/components/icon-settings';
-
 import standardSprite from '@salesforce-ux/design-system/assets/icons/standard-sprite/svg/symbols.svg';
 ...
 ...
@@ -107,6 +102,10 @@ ReactDOM.render(
 )
 ```
 
+### Icon Usage
+
+Prior to v0.7.0, SLDS icons were bundled with the JavaScript. The 400KB+ icons bundle from [SLDS](https://www.lightningdesignsystem.com/) is no longer included. You will need to download the SLDS CSS and icons separately.
+
 Bundled script files are provided _only_ for convenience. Do not use in production.
 
 * `design-system-react.min.js` (700KB+) - includes icons in the JavaScript

RELEASENOTES.md

@@ -31,55 +31,133 @@ These are changes that have backwards-compatible solutions present and that comp
 
 ### Latest Release
 
+## Release 0.8.21
+
+**Bugfixes**
+
+* Positioning behavior of Dialog components that use nubbins has changed. This applies to `Popover`, `Tooltip`, `Datepicker`, `Dropdown`. Previously the nubbin would be misaligned due to hardcoded margins that would get added onto the dialog component. It will now instead calculate the offsets and include them in the positioning logic and add/subtract from the left and top.
+
+* Dialogs that use nubbins would previously have the nubbins point at the location on the reference trigger component (i.e. `Button`). Details:
+    * If a Popover had an align of `top left`, that meant the nubbin would point at the top left hand side of the `Button`.
+    * The behavior now is that the nubbin will always position the Dialog element as needed to ensure it points at the center of the desired side.
+    * In the case of a `top left` align the left will only designate the location of the nubbin on the Dialog.
+    * We may decide to bring back the ability to control both the nubbin location on the Dialog, but also the location at which it points to on the reference element. Much of the logic surrounding nubbins has been broken at the seams and edge cases for a long time. This change has been done in order to provide a more robust and dependable solution.
+    * Any dialog that uses an `offset` prop will need to be manually readjusted.
+    * Deprecate `offset` prop for `Dropdown` and `Popover`. The manual setting of positional offset of dialog components has been deemed unreliable. Position logic has been re-written to deliver better and more reliable positioning. Please create an issue if you have an edge case not covered by the built-in logic.
+    * In the future we may change the props on some of these Dialog components to ensure a more consistent positioning API with hopefully some less head-scratching in terms of how to use it. This may include deprecating certain props and introduction of other props.
+
+
+## Release 0.8.20
+
+**Bugfixes**
+
+* Fix bug in `Dropdown` component where getIndexByValue() needs to look at nextProps.options when componentWillreceiveProps() is called.
+* Datepicker: Make year Combobox menu width match the width of its input/button.
+
+**Maintenance**
+
+* Documentation update on how to use Design System React within Create React App.
+* Consolidate assistiveText props under one object for the following: `DataTable`, `Icon`, `Search`, `PanelFilterGroup`, `Spinner`, `Tree`, `TextArea`.
+
+## Release 0.8.19
+
+**Major Features**
+
+* Add Illustration Component
+
+**Bugfixes**
+
+* Make `Slider` a controlled component. Use `value` and `onChange` props.
+* `Combobox`: Allow PopperJS to position menu correctly when menu hits the screen or overflow ancestor boundary.
+* Update `Tree` branch and item to use latest SLDS HTML tags
+* Update `Alert` error icon
+
+**Maintenance**
+
+* Add `getting-started.md` to NPM module
+* Document copying over SLDS fonts to public for Create React App
+* Update `Radio` component examples
+* Remove `Object.assign()` from codebase and replace with spread
+* Consolidate `assistiveText` props under one object. This is going to deprecate many props, but will make props more consistent across all the components.
+  * `AppLauncherSection`
+  * `Avatar`
+  * `Breadcrumb`
+  * `ButtonStateful`
+  * `Button`
+  * `GlobalHeader`
+  * `GlobalNavigationBarDropdown`
+
+## Release 0.8.18
+
+**Bugfixes**
+
+* `Icon` uses new values for `name` and `category` when changed.
+* Fixes console error that appears when using keyboard navigation to navigate the tree.
+
+**Maintenance**
+
+* `url-exists` utility uses `fetch` instead of `xmlHttpRequest`.
+
+## Release 0.8.17
+
+**Bugfixes**
+
+* REVERT [Change inline edit for accessibility](https://github.com/salesforce/design-system-react/pull/1332). It will not be updated. There is a new View/Edit Record Input pattern that uses the [Docked Former Footer component](http://www.lightningdesignsystem.com/components/docked-form-footer/) and this should be used instead of the Inline Edit Input in the future.
+
+**Minor features**
+
+* `dropdown` prop added to `DataTableRowActions` to increase customization of the dropdown menu
+* `tabIndex` added to `MenuDropdown` component
+* `Picklist` has been removed from examples. Please use a Combobox instead.
+
 ## Release 0.8.16
 
 **Deprecation**
 TL:DR; If you use the source code directly, update your form component paths and the parameters in `onChange`. All others stay the same for now.
+
 * Moves `Input`, `Checkbox`, and `Textarea` out of `component/forms` and directly into `component/`. Old paths such as `component/forms/input` will still work, but include a console warning as deprecated.
 * `components/input`, `components/checkbox`, and `components/textarea` pass different parameters into the `onChange` callback. `onChange` now passes in `event, { checked }` if the new paths are used. The parameters used to be `checked, event, { checked }`. If you use the new paths such as `components/input`, please update your parameter variables. This aligns the callback's parameters with the rest of the library's callback functions.
 * If you consume the library with named imports `{[component]} from '@salesforce/design-system-react'`, you will recieve the warning and will need to use the old parameter order until the next breaking change.
 * For more information, please review #1350.
 
 **Minor features**
+
 * Update `Tree` example to be hashmap in order to promote immutability. Please review `Tree` example on [documentation site](http://react.lightningdesignsystem.com/components/tree/) in order to understand flattened tree data.
 * Add `tabIndex` prop to `MenuDropdown`
 * Update SLDS version to 2.6.0 and test
 
 **Bug fix**
+
 * Dialog components such as Dropdown when used with `menuPosition='overflowBoundaryElement'` now respect `max-width` instead of inherited children width
 * Remove duplicate logo in `GlobalHeader`
 
 **Maintenance**
+
 * Upgrade Babel to v7 and Jest to v23
 
 **Documentation**
-* Remove deprecated Picklist from code base and examples
-
-## Release 0.8.16
 
-**Bugfixes**
-* REVERT [Change inline edit for accessibility](https://github.com/salesforce/design-system-react/pull/1332). It will not be updated. There is a new View/Edit Record Input pattern that uses the [Docked Former Footer component](http://www.lightningdesignsystem.com/components/docked-form-footer/) and this should be used instead of the Inline Edit Input in the future.
-
-**Minor features**
-* `dropdown` prop added to `DataTableRowActions` to increase customization of the dropdown menu
-* `tabIndex` added to `MenuDropdown` component
-* `Picklist` has been removed from examples. Please use a Comboboxe instead.
+* Remove deprecated Picklist from code base and examples
 
 ## Release 0.8.15
+
 **Modals are now at `z-index: 8000`.** If there are items on the main page with a higher `z-index`, they will appear in front of the modal. This setting aligns with the [prescribed z-index in SLDS](https://www.lightningdesignsystem.com/design-tokens/#category-z-index) for `$z-index-overlay`.
 **Require `iconCategory` if `iconName` is set.** `utility` used to be the default icon category. `iconCategory` is now required.
 
 **Major features**
+
 * `@salesforce/design-system-react/module` now contains tree-shaking compatible ES6 modules (Tested with Webpack 4). This should work out of the box (due to `package.json`'s `module` field) and replace CommonJS module usage in Webpack 3 and 4. See [pull request](https://github.com/salesforce/design-system-react/pull/1300) for more details.
 * Tree is now a production component and supports [single selection keyboard navigation](https://www.lightningdesignsystem.com/components/trees/).
 
 **Minor features**
+
 * DataTable: Align header markup with SLDS to fix alignment issues. Remove error for non-boolean attribute `focusable`.
 * Upgrade React Modal to 3.4.4. This is a dependency of `Modal`.
 * Modal: Adds `assistiveText.dialogLabel` to define modal label when there is no header.
 * DataTable: Adds `noHint` prop to actions and makes hints an optional field.
 
 **Bug fix**
+
 * Request icons (console warning) with HTTP GET, so Create React App's webpack dev server doesn't 404
 * Modal no longer jumps to 50% of page.
 * Documentation: Align button group example on site with SLDS example
@@ -90,6 +168,7 @@ TL:DR; If you use the source code directly, update your form component paths and
 * `Dropdown` with `overflowBoundaryElement` and `align=right` use max-width instead of inherited children width.
 
 **Maintenance**
+
 * Require `iconCategory` if `iconName` is set. `utility` used to be the default icon category. `iconCategory` is now required.
 * App Launcher - `assistiveText` is now an object with keys. Please update your component props.
 * Popover - `assistiveText` is now an object with keys. Please update your component props.
@@ -102,50 +181,61 @@ Adds new script storyshots:start that allows interactive viewing of what is bein
 ## Release 0.8.14
 
 **Minor features**
+
 * Tooltip: "Learn more" variant added. Deprecation notice added for `variant: info || error`. Please use `theme` prop going forward instead.
 
 **Bug fix**
+
 * Data Table: Remove console warning when DataTableColumn `sortable` is `true`.
 * Combobox: Trigger onOpen callback when menu opens
 * Datepicker: Focus input if menu was actually open and not just requested to close
 
 ## Release 0.8.13
 
 **Major features**
+
 * Add SLDS Slider
 
 **Minor features**
+
 * Allow importing Lookup [deprecated] subcomponents in CommonJS modules
 
 ## Release 0.8.12
 
 **Minor features**
+
 * Affix position of Dialogs with `hasStaticAlignment` prop. Allows greater control of Tooltip, Popover, and dialog components.
 * Set Datepicker's initial year dropdown menu highlight selection to current selected date.
 
 ## Release 0.8.11
 
 **Minor features**
+
 * Allow `input` label of combobox to show as required
 * Input, Checkbox, and Radio support initial state (uncontrolled) in order to support applications with server-side form submission that are transitioning to atomic state.
 
 **Maintenance**
+
 * Lint warnings from a third-party package have been removed from CI tests.
 
 **Documentation**
+
 * Prop doc typos:
-    * replaced rendered input block to code block
-    * fixed broken link to source of Inline Edit Inputs
+  * replaced rendered input block to code block
+  * fixed broken link to source of Inline Edit Inputs
 
 ## Release 0.8.10
 
 **Minor features**
-* Combobox supports error messages. 
+
+* Combobox supports error messages.
 
 **Outside SLDS pattern added**
+
 * Multiple selection Combobox error messages should be placed after pillboxes with an additional `slds-has-error` wrapping div.
 
 **Maintenance**
+
 * Update Dropdown Menu children description
 * Update SLDS peer dependency to allow 2.6.0-alphas
 * Remove plus-plus (`var++`) instances from library for clarity
@@ -160,6 +250,7 @@ Adds new script storyshots:start that allows interactive viewing of what is bein
 * Combobox menu supports subheadings and line separators.
 
 **Outside SLDS pattern added**
+
 * UX pattern created for Combobox autocomplete that limits subheadings to those that have "child" matching items.
 
 ## Release 0.8.8
@@ -182,7 +273,6 @@ Adds new script storyshots:start that allows interactive viewing of what is bein
 * Document child nodes of `IconSettings`
 * Update `Modal` footer prop description
 
-
 ## Release 0.8.7
 
 **Bugfix**