@storybook/angular 7.0.0-alpha.8 → 7.0.0-beta.0

package/dist/client/render.d.ts

@@ -0,0 +1,6 @@
+import { RenderContext, ArgsStoryFn } from '@storybook/types';
+import { AngularRenderer } from './types';
+import { RendererFactory } from './angular-beta/RendererFactory';
+export declare const rendererFactory: RendererFactory;
+export declare const render: ArgsStoryFn<AngularRenderer>;
+export declare function renderToCanvas({ storyFn, showMain, forceRemount, storyContext: { parameters, component }, id, }: RenderContext<AngularRenderer>, element: HTMLElement): Promise<void>;

package/dist/{types/client → client}/render.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderToDOM = exports.render = exports.rendererFactory = void 0;
+exports.renderToCanvas = exports.render = exports.rendererFactory = void 0;
 const helpers_1 = require("./angular/helpers");
 const RendererFactory_1 = require("./angular-beta/RendererFactory");
 exports.rendererFactory = new RendererFactory_1.RendererFactory();
 const render = (props) => ({ props });
 exports.render = render;
-async function renderToDOM({ storyFn, showMain, forceRemount, storyContext: { parameters, component }, id, }, element) {
+async function renderToCanvas({ storyFn, showMain, forceRemount, storyContext: { parameters, component }, id, }, element) {
     showMain();
     if (parameters.angularLegacyRendering) {
         (0, helpers_1.renderNgApp)(storyFn, !forceRemount);
@@ -21,4 +21,4 @@ async function renderToDOM({ storyFn, showMain, forceRemount, storyContext: { pa
         targetDOMNode: element,
     });
 }
-exports.renderToDOM = renderToDOM;
+exports.renderToCanvas = renderToCanvas;

package/dist/{types/client → client}/types.d.ts

@@ -1,4 +1,4 @@
-import type { Parameters as DefaultParameters, StoryContext as DefaultStoryContext } from '@storybook/csf';
+import { Parameters as DefaultParameters, StoryContext as DefaultStoryContext, WebRenderer } from '@storybook/types';
 export interface NgModuleMetadata {
     declarations?: any[];
     entryComponents?: any[];
@@ -9,14 +9,6 @@ export interface NgModuleMetadata {
 export interface ICollection {
     [p: string]: any;
 }
-export interface IStorybookStory {
-    name: string;
-    render: (context: any) => any;
-}
-export interface IStorybookSection {
-    kind: string;
-    stories: IStorybookStory[];
-}
 export interface StoryFnAngularReturnType {
     /** @deprecated `component` story input is deprecated, and will be removed in Storybook 7.0. */
     component?: any;
@@ -28,15 +20,19 @@ export interface StoryFnAngularReturnType {
     styles?: string[];
     userDefinedTemplate?: boolean;
 }
-export declare type AngularFramework = {
+/**
+ * @deprecated Use `AngularRenderer` instead.
+ */
+export type AngularFramework = AngularRenderer;
+export interface AngularRenderer extends WebRenderer {
     component: any;
     storyResult: StoryFnAngularReturnType;
-};
-export declare type Parameters = DefaultParameters & {
+}
+export type Parameters = DefaultParameters & {
     /** Uses legacy angular rendering engine that use dynamic component */
     angularLegacyRendering?: boolean;
     bootstrapModuleOptions?: unknown;
 };
-export declare type StoryContext = DefaultStoryContext<AngularFramework> & {
+export type StoryContext = DefaultStoryContext<AngularRenderer> & {
     parameters: Parameters;
 };

package/dist/{types/preset.d.ts → preset.d.ts}

@@ -1,4 +1,4 @@
-import type { PresetProperty } from '@storybook/core-common';
+import { PresetProperty } from '@storybook/types';
 import { StorybookConfig } from './types';
 export declare const addons: PresetProperty<'addons', StorybookConfig>;
 export declare const previewAnnotations: StorybookConfig['previewAnnotations'];

package/dist/{types/preset.js → preset.js}

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.typescript = exports.core = exports.previewAnnotations = exports.addons = void 0;
 const path_1 = __importDefault(require("path"));
 exports.addons = [
-    require.resolve('./server/framework-preset-angular'),
     require.resolve('./server/framework-preset-angular-cli'),
     require.resolve('./server/framework-preset-angular-ivy'),
     require.resolve('./server/framework-preset-angular-docs'),

package/dist/{types/server/__mocks-ng-workspace__/some-config → server/__mocks-ng-workspace__/minimal-config}/tsconfig.json

@@ -8,9 +8,6 @@
         "esModuleInterop": true,
         "skipLibCheck": true,
         "target": "es5",
-        "lib": [
-            "es2017",
-            "dom"
-        ]
+        "lib": ["es2017", "dom"]
     }
 }

package/dist/{types/server/__mocks-ng-workspace__/with-angularBrowserTarget → server/__mocks-ng-workspace__/some-config}/tsconfig.json

@@ -8,9 +8,6 @@
         "esModuleInterop": true,
         "skipLibCheck": true,
         "target": "es5",
-        "lib": [
-            "es2017",
-            "dom"
-        ]
+        "lib": ["es2017", "dom"]
     }
 }

package/dist/{types/server/__mocks-ng-workspace__/minimal-config → server/__mocks-ng-workspace__/with-angularBrowserTarget}/tsconfig.json

@@ -8,9 +8,6 @@
         "esModuleInterop": true,
         "skipLibCheck": true,
         "target": "es5",
-        "lib": [
-            "es2017",
-            "dom"
-        ]
+        "lib": ["es2017", "dom"]
     }
 }

package/dist/{types/server/__mocks-ng-workspace__/without-projects-entry → server/__mocks-ng-workspace__/with-lib}/projects/pattern-lib/tsconfig.lib.json

@@ -9,18 +9,12 @@
         "declarationMap": true,
         "inlineSources": true,
         "types": [],
-        "lib": [
-            "dom",
-            "es2018"
-        ]
+        "lib": ["dom", "es2018"]
     },
     "angularCompilerOptions": {
         "skipTemplateCodegen": true,
         "strictMetadataEmit": true,
         "enableResourceInlining": true
     },
-    "exclude": [
-        "src/test.ts",
-        "**/*.spec.ts"
-    ]
+    "exclude": ["src/test.ts", "**/*.spec.ts"]
 }

package/dist/{types/server → server}/__mocks-ng-workspace__/with-lib/tsconfig.json

@@ -8,9 +8,6 @@
         "esModuleInterop": true,
         "skipLibCheck": true,
         "target": "es5",
-        "lib": [
-            "es2017",
-            "dom"
-        ]
+        "lib": ["es2017", "dom"]
     }
 }

