CHANGELOG.md

@@ -1,3 +1,17 @@
+## 6.4.10 (January 10, 2022)
+
+### Bug Fixes
+
+- Core: Fix process.env assignment ([#17174](https://github.com/storybookjs/storybook/pull/17174))
+- Angular: Fix angular 13.1 JIT error and HMR reload ([#17131](https://github.com/storybookjs/storybook/pull/17131))
+- Router: Fix navigating to hash links ([#17134](https://github.com/storybookjs/storybook/pull/17134))
+- Source-loader: Fix node.declaration edge case ([#17027](https://github.com/storybookjs/storybook/pull/17027))
+- Core: Fix debug output on webpack failures ([#16988](https://github.com/storybookjs/storybook/pull/16988))
+
+### Dependency Upgrades
+
+- Bump cli-table3 to fix colors bug ([#17180](https://github.com/storybookjs/storybook/pull/17180))
+
 ## 6.4.9 (December 9, 2021)
 
 ### Bug Fixes

MIGRATION.md

@@ -17,7 +17,10 @@
   - [Emotion11 quasi-compatibility](#emotion11-quasi-compatibility)
   - [Babel mode v7](#babel-mode-v7)
   - [Loader behavior with args changes](#loader-behavior-with-args-changes)
-  - [Angular component parameter removed](#angular-component-parameter-removed)
+  - [6.4 Angular changes](#64-angular-changes)
+    - [SB Angular builder](#sb-angular-builder)
+    - [Angular13](#angular13)
+    - [Angular component parameter removed](#angular-component-parameter-removed)
   - [6.4 deprecations](#64-deprecations)
     - [Deprecated --static-dir CLI flag](#deprecated---static-dir-cli-flag)
 - [From version 6.2.x to 6.3.0](#from-version-62x-to-630)
@@ -267,7 +270,7 @@ export default {
   title: 'Components/Atoms/Button',
 };
 
-// ✅ undefined 6.3 KO / 7.0 OK
+// ✅ undefined 6.3 OK / 7.0 OK
 export default {
   component: Button,
 };
@@ -470,7 +473,53 @@ This will create a `.babelrc.json` file. This file includes a bunch of babel plu
 
 In 6.4 the behavior of loaders when arg changes occurred was tweaked so loaders do not re-run. Instead the previous value of the loader is passed to the story, irrespective of the new args.
 
-### Angular component parameter removed
+### 6.4 Angular changes
+
+#### SB Angular builder
+
+Since SB6.3, Storybook for Angular supports a builder configuration in your project's `angular.json`. This provides an Angular-style configuration for running and building your Storybook. The full builder documentation will be shown in the [main documentation page](https://storybook.js.org/docs/angular) soon, but for now you can check out an example here:
+
+- `start-storybook`: https://github.com/storybookjs/storybook/blob/next/examples/angular-cli/angular.json#L78
+- `build-storybook`: https://github.com/storybookjs/storybook/blob/next/examples/angular-cli/angular.json#L86
+
+#### Angular13
+
+Angular 13 introduces breaking changes that require updating your Storybook configuration if you are migrating from a previous version of Angular.
+
+Most notably, the documented way of including global styles is no longer supported by Angular13. Previously you could write the following in your `.storybook/preview.js` config:
+
+```
+import '!style-loader!css-loader!sass-loader!./styles.scss';
+```
+
+If you use Angular 13 and above, you should use the builder configuration instead:
+
+```json
+   "my-default-project": {
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "styles": ["src/styles.css", "src/styles.scss"],
+          }
+        }
+      },
+   },
+```
+
+If you need storybook-specific styles separate from your app, you can configure the styles in the [SB Angular builder](#sb-angular-builder), which completely overrides your project's styles:
+
+```json
+      "storybook": {
+        "builder": "@storybook/angular:start-storybook",
+        "options": {
+          "browserTarget": "my-default-project:build",
+          "styles": [".storybook/custom-styles.scss"],
+        },
+      }
+```
+
+#### Angular component parameter removed
 
 In SB6.3 and earlier, the `default.component` metadata was implemented as a parameter, meaning that stories could set `parameters.component` to override the default export. This was an internal implementation that was never documented, but it was mistakenly used in some Angular examples.
 

addons/a11y/README.md

@@ -22,6 +22,8 @@ module.exports = {
 };
 ```
 
+And here's a sample story file to test the addon:
+
 ```js
 import React from 'react';
 

addons/a11y/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "6.4.9",
+  "version": "6.4.10",
   "description": "Test component compliance with web accessibility standards",
   "keywords": [
     "a11y",
@@ -45,14 +45,14 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.4.9",
-    "@storybook/api": "6.4.9",
-    "@storybook/channels": "6.4.9",
-    "@storybook/client-logger": "6.4.9",
-    "@storybook/components": "6.4.9",
-    "@storybook/core-events": "6.4.9",
+    "@storybook/addons": "6.4.10",
+    "@storybook/api": "6.4.10",
+    "@storybook/channels": "6.4.10",
+    "@storybook/client-logger": "6.4.10",
+    "@storybook/components": "6.4.10",
+    "@storybook/core-events": "6.4.10",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/theming": "6.4.9",
+    "@storybook/theming": "6.4.10",
     "axe-core": "^4.2.0",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
@@ -81,7 +81,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d6b59f78a528a5c7922e71d28b583dd31ad67e7d",
+  "gitHead": "7d354c89322080b241454eff2cd3adf9c11306cd",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Accessibility",

addons/actions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "6.4.9",
+  "version": "6.4.10",
   "description": "Get UI feedback when an action is performed on an interactive element",
   "keywords": [
     "storybook",
@@ -41,12 +41,12 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.4.9",
-    "@storybook/api": "6.4.9",
-    "@storybook/components": "6.4.9",
-    "@storybook/core-events": "6.4.9",
+    "@storybook/addons": "6.4.10",
+    "@storybook/api": "6.4.10",
+    "@storybook/components": "6.4.10",
+    "@storybook/core-events": "6.4.10",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/theming": "6.4.9",
+    "@storybook/theming": "6.4.10",
     "core-js": "^3.8.2",
     "fast-deep-equal": "^3.1.3",
     "global": "^4.4.0",
@@ -79,7 +79,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d6b59f78a528a5c7922e71d28b583dd31ad67e7d",
+  "gitHead": "7d354c89322080b241454eff2cd3adf9c11306cd",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Actions",

addons/backgrounds/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "6.4.9",
+  "version": "6.4.10",
   "description": "Switch backgrounds to view components in different settings",
   "keywords": [
     "addon",
@@ -45,13 +45,13 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.4.9",
-    "@storybook/api": "6.4.9",
-    "@storybook/client-logger": "6.4.9",
-    "@storybook/components": "6.4.9",
-    "@storybook/core-events": "6.4.9",
+    "@storybook/addons": "6.4.10",
+    "@storybook/api": "6.4.10",
+    "@storybook/client-logger": "6.4.10",
+    "@storybook/components": "6.4.10",
+    "@storybook/core-events": "6.4.10",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/theming": "6.4.9",
+    "@storybook/theming": "6.4.10",
     "core-js": "^3.8.2",
     "global": "^4.4.0",
     "memoizerific": "^1.11.3",
@@ -77,7 +77,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d6b59f78a528a5c7922e71d28b583dd31ad67e7d",
+  "gitHead": "7d354c89322080b241454eff2cd3adf9c11306cd",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Backgrounds",

addons/controls/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-controls",
-  "version": "6.4.9",
+  "version": "6.4.10",
   "description": "Interact with component inputs dynamically in the Storybook UI",
   "keywords": [
     "addon",
@@ -45,15 +45,15 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.4.9",
-    "@storybook/api": "6.4.9",
-    "@storybook/client-logger": "6.4.9",
-    "@storybook/components": "6.4.9",
-    "@storybook/core-common": "6.4.9",
+    "@storybook/addons": "6.4.10",
+    "@storybook/api": "6.4.10",
+    "@storybook/client-logger": "6.4.10",
+    "@storybook/components": "6.4.10",
+    "@storybook/core-common": "6.4.10",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/node-logger": "6.4.9",
-    "@storybook/store": "6.4.9",
-    "@storybook/theming": "6.4.9",
+    "@storybook/node-logger": "6.4.10",
+    "@storybook/store": "6.4.10",
+    "@storybook/theming": "6.4.10",
     "core-js": "^3.8.2",
     "lodash": "^4.17.21",
     "ts-dedent": "^2.0.0"
@@ -73,7 +73,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d6b59f78a528a5c7922e71d28b583dd31ad67e7d",
+  "gitHead": "7d354c89322080b241454eff2cd3adf9c11306cd",
   "sbmodern": "dist/modern/register.js",
   "storybook": {
     "displayName": "Controls",

addons/docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "6.4.9",
+  "version": "6.4.10",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",
@@ -63,21 +63,21 @@
     "@mdx-js/loader": "^1.6.22",
     "@mdx-js/mdx": "^1.6.22",
     "@mdx-js/react": "^1.6.22",
-    "@storybook/addons": "6.4.9",
-    "@storybook/api": "6.4.9",
-    "@storybook/builder-webpack4": "6.4.9",
-    "@storybook/client-logger": "6.4.9",
-    "@storybook/components": "6.4.9",
-    "@storybook/core": "6.4.9",
-    "@storybook/core-events": "6.4.9",
+    "@storybook/addons": "6.4.10",
+    "@storybook/api": "6.4.10",
+    "@storybook/builder-webpack4": "6.4.10",
+    "@storybook/client-logger": "6.4.10",
+    "@storybook/components": "6.4.10",
+    "@storybook/core": "6.4.10",
+    "@storybook/core-events": "6.4.10",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/csf-tools": "6.4.9",
-    "@storybook/node-logger": "6.4.9",
-    "@storybook/postinstall": "6.4.9",
-    "@storybook/preview-web": "6.4.9",
-    "@storybook/source-loader": "6.4.9",
-    "@storybook/store": "6.4.9",
-    "@storybook/theming": "6.4.9",
+    "@storybook/csf-tools": "6.4.10",
+    "@storybook/node-logger": "6.4.10",
+    "@storybook/postinstall": "6.4.10",
+    "@storybook/preview-web": "6.4.10",
+    "@storybook/source-loader": "6.4.10",
+    "@storybook/store": "6.4.10",
+    "@storybook/theming": "6.4.10",
     "acorn": "^7.4.1",
     "acorn-jsx": "^5.3.1",
     "acorn-walk": "^7.2.0",
@@ -106,11 +106,11 @@
     "@babel/core": "^7.12.10",
     "@emotion/core": "^10.1.1",
     "@emotion/styled": "^10.0.27",
-    "@storybook/angular": "6.4.9",
-    "@storybook/html": "6.4.9",
-    "@storybook/react": "6.4.9",
-    "@storybook/vue": "6.4.9",
-    "@storybook/web-components": "6.4.9",
+    "@storybook/angular": "6.4.10",
+    "@storybook/html": "6.4.10",
+    "@storybook/react": "6.4.10",
+    "@storybook/vue": "6.4.10",
+    "@storybook/web-components": "6.4.10",
     "@types/cross-spawn": "^6.0.2",
     "@types/doctrine": "^0.0.3",
     "@types/enzyme": "^3.10.8",
@@ -140,12 +140,12 @@
     "zone.js": "^0.11.3"
   },
   "peerDependencies": {
-    "@storybook/angular": "6.4.9",
-    "@storybook/html": "6.4.9",
-    "@storybook/react": "6.4.9",
-    "@storybook/vue": "6.4.9",
-    "@storybook/vue3": "6.4.9",
-    "@storybook/web-components": "6.4.9",
+    "@storybook/angular": "6.4.10",
+    "@storybook/html": "6.4.10",
+    "@storybook/react": "6.4.10",
+    "@storybook/vue": "6.4.10",
+    "@storybook/vue3": "6.4.10",
+    "@storybook/web-components": "6.4.10",
     "lit": "^2.0.0",
     "lit-html": "^1.4.1 || ^2.0.0",
     "react": "^16.8.0 || ^17.0.0",
@@ -202,7 +202,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d6b59f78a528a5c7922e71d28b583dd31ad67e7d",
+  "gitHead": "7d354c89322080b241454eff2cd3adf9c11306cd",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Docs",