feat(storybook-config): storybook config carbon presets (#7401)

* feat(storybook-config): storybook config carbon presets

* feat(storybook-config): storybook config carbon presets & the package

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

config/storybook-preset-carbon/.npmignore

@@ -0,0 +1,4 @@
+**/__mocks__/**
+**/__tests__/**
+**/examples/**
+**/tasks/**

config/storybook-preset-carbon/index.js

@@ -0,0 +1,30 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+module.exports = {
+  addons: [
+    '@storybook/addon-knobs',
+    '@storybook/addon-actions',
+    '@storybook/addon-links',
+    '@storybook/addon-docs',
+
+    // Phase 1: port over add-ons from packages/react/.storybook
+    // Phase 2: port over webpack config for Sass
+    // Phase 3: port over custom panels/add-ons
+  ],
+
+  // We get the current config and we return the new webpack config
+  webpack(config) {
+    // Configure sass
+    // sass-loader
+    // css-loader, style-loader, postcss-loader, ...
+
+    return config;
+  },
+};

config/storybook-preset-carbon/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "storybook-preset-carbon",
+  "private": true,
+  "version": "0.0.0",
+  "license": "Apache-2.0",
+  "main": "index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/carbon-design-system/carbon.git",
+    "directory": "config/storybook-preset-carbon"
+  },
+  "bugs": "https://github.com/carbon-design-system/carbon/issues",
+  "keywords": [
+    "ibm",
+    "carbon",
+    "carbon-design-system",
+    "components",
+    "react"
+  ],
+  "dependencies": {
+    "@storybook/addon-knobs": "^5.3.19",
+    "@storybook/addon-storysource": "^5.3.19",
+    "@storybook/addon-actions": "^5.3.19",
+    "@storybook/addon-docs": "^5.3.19",
+    "@storybook/addon-links": "^5.3.19"
+  }
+}

packages/react/.storybook/main.js

@@ -10,12 +10,18 @@
 module.exports = {
   addons: [
     '@storybook/addon-storysource',
-    '@storybook/addon-knobs',
-    '@storybook/addon-actions',
-    '@storybook/addon-links',
-    '@storybook/addon-docs',
+
+    'storybook-preset-carbon',
+
+    // Next batch
+    // Copy over to storybook-preset-carbon/index.js (addons)
+    // Move dependencies from react/package.json to storybook-preset-carbon/package.json
+
+    // ...
     '@storybook/addon-notes/register',
     'storybook-readme/register',
+
+    // ...
     require.resolve('./addon-carbon-theme/register'),
   ],
   stories: ['../src/**/*-story.js', '../src/**/*.stories.mdx'],

packages/react/package.json

@@ -72,10 +72,6 @@
     "@babel/preset-react": "^7.10.0",
     "@carbon/test-utils": "^10.13.0",
     "@percy/storybook": "^3.3.1",
-    "@storybook/addon-actions": "^5.3.19",
-    "@storybook/addon-docs": "^5.3.19",
-    "@storybook/addon-knobs": "^5.3.19",
-    "@storybook/addon-links": "^5.3.19",
     "@storybook/addon-notes": "^5.3.19",
     "@storybook/addon-storysource": "^5.3.19",
     "@storybook/addons": "^5.3.19",
@@ -120,6 +116,7 @@
     "rollup-plugin-terser": "^4.0.0",
     "rtlcss": "^2.4.0",
     "sass-loader": "^8.0.2",
+    "storybook-preset-carbon": "^0.0.0",
     "storybook-readme": "^5.0.8",
     "string-replace-loader": "^2.1.0",
     "terser-webpack-plugin": "^2.3.2",