package/dist/server/__mocks-ng-workspace__/with-nx/tsconfig.json

@@ -0,0 +1,14 @@
+{
+    "include": ["./src"],
+    "compilerOptions": {
+        "sourceMap": true,
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "lib": ["es2017", "dom"]
+    }
+}

package/dist/server/__mocks-ng-workspace__/with-nx-workspace/tsconfig.json

@@ -0,0 +1,14 @@
+{
+    "include": ["./src"],
+    "compilerOptions": {
+        "sourceMap": true,
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "lib": ["es2017", "dom"]
+    }
+}

package/dist/server/__mocks-ng-workspace__/with-options-styles/tsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "sourceMap": true,
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "lib": ["es2017", "dom"]
+    }
+}

package/dist/{types/server/__mocks-ng-workspace__/with-lib → server/__mocks-ng-workspace__/without-projects-entry}/projects/pattern-lib/tsconfig.lib.json

@@ -9,18 +9,12 @@
         "declarationMap": true,
         "inlineSources": true,
         "types": [],
-        "lib": [
-            "dom",
-            "es2018"
-        ]
+        "lib": ["dom", "es2018"]
     },
     "angularCompilerOptions": {
         "skipTemplateCodegen": true,
         "strictMetadataEmit": true,
         "enableResourceInlining": true
     },
-    "exclude": [
-        "src/test.ts",
-        "**/*.spec.ts"
-    ]
+    "exclude": ["src/test.ts", "**/*.spec.ts"]
 }

package/dist/server/__mocks-ng-workspace__/without-projects-entry/tsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "sourceMap": true,
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "lib": ["es2017", "dom"]
+    }
+}

package/dist/server/__mocks-ng-workspace__/without-tsConfig/tsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "sourceMap": true,
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "lib": ["es2017", "dom"]
+    }
+}

package/dist/server/__tests__/angular.json

