adding storybook-addon-performance

Author: alexreardon

.storybook/config.js

@@ -1,7 +1,8 @@
 import React from 'react';
 import { addParameters, configure, addDecorator } from '@storybook/react';
 import { create } from '@storybook/theming';
-import GlobalStylesDecorator from './decorator/global-styles';
+import { withPerformance } from 'storybook-addon-performance';
+import GlobalStylesDecorator from './custom-decorators/global-styles';
 // adding css reset - storybook includes a css loader
 import '@atlaskit/css-reset';
 import { colors } from '@atlaskit/theme';
@@ -24,6 +25,7 @@ addParameters({
 
 // Using theme would be good for this, but it looks like theme is just for the chrome around the story
 addDecorator(GlobalStylesDecorator);
+addDecorator(withPerformance);
 
 // automatically import all files ending in *.stories.js
 const req = require.context('../stories/', true, /.stories.js$/);
@@ -40,7 +42,8 @@ const table = Object.prototype.hasOwnProperty.call(console, 'table')
   : console.log;
 
 // Generated by: http://patorjk.com/software/taag/#p=display&f=ANSI%20Shadow&t=rbd
-console.log(`%c
+console.log(
+  `%c
 ██████╗ ██████╗ ██████╗
 ██╔══██╗██╔══██╗██╔══██╗
 ██████╔╝██████╔╝██║  ██║
@@ -49,7 +52,10 @@ console.log(`%c
 ╚═╝  ╚═╝╚═════╝ ╚═════╝
 
 %cBeautiful and accessible drag and drop
-`, `color: ${colors.G200}; font-size: 1.2em; font-weight: bold;`, `color: ${colors.P200}; font-size: 1.2em; font-weight: bold;`);
+`,
+  `color: ${colors.G200}; font-size: 1.2em; font-weight: bold;`,
+  `color: ${colors.P200}; font-size: 1.2em; font-weight: bold;`,
+);
 
 table([
   ['react-beautiful-dnd version', version],

.storybook/decorator/global-styles.jsx renamed to .storybook/custom-decorators/global-styles.jsx

@@ -0,0 +1,3 @@
+module.exports = {
+  addons: ['storybook-addon-performance/register'],
+};

.storybook/main.js

@@ -132,6 +132,7 @@
     "rollup-plugin-size-snapshot": "^0.11.0",
     "rollup-plugin-strip": "^1.2.2",
     "rollup-plugin-terser": "^5.2.0",
+    "storybook-addon-performance": "^0.7.0",
     "styled-components": "5.0.0",
     "stylelint": "^13.0.0",
     "stylelint-config-prettier": "^8.0.1",