@storybook/angular 6.5.0-alpha.2 → 6.5.0-alpha.23

package/dist/ts3.4/client/preview/angular-beta/utils/NgComponentAnalyzer.d.ts

@@ -1,4 +1,4 @@
-import { Component, Input, Output, Type } from '@angular/core';
+import { Component, Type } from '@angular/core';
 export declare type ComponentInputsOutputs = {
     inputs: {
         propName: string;
@@ -19,7 +19,9 @@ export declare const isComponent: (component: any) => component is Type<unknown>
  * Returns all component decorator properties
  * is used to get all `@Input` and `@Output` Decorator
  */
-export declare const getComponentPropsDecoratorMetadata: (component: any) => Record<string, (Input | Output)[]>;
+export declare const getComponentPropsDecoratorMetadata: (component: any) => {
+    [key: string]: any[];
+};
 /**
  * Returns component decorator `@Component`
  */

package/dist/ts3.4/server/angular-cli-webpack-older.d.ts

@@ -48,7 +48,7 @@ export declare function getWebpackConfig(baseConfig: webpack.Configuration, opti
     mode?: "development" | "production" | "none";
     name?: string;
     context?: string;
-    devtool?: webpack.Options.Devtool;
+    devtool?: string | boolean;
     output?: webpack.Output;
     externals?: string | RegExp | webpack.ExternalsObjectElement | webpack.ExternalsFunctionElement | webpack.ExternalsElement[];
     target?: "node" | "web" | "webworker" | "async-node" | "node-webkit" | "atom" | "electron" | "electron-renderer" | "electron-preload" | "electron-main" | ((compiler?: any) => void);
@@ -68,5 +68,6 @@ export declare function getWebpackConfig(baseConfig: webpack.Configuration, opti
     performance?: false | webpack.Options.Performance;
     parallelism?: number;
     optimization?: webpack.Options.Optimization;
+    infrastructureLogging?: webpack.Options.InfrastructureLogging;
     devServer?: import("webpack-dev-server").Configuration;
 }>;

package/dist/ts3.4/server/framework-preset-angular.d.ts

@@ -1,4 +1,5 @@
 import { Configuration } from 'webpack';
-export declare function webpack(config: Configuration, { configDir }: {
+export declare function webpack(config: Configuration, { configDir, angularBuilderContext }: {
     configDir: string;
-}): Configuration;
+    angularBuilderContext: any;
+}): Promise<Configuration>;

package/dist/ts3.9/builders/utils/run-compodoc.js

@@ -10,18 +10,23 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.runCompodoc = void 0;
 var child_process_1 = require("child_process");
 var rxjs_1 = require("rxjs");
+var hasTsConfigArg = function (args) { return args.indexOf('-p') !== -1; };
 exports.runCompodoc = function (_a, context) {
     var compodocArgs = _a.compodocArgs, tsconfig = _a.tsconfig;
     return new rxjs_1.Observable(function (observer) {
         var finalCompodocArgs = __spreadArrays([
-            // Default options
-            '-p',
-            tsconfig,
+            'compodoc'
+        ], (hasTsConfigArg(compodocArgs) ? [] : ['-p', tsconfig]), [
             '-d',
             "" + context.workspaceRoot
         ], compodocArgs);
         try {
-            var child = child_process_1.spawn('compodoc', finalCompodocArgs);
+            context.logger.info(finalCompodocArgs.join(' '));
+            var child = child_process_1.spawn('npx', finalCompodocArgs, {
+                cwd: context.workspaceRoot,
+                env: process.env,
+                shell: true,
+            });
             child.stdout.on('data', function (data) {
                 context.logger.info(data.toString());
             });

package/dist/ts3.9/client/preview/angular-beta/ComputesTemplateFromComponent.js

@@ -93,6 +93,25 @@ exports.computesTemplateSourceFromComponent = function (component, initialProps,
     return buildTemplate(ngComponentMetadata.selector, '', templateInputs, templateOutputs);
 };
 var buildTemplate = function (selector, innerTemplate, inputs, outputs) {
+    // https://www.w3.org/TR/2011/WD-html-markup-20110113/syntax.html#syntax-elements
+    var voidElements = [
+        'area',
+        'base',
+        'br',
+        'col',
+        'command',
+        'embed',
+        'hr',
+        'img',
+        'input',
+        'keygen',
+        'link',
+        'meta',
+        'param',
+        'source',
+        'track',
+        'wbr',
+    ];
     var firstSelector = selector.split(',')[0];
     var templateReplacers = [
         [/(^.*?)(?=[,])/, '$1'],
@@ -102,7 +121,14 @@ var buildTemplate = function (selector, innerTemplate, inputs, outputs) {
         [/#([\w-]+)/, " id=\"$1\""],
         [/((\.[\w-]+)+)/, function (_, c) { return " class=\"" + c.split(templateObject_1 || (templateObject_1 = __makeTemplateObject(["."], ["."]))).join(templateObject_2 || (templateObject_2 = __makeTemplateObject([" "], [" "]))).trim() + "\""; }],
         [/(\[.+?])/g, function (_, a) { return " " + a.slice(1, -1); }],
-        [/([\S]+)(.*)/, "<$1$2" + inputs + outputs + ">" + innerTemplate + "</$1>"],
+        [
+            /([\S]+)(.*)/,
+            function (template, elementSelector) {
+                return voidElements.some(function (element) { return elementSelector === element; })
+                    ? template.replace(/([\S]+)(.*)/, "<$1$2" + inputs + outputs + " />")
+                    : template.replace(/([\S]+)(.*)/, "<$1$2" + inputs + outputs + ">" + innerTemplate + "</$1>");
+            },
+        ],
     ];
     return templateReplacers.reduce(function (prevSelector, _a) {
         var searchValue = _a[0], replacer = _a[1];

package/dist/ts3.9/client/preview/angular-beta/utils/NgComponentAnalyzer.d.ts

@@ -1,4 +1,4 @@
-import { Component, Input, Output, Type } from '@angular/core';
+import { Component, Type } from '@angular/core';
 export declare type ComponentInputsOutputs = {
     inputs: {
         propName: string;
@@ -19,7 +19,9 @@ export declare const isComponent: (component: any) => component is Type<unknown>
  * Returns all component decorator properties
  * is used to get all `@Input` and `@Output` Decorator
  */
-export declare const getComponentPropsDecoratorMetadata: (component: any) => Record<string, (Input | Output)[]>;
+export declare const getComponentPropsDecoratorMetadata: (component: any) => {
+    [key: string]: any[];
+};
 /**
  * Returns component decorator `@Component`
  */

package/dist/ts3.9/client/preview/angular-beta/utils/NgComponentAnalyzer.js

@@ -20,6 +20,7 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentDecoratorMetadata = exports.getComponentPropsDecoratorMetadata = exports.isComponent = exports.isDeclarable = exports.getComponentInputsOutputs = void 0;
 var core_1 = require("@angular/core");
+var reflectionCapabilities = new core_1.ɵReflectionCapabilities();
 /**
  * Returns component Inputs / Outputs by browsing these properties and decorator
  */
@@ -70,20 +71,14 @@ exports.isDeclarable = function (component) {
     if (!component) {
         return false;
     }
-    var decoratorKey = '__annotations__';
-    var decorators = Reflect.getOwnPropertyDescriptor(component, decoratorKey)
-        ? Reflect.getOwnPropertyDescriptor(component, decoratorKey).value
-        : component[decoratorKey];
+    var decorators = reflectionCapabilities.annotations(component);
     return !!(decorators || []).find(function (d) { return d instanceof core_1.Directive || d instanceof core_1.Pipe || d instanceof core_1.Component; });
 };
 exports.isComponent = function (component) {
     if (!component) {
         return false;
     }
-    var decoratorKey = '__annotations__';
-    var decorators = Reflect.getOwnPropertyDescriptor(component, decoratorKey)
-        ? Reflect.getOwnPropertyDescriptor(component, decoratorKey).value
-        : component[decoratorKey];
+    var decorators = reflectionCapabilities.annotations(component);
     return (decorators || []).some(function (d) { return d instanceof core_1.Component; });
 };
 /**
@@ -91,34 +86,12 @@ exports.isComponent = function (component) {
  * is used to get all `@Input` and `@Output` Decorator
  */
 exports.getComponentPropsDecoratorMetadata = function (component) {
-    var decoratorKey = '__prop__metadata__';
-    var propsDecorators = Reflect &&
-        Reflect.getOwnPropertyDescriptor &&
-        Reflect.getOwnPropertyDescriptor(component, decoratorKey)
-        ? Reflect.getOwnPropertyDescriptor(component, decoratorKey).value
-        : component[decoratorKey];
-    var parent = Reflect && Reflect.getPrototypeOf && Reflect.getPrototypeOf(component);
-    if (parent) {
-        var parentPropsDecorators = exports.getComponentPropsDecoratorMetadata(parent);
-        propsDecorators = __assign(__assign({}, parentPropsDecorators), propsDecorators);
-    }
-    return propsDecorators;
+    return reflectionCapabilities.propMetadata(component);
 };
 /**
  * Returns component decorator `@Component`
  */
 exports.getComponentDecoratorMetadata = function (component) {
-    var decoratorKey = '__annotations__';
-    var decorators = Reflect &&
-        Reflect.getOwnPropertyDescriptor &&
-        Reflect.getOwnPropertyDescriptor(component, decoratorKey)
-        ? Reflect.getOwnPropertyDescriptor(component, decoratorKey).value
-        : component[decoratorKey];
-    if (!decorators) {
-        return (component.decorators &&
-            component.decorators[0] &&
-            component.decorators[0].args &&
-            component.decorators[0].args[0]);
-    }
-    return decorators.find(function (d) { return d instanceof core_1.Component; });
+    var decorators = reflectionCapabilities.annotations(component);
+    return decorators.reverse().find(function (d) { return d instanceof core_1.Component; });
 };

package/dist/ts3.9/client/preview/angular-beta/utils/NgModulesAnalyzer.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isComponentAlreadyDeclaredInModules = void 0;
 var core_1 = require("@angular/core");
+var reflectionCapabilities = new core_1.ɵReflectionCapabilities();
 /**
  * Avoid component redeclaration
  *
@@ -27,12 +28,7 @@ exports.isComponentAlreadyDeclaredInModules = function (componentToFind, moduleD
 };
 var extractNgModuleMetadata = function (importItem) {
     var target = importItem && importItem.ngModule ? importItem.ngModule : importItem;
-    var decoratorKey = '__annotations__';
-    var decorators = Reflect &&
-        Reflect.getOwnPropertyDescriptor &&
-        Reflect.getOwnPropertyDescriptor(target, decoratorKey)
-        ? Reflect.getOwnPropertyDescriptor(target, decoratorKey).value
-        : target[decoratorKey];
+    var decorators = reflectionCapabilities.annotations(target);
     if (!decorators || decorators.length === 0) {
         return null;
     }

package/dist/ts3.9/client/preview/decorateStory.js

@@ -22,12 +22,14 @@ exports.decorateStory = void 0;
 var store_1 = require("@storybook/store");
 var ComputesTemplateFromComponent_1 = require("./angular-beta/ComputesTemplateFromComponent");
 function decorateStory(mainStoryFn, decorators) {
-    var returnDecorators = __spreadArrays([cleanArgsDecorator], decorators).reduce(function (previousStoryFn, decorator) { return function (context) {
-        var decoratedStory = decorator(function (update) {
-            return previousStoryFn(__assign(__assign({}, context), store_1.sanitizeStoryContextUpdate(update)));
-        }, context);
-        return decoratedStory;
-    }; }, function (context) { return prepareMain(mainStoryFn(context), context); });
+    var returnDecorators = __spreadArrays([cleanArgsDecorator], decorators).reduce(function (previousStoryFn, decorator) {
+        return function (context) {
+            var decoratedStory = decorator(function (update) {
+                return previousStoryFn(__assign(__assign({}, context), store_1.sanitizeStoryContextUpdate(update)));
+            }, context);
+            return decoratedStory;
+        };
+    }, function (context) { return prepareMain(mainStoryFn(context), context); });
     return returnDecorators;
 }
 exports.default = decorateStory;

package/dist/ts3.9/client/preview/decorators.js

@@ -23,27 +23,31 @@ var ComputesTemplateFromComponent_1 = require("./angular-beta/ComputesTemplateFr
 var NgComponentAnalyzer_1 = require("./angular-beta/utils/NgComponentAnalyzer");
 // We use `any` here as the default type rather than `Args` because we need something that is
 // castable to any component-specific args type when the user is being careful.
-exports.moduleMetadata = function (metadata) { return function (storyFn) {
-    var story = storyFn();
-    var storyMetadata = story.moduleMetadata || {};
-    metadata = metadata || {};
-    return __assign(__assign({}, story), { moduleMetadata: {
-            declarations: __spreadArrays((metadata.declarations || []), (storyMetadata.declarations || [])),
-            entryComponents: __spreadArrays((metadata.entryComponents || []), (storyMetadata.entryComponents || [])),
-            imports: __spreadArrays((metadata.imports || []), (storyMetadata.imports || [])),
-            schemas: __spreadArrays((metadata.schemas || []), (storyMetadata.schemas || [])),
-            providers: __spreadArrays((metadata.providers || []), (storyMetadata.providers || [])),
-        } });
-}; };
-exports.componentWrapperDecorator = function (element, props) { return function (storyFn, storyContext) {
-    var story = storyFn();
-    var currentProps = typeof props === 'function' ? props(storyContext) : props;
-    var template = NgComponentAnalyzer_1.isComponent(element)
-        ? ComputesTemplateFromComponent_1.computesTemplateFromComponent(element, currentProps !== null && currentProps !== void 0 ? currentProps : {}, story.template)
-        : element(story.template);
-    return __assign(__assign(__assign({}, story), { template: template }), (currentProps || story.props
-        ? {
-            props: __assign(__assign({}, currentProps), story.props),
-        }
-        : {}));
-}; };
+exports.moduleMetadata = function (metadata) {
+    return function (storyFn) {
+        var story = storyFn();
+        var storyMetadata = story.moduleMetadata || {};
+        metadata = metadata || {};
+        return __assign(__assign({}, story), { moduleMetadata: {
+                declarations: __spreadArrays((metadata.declarations || []), (storyMetadata.declarations || [])),
+                entryComponents: __spreadArrays((metadata.entryComponents || []), (storyMetadata.entryComponents || [])),
+                imports: __spreadArrays((metadata.imports || []), (storyMetadata.imports || [])),
+                schemas: __spreadArrays((metadata.schemas || []), (storyMetadata.schemas || [])),
+                providers: __spreadArrays((metadata.providers || []), (storyMetadata.providers || [])),
+            } });
+    };
+};
+exports.componentWrapperDecorator = function (element, props) {
+    return function (storyFn, storyContext) {
+        var story = storyFn();
+        var currentProps = typeof props === 'function' ? props(storyContext) : props;
+        var template = NgComponentAnalyzer_1.isComponent(element)
+            ? ComputesTemplateFromComponent_1.computesTemplateFromComponent(element, currentProps !== null && currentProps !== void 0 ? currentProps : {}, story.template)
+            : element(story.template);
+        return __assign(__assign(__assign({}, story), { template: template }), (currentProps || story.props
+            ? {
+                props: __assign(__assign({}, currentProps), story.props),
+            }
+            : {}));
+    };
+};

package/dist/ts3.9/server/angular-cli-webpack-13.x.x.js

@@ -54,7 +54,7 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
 };
 // Private angular devkit stuff
 var generateI18nBrowserWebpackConfigFromContext = require('@angular-devkit/build-angular/src/utils/webpack-browser-config').generateI18nBrowserWebpackConfigFromContext;
-var _a = require('@angular-devkit/build-angular/src/webpack/configs'), getCommonConfig = _a.getCommonConfig, getStylesConfig = _a.getStylesConfig, getTypescriptWorkerPlugin = _a.getTypescriptWorkerPlugin;
+var _a = require('@angular-devkit/build-angular/src/webpack/configs'), getCommonConfig = _a.getCommonConfig, getStylesConfig = _a.getStylesConfig, getDevServerConfig = _a.getDevServerConfig, getTypeScriptConfig = _a.getTypeScriptConfig;
 var TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 var filterOutStylingRules = require('./utils/filter-out-styling-rules').filterOutStylingRules;
 /**
@@ -76,7 +76,11 @@ exports.getWebpackConfig = function (baseConfig, _a) {
                         // Default options
                         index: 'noop-index', main: 'noop-main', outputPath: 'noop-out' }, builderOptions), { 
                         // Fixed options
-                        optimization: false, namedChunks: false, progress: false, buildOptimizer: false, aot: false }), builderContext, function (wco) { return [getCommonConfig(wco), getStylesConfig(wco), getTypescriptWorkerPlugin(wco)]; })];
+                        optimization: false, namedChunks: false, progress: false, buildOptimizer: false, aot: false }), builderContext, function (wco) { return [
+                        getCommonConfig(wco),
+                        getStylesConfig(wco),
+                        getTypeScriptConfig ? getTypeScriptConfig(wco) : getDevServerConfig(wco),
+                    ]; })];
                 case 1:
                     cliConfig = (_e.sent()).config;
                     entry = __spreadArrays(baseConfig.entry, ((_b = cliConfig.entry.styles) !== null && _b !== void 0 ? _b : []), ((_c = cliConfig.entry.polyfills) !== null && _c !== void 0 ? _c : []));

package/dist/ts3.9/server/angular-cli-webpack-older.d.ts

@@ -48,7 +48,7 @@ export declare function getWebpackConfig(baseConfig: webpack.Configuration, opti
     mode?: "development" | "production" | "none";
     name?: string;
     context?: string;
-    devtool?: webpack.Options.Devtool;
+    devtool?: string | boolean;
     output?: webpack.Output;
     externals?: string | RegExp | webpack.ExternalsObjectElement | webpack.ExternalsFunctionElement | webpack.ExternalsElement[];
     target?: "node" | "web" | "webworker" | "async-node" | "node-webkit" | "atom" | "electron" | "electron-renderer" | "electron-preload" | "electron-main" | ((compiler?: any) => void);
@@ -68,5 +68,6 @@ export declare function getWebpackConfig(baseConfig: webpack.Configuration, opti
     performance?: false | webpack.Options.Performance;
     parallelism?: number;
     optimization?: webpack.Options.Optimization;
+    infrastructureLogging?: webpack.Options.InfrastructureLogging;
     devServer?: import("webpack-dev-server").Configuration;
 }>;

package/dist/ts3.9/server/framework-preset-angular-cli.js

@@ -1,4 +1,8 @@
 "use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -74,6 +78,7 @@ var node_logger_1 = require("@storybook/node-logger");
 var architect_1 = require("@angular-devkit/architect");
 var find_up_1 = require("find-up");
 var semver_1 = __importDefault(require("@storybook/semver"));
+var ts_dedent_1 = __importDefault(require("ts-dedent"));
 var core_1 = require("@angular-devkit/core");
 var module_is_available_1 = require("./utils/module-is-available");
 var angular_cli_webpack_12_2_x_1 = require("./angular-cli-webpack-12.2.x");
@@ -111,7 +116,7 @@ function webpackFinal(baseConfig, options) {
                                         case 2:
                                             legacyDefaultOptions = _a.sent();
                                             return [2 /*return*/, angular_cli_webpack_13_x_x_1.getWebpackConfig(_baseConfig, {
-                                                    builderOptions: __assign(__assign({}, builderOptions), legacyDefaultOptions),
+                                                    builderOptions: __assign(__assign({ watch: options.configType === 'DEVELOPMENT' }, legacyDefaultOptions), builderOptions),
                                                     builderContext: builderContext,
                                                 })];
                                     }
@@ -208,6 +213,7 @@ function getLegacyDefaultBuildOptions(options) {
                         // Not use legacy way with builder (`angularBrowserTarget` is defined or null with builder and undefined without)
                         return [2 /*return*/, {}];
                     }
+                    node_logger_1.logger.warn(ts_dedent_1.default(templateObject_1 || (templateObject_1 = __makeTemplateObject(["Your Storybook startup uses a solution that will not be supported in version 7.0. \n            You must use angular builder to have an explicit configuration on the project used in angular.json\n            Read more at:\n            - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#sb-angular-builder)\n            - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#angular13)\n          "], ["Your Storybook startup uses a solution that will not be supported in version 7.0. \n            You must use angular builder to have an explicit configuration on the project used in angular.json\n            Read more at:\n            - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#sb-angular-builder)\n            - https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#angular13)\n          "]))));
                     dirToSearch = process.cwd();
                     _b.label = 1;
                 case 1:
@@ -243,3 +249,4 @@ function getLegacyDefaultBuildOptions(options) {
         });
     });
 }
+var templateObject_1;

package/dist/ts3.9/server/framework-preset-angular.d.ts

@@ -1,4 +1,5 @@
 import { Configuration } from 'webpack';
-export declare function webpack(config: Configuration, { configDir }: {
+export declare function webpack(config: Configuration, { configDir, angularBuilderContext }: {
     configDir: string;
-}): Configuration;
+    angularBuilderContext: any;
+}): Promise<Configuration>;

package/dist/ts3.9/server/framework-preset-angular.js

@@ -10,6 +10,61 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 var __spreadArrays = (this && this.__spreadArrays) || function () {
     for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
     for (var r = Array(s), k = 0, i = 0; i < il; i++)
@@ -23,52 +78,76 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.webpack = void 0;
 var path_1 = __importDefault(require("path"));
+var semver_1 = __importDefault(require("@storybook/semver"));
 var webpack_1 = require("webpack");
 var autoprefixer_1 = __importDefault(require("autoprefixer"));
 var ts_config_1 = __importDefault(require("./ts_config"));
 var create_fork_ts_checker_plugin_1 = __importDefault(require("./create-fork-ts-checker-plugin"));
 function webpack(config, _a) {
-    var configDir = _a.configDir;
-    var tsLoaderOptions = ts_config_1.default(configDir);
-    return __assign(__assign({}, config), { module: __assign(__assign({}, config.module), { rules: __spreadArrays(config.module.rules, [
-                {
-                    test: /\.tsx?$/,
-                    use: [
-                        {
-                            loader: require.resolve('ts-loader'),
-                            options: tsLoaderOptions,
-                        },
-                        { loader: path_1.default.resolve(__dirname, 'ngx-template-loader') },
-                    ],
-                },
-                {
-                    test: /[/\\]@angular[/\\]core[/\\].+\.js$/,
-                    parser: { system: true },
-                },
-                {
-                    test: /\.html$/,
-                    loader: require.resolve('raw-loader'),
-                    exclude: /\.async\.html$/,
-                },
-                {
-                    test: /\.s(c|a)ss$/,
-                    use: [
-                        { loader: require.resolve('raw-loader') },
-                        {
-                            loader: require.resolve('postcss-loader'),
-                            options: {
-                                postcssOptions: {
-                                    plugins: [autoprefixer_1.default()],
-                                },
-                            },
-                        },
-                        { loader: require.resolve('sass-loader') },
-                    ],
-                },
-            ]) }), resolve: __assign({}, config.resolve), plugins: __spreadArrays(config.plugins, [
-            // See https://github.com/angular/angular/issues/11580#issuecomment-401127742
-            new webpack_1.ContextReplacementPlugin(/@angular(\\|\/)core(\\|\/)(fesm5|bundles)/, path_1.default.resolve(__dirname, '..')),
-            create_fork_ts_checker_plugin_1.default(tsLoaderOptions),
-        ]) });
+    var configDir = _a.configDir, angularBuilderContext = _a.angularBuilderContext;
+    return __awaiter(this, void 0, void 0, function () {
+        var angularCliVersion, error_1, tsLoaderOptions;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    _b.trys.push([0, 2, , 3]);
+                    return [4 /*yield*/, Promise.resolve().then(function () { return __importStar(require('@angular/cli')); }).then(function (m) {
+                            return semver_1.default.coerce(m.VERSION.full);
+                        })];
+                case 1:
+                    angularCliVersion = _b.sent();
+                    if ((semver_1.default.satisfies(angularCliVersion, '12.2.x') && angularBuilderContext) ||
+                        semver_1.default.satisfies(angularCliVersion, '>=13.0.0')) {
+                        return [2 /*return*/, config];
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_1 = _b.sent();
+                    return [3 /*break*/, 3];
+                case 3:
+                    tsLoaderOptions = ts_config_1.default(configDir);
+                    return [2 /*return*/, __assign(__assign({}, config), { module: __assign(__assign({}, config.module), { rules: __spreadArrays(config.module.rules, [
+                                    {
+                                        test: /\.tsx?$/,
+                                        use: [
+                                            {
+                                                loader: require.resolve('ts-loader'),
+                                                options: tsLoaderOptions,
+                                            },
+                                            { loader: path_1.default.resolve(__dirname, 'ngx-template-loader') },
+                                        ],
+                                    },
+                                    {
+                                        test: /[/\\]@angular[/\\]core[/\\].+\.js$/,
+                                        parser: { system: true },
+                                    },
+                                    {
+                                        test: /\.html$/,
+                                        loader: require.resolve('raw-loader'),
+                                        exclude: /\.async\.html$/,
+                                    },
+                                    {
+                                        test: /\.s(c|a)ss$/,
+                                        use: [
+                                            { loader: require.resolve('raw-loader') },
+                                            {
+                                                loader: require.resolve('postcss-loader'),
+                                                options: {
+                                                    postcssOptions: {
+                                                        plugins: [autoprefixer_1.default()],
+                                                    },
+                                                },
+                                            },
+                                            { loader: require.resolve('sass-loader') },
+                                        ],
+                                    },
+                                ]) }), resolve: __assign({}, config.resolve), plugins: __spreadArrays(config.plugins, [
+                                // See https://github.com/angular/angular/issues/11580#issuecomment-401127742
+                                new webpack_1.ContextReplacementPlugin(/@angular(\\|\/)core(\\|\/)(fesm5|bundles)/, path_1.default.resolve(__dirname, '..')),
+                                create_fork_ts_checker_plugin_1.default(tsLoaderOptions),
+                            ]) })];
+            }
+        });
+    });
 }
 exports.webpack = webpack;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "6.5.0-alpha.2",
+  "version": "6.5.0-alpha.23",
   "description": "Storybook for Angular: Develop Angular Components in isolation with Hot Reloading.",
   "keywords": [
     "storybook"
@@ -45,15 +45,15 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@storybook/addons": "6.5.0-alpha.2",
-    "@storybook/api": "6.5.0-alpha.2",
-    "@storybook/core": "6.5.0-alpha.2",
-    "@storybook/core-common": "6.5.0-alpha.2",
-    "@storybook/core-events": "6.5.0-alpha.2",
+    "@storybook/addons": "6.5.0-alpha.23",
+    "@storybook/api": "6.5.0-alpha.23",
+    "@storybook/core": "6.5.0-alpha.23",
+    "@storybook/core-common": "6.5.0-alpha.23",
+    "@storybook/core-events": "6.5.0-alpha.23",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/node-logger": "6.5.0-alpha.2",
+    "@storybook/node-logger": "6.5.0-alpha.23",
     "@storybook/semver": "^7.3.2",
-    "@storybook/store": "6.5.0-alpha.2",
+    "@storybook/store": "6.5.0-alpha.23",
     "@types/node": "^14.14.20 || ^16.0.0",
     "@types/webpack-env": "^1.16.0",
     "autoprefixer": "^9.8.6",
@@ -70,7 +70,7 @@
     "regenerator-runtime": "^0.13.7",
     "sass-loader": "^10.1.0",
     "strip-json-comments": "3.1.1",
-    "telejson": "^5.3.2",
+    "telejson": "^5.3.3",
     "ts-dedent": "^2.0.0",
     "ts-loader": "^8.0.14",
     "tsconfig-paths-webpack-plugin": "^3.3.0",
@@ -86,14 +86,12 @@
     "@angular/compiler": "^11.2.14",
     "@angular/compiler-cli": "^11.2.14",
     "@angular/core": "^11.2.14",
-    "@angular/elements": "^11.2.14",
     "@angular/forms": "^11.2.14",
     "@angular/platform-browser": "^11.2.14",
     "@angular/platform-browser-dynamic": "^11.2.14",
     "@nrwl/workspace": "^11.6.3",
     "@types/autoprefixer": "^9.7.2",
     "@types/jest": "^26.0.16",
-    "@webcomponents/custom-elements": "^1.4.3",
     "jest": "^26.6.3",
     "jest-preset-angular": "^8.3.2",
     "ts-jest": "^26.4.4"
@@ -107,13 +105,11 @@
     "@angular/compiler": ">=6.0.0",
     "@angular/compiler-cli": ">=6.0.0",
     "@angular/core": ">=6.0.0",
-    "@angular/elements": ">=6.0.0",
     "@angular/forms": ">=6.0.0",
     "@angular/platform-browser": ">=6.0.0",
     "@angular/platform-browser-dynamic": ">=6.0.0",
     "@babel/core": "*",
     "@nrwl/workspace": ">=11.1.0",
-    "@webcomponents/custom-elements": ">=1.4.3",
     "rxjs": "^6.0.0 || ^7.4.0",
     "typescript": "^3.4.0 || >=4.0.0",
     "zone.js": "^0.8.29 || ^0.9.0 || ^0.10.0 || ^0.11.0"
@@ -122,14 +118,8 @@
     "@angular/cli": {
       "optional": true
     },
-    "@angular/elements": {
-      "optional": true
-    },
     "@nrwl/workspace": {
       "optional": true
-    },
-    "@webcomponents/custom-elements": {
-      "optional": true
     }
   },
   "engines": {
@@ -139,5 +129,5 @@
     "access": "public"
   },
   "builders": "dist/ts3.9/builders/builders.json",
-  "gitHead": "ca9d89393f36d156e34819fe120eb7e6819245f4"
+  "gitHead": "0006ec45ff04e42229dbee92cc49764699477e1b"
 }