@@ -0,0 +1,96 @@
+{
+    /* angular.json can have comments */
+    // angular.json can have comments
+    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+    "version": 1,
+    "newProjectRoot": "projects",
+    "projects": {
+        "angular-cli": {
+            "root": "",
+            "sourceRoot": "src",
+            "projectType": "application",
+            "prefix": "app",
+            "schematics": {},
+            "architect": {
+                "build": {
+                    "builder": "@angular-devkit/build-angular:browser",
+                    "options": {
+                        "outputPath": "dist/angular-cli",
+                        "index": "src/index.html",
+                        "main": "src/main.ts",
+                        "polyfills": "src/polyfills.ts",
+                        "tsConfig": "src/tsconfig.app.json",
+                        "assets": ["src/favicon.ico", "src/assets"],
+                        "styles": ["src/styles.css", "src/styles.scss"],
+                        "stylePreprocessorOptions": {
+                            "includePaths": ["src/commons"]
+                        },
+                        "scripts": []
+                    },
+                    "configurations": {
+                        "production": {
+                            "fileReplacements": [
+                                {
+                                    "replace": "src/environments/environment.ts",
+                                    "with": "src/environments/environment.prod.ts"
+                                }
+                            ],
+                            "optimization": true,
+                            "outputHashing": "all",
+                            "sourceMap": false,
+                            "extractCss": true,
+                            "namedChunks": false,
+                            "aot": true,
+                            "extractLicenses": true,
+                            "vendorChunk": false,
+                            "buildOptimizer": true
+                        }
+                    }
+                },
+                "serve": {
+                    "builder": "@angular-devkit/build-angular:dev-server",
+                    "options": {
+                        "browserTarget": "angular-cli:build"
+                    },
+                    "configurations": {
+                        "production": {
+                            "browserTarget": "angular-cli:build:production"
+                        }
+                    }
+                },
+                "extract-i18n": {
+                    "builder": "@angular-devkit/build-angular:extract-i18n",
+                    "options": {
+                        "browserTarget": "angular-cli:build"
+                    }
+                },
+                "test": {
+                    "builder": "@angular-devkit/build-angular:karma",
+                    "options": {
+                        "main": "src/karma.ts",
+                        "polyfills": "src/polyfills.ts",
+                        "tsConfig": "src/tsconfig.spec.json",
+                        "karmaConfig": "src/karma.conf.js",
+                        "styles": ["styles.css"],
+                        "scripts": [],
+                        "assets": ["src/favicon.ico", "src/assets"]
+                    }
+                }
+            }
+        },
+        "angular-cli-e2e": {
+            "root": "e2e/",
+            "projectType": "application",
+            "architect": {
+                "e2e": {
+                    "builder": "@angular-devkit/build-angular:protractor",
+                    "options": {
+                        "protractorConfig": "e2e/protractor.conf.js",
+                        "devServerTarget": "angular-cli:serve"
+                    }
+                }
+            }
+        }
+    },
+    "defaultProject": "angular-cli"
+}

package/dist/{types/server/angular-cli-webpack-13.x.x.js → server/angular-cli-webpack.js}

