try: add storybook to showcase progressbar from calypso-ui

.storybook/addons.js

@@ -0,0 +1,2 @@
+import '@storybook/addon-actions/register';
+import '@storybook/addon-links/register';

.storybook/config.js

@@ -0,0 +1,9 @@
+import { configure } from '@storybook/react';
+
+// automatically import all files ending in *.stories.js
+const req = require.context( '../', true, /_story\.js$/ );
+function loadStories() {
+	req.keys().forEach( filename => req( filename ) );
+}
+
+configure( loadStories, module );

.storybook/webpack.config.js

@@ -0,0 +1,36 @@
+'use strict';
+
+const path = require( 'path' );
+const util = require( 'util' );
+const SassConfig = require( '@automattic/calypso-build/webpack/sass' );
+const { cssNameFromFilename } = require( '@automattic/calypso-build/webpack/util' );
+
+const outputFilename = '[name].js';
+const outputChunkFilename = '[name].js';
+
+const cssFilename = cssNameFromFilename( outputFilename );
+const cssChunkFilename = cssNameFromFilename( outputChunkFilename );
+
+module.exports = async ( { config } ) => {
+	config.module.rules.push(
+		SassConfig.loader( {
+			preserveCssCustomProperties: true,
+			includePaths: [ path.join( __dirname, '../client' ) ],
+			prelude: `@import '${ path.join(
+				__dirname,
+				'../assets/stylesheets/shared/_utils.scss'
+			) }'; @import '${ path.join(
+				__dirname,
+				'../node_modules/@automattic/calypso-color-schemes/src/calypso-color-schemes.scss'
+			) }';`,
+		} )
+	);
+	config.plugins.push(
+		...SassConfig.plugins( {
+			chunkFilename: cssChunkFilename,
+			filename: cssFilename,
+			minify: false,
+		} )
+	);
+	return config;
+};

client/components/progress-bar/index.js

@@ -0,0 +1 @@
+export { ProgressBar as default } from '@automattic/calypso-ui';

client/components/screen-reader-text/index.js

@@ -1,13 +1 @@
-/**
- * External dependencies
- */
-import React from 'react';
-
-/**
- * Style dependencies
- */
-import './style.scss';
-
-export default function ScreenReaderText( { children } ) {
-	return <span className="screen-reader-text">{ children }</span>;
-}
+export { ScreenReaderText as default } from '@automattic/calypso-ui';