@@ -3,6 +3,7 @@ const { generateI18nBrowserWebpackConfigFromContext, } = require('@angular-devki
 const { getCommonConfig, getStylesConfig, getDevServerConfig, getTypeScriptConfig, } = require('@angular-devkit/build-angular/src/webpack/configs');
 const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 const { filterOutStylingRules } = require('./utils/filter-out-styling-rules');
+const { default: StorybookNormalizeAngularEntryPlugin, } = require('./plugins/storybook-normalize-angular-entry-plugin');
 /**
  * Extract webpack config from angular-cli 13.x.x
  * ⚠️ This file is in JavaScript to not use TypeScript. Because current storybook TypeScript version is not compatible with Angular CLI.
@@ -48,7 +49,11 @@ exports.getWebpackConfig = async (baseConfig, { builderOptions, builderContext }
         ...baseConfig.module,
         rules: [...cliConfig.module.rules, ...rulesExcludingStyles],
     };
-    const plugins = [...(cliConfig.plugins ?? []), ...baseConfig.plugins];
+    const plugins = [
+        ...(cliConfig.plugins ?? []),
+        ...baseConfig.plugins,
+        new StorybookNormalizeAngularEntryPlugin(),
+    ];
     const resolve = {
         ...baseConfig.resolve,
         modules: Array.from(new Set([...baseConfig.resolve.modules, ...cliConfig.resolve.modules])),

package/dist/{types/server → server}/angular-read-workspace.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.findAngularProjectTarget = exports.getDefaultProjectName = exports.readAngularWorkspaceConfig = void 0;
+/* eslint-disable global-require */
 const node_1 = require("@angular-devkit/core/node");
 const core_1 = require("@angular-devkit/core");
 /**
@@ -16,7 +17,6 @@ const readAngularWorkspaceConfig = async (dirToSearch) => {
          * Apologies for the following line
          * If there's a better way to do it, let's do it
          */
-        /* eslint-disable global-require */
         // catch if nx.json does not exist
         require('@nrwl/workspace').readNxJson();
         const nxWorkspace = require('@nrwl/workspace').readWorkspaceConfig({

package/dist/{types/server → server}/framework-preset-angular-cli.d.ts

@@ -1,3 +1,3 @@
 import webpack from 'webpack';
-import type { PresetOptions } from './preset-options';
+import { PresetOptions } from './preset-options';
 export declare function webpackFinal(baseConfig: webpack.Configuration, options: PresetOptions): Promise<webpack.Configuration>;

package/dist/{types/server → server}/framework-preset-angular-cli.js

@@ -30,13 +30,11 @@ exports.webpackFinal = void 0;
 const node_logger_1 = require("@storybook/node-logger");
 const architect_1 = require("@angular-devkit/architect");
 const find_up_1 = require("find-up");
-const semver_1 = __importDefault(require("@storybook/semver"));
-const ts_dedent_1 = __importDefault(require("ts-dedent"));
+const semver_1 = __importDefault(require("semver"));
+const ts_dedent_1 = require("ts-dedent");
 const core_1 = require("@angular-devkit/core");
+const angular_cli_webpack_1 = require("./angular-cli-webpack");
 const module_is_available_1 = require("./utils/module-is-available");
-const angular_cli_webpack_12_2_x_1 = require("./angular-cli-webpack-12.2.x");
-const angular_cli_webpack_13_x_x_1 = require("./angular-cli-webpack-13.x.x");
-const angular_cli_webpack_older_1 = require("./angular-cli-webpack-older");
 const angular_read_workspace_1 = require("./angular-read-workspace");
 async function webpackFinal(baseConfig, options) {
     if (!(0, module_is_available_1.moduleIsAvailable)('@angular-devkit/build-angular')) {
@@ -55,7 +53,7 @@ async function webpackFinal(baseConfig, options) {
                 const builderContext = getBuilderContext(_options);
                 const builderOptions = await getBuilderOptions(_options, builderContext);
                 const legacyDefaultOptions = await getLegacyDefaultBuildOptions(_options);
-                return (0, angular_cli_webpack_13_x_x_1.getWebpackConfig)(_baseConfig, {
+                return (0, angular_cli_webpack_1.getWebpackConfig)(_baseConfig, {
                     builderOptions: {
                         watch: options.configType === 'DEVELOPMENT',
                         ...legacyDefaultOptions,
@@ -65,23 +63,6 @@ async function webpackFinal(baseConfig, options) {
                 });
             },
         },
-        {
-            info: '=> Loading angular-cli config for angular 12.2.x',
-            condition: semver_1.default.satisfies(angularCliVersion, '12.2.x') && options.angularBuilderContext,
-            getWebpackConfig: async (_baseConfig, _options) => {
-                const builderContext = getBuilderContext(_options);
-                const builderOptions = await getBuilderOptions(_options, builderContext);
-                return (0, angular_cli_webpack_12_2_x_1.getWebpackConfig)(_baseConfig, {
-                    builderOptions,
-                    builderContext,
-                });
-            },
-        },
-        {
-            info: '=> Loading angular-cli config for angular lower than 12.2.0',
-            condition: true,
-            getWebpackConfig: angular_cli_webpack_older_1.getWebpackConfig,
-        },
     ];
     const webpackGetter = webpackGetterByVersions.find((wg) => wg.condition);
     node_logger_1.logger.info(webpackGetter.info);
@@ -139,7 +120,7 @@ async function getLegacyDefaultBuildOptions(options) {
         // Not use legacy way with builder (`angularBrowserTarget` is defined or null with builder and undefined without)
         return {};
     }
-    node_logger_1.logger.warn((0, ts_dedent_1.default) `Your Storybook startup uses a solution that will not be supported in version 7.0. 
+    node_logger_1.logger.warn((0, ts_dedent_1.dedent) `Your Storybook startup uses a solution that will not be supported in version 7.0. 
             You must use angular builder to have an explicit configuration on the project used in angular.json
             Read more at:
             - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#sb-angular-builder)

package/dist/server/framework-preset-angular-cli.test.d.ts

@@ -0,0 +1 @@
+export {};