@storybook/angular 9.0.0-alpha.9 → 9.0.0-beta.1

package/dist/client/angular-beta/AbstractRenderer.js

@@ -177,7 +177,7 @@ class AbstractRenderer {
         const previousStoryRenderInfo = this.previousStoryRenderInfo.get(targetDOMNode);
         const currentStoryRender = {
             storyFnAngular,
-            moduleMetadataSnapshot: (0, telejson_1.stringify)(moduleMetadata, { allowFunction: false }),
+            moduleMetadataSnapshot: (0, telejson_1.stringify)(moduleMetadata, { maxDepth: 50 }),
         };
         this.previousStoryRenderInfo.set(targetDOMNode, currentStoryRender);
         if (

package/dist/client/angular-beta/utils/PropertyExtractor.js

@@ -50,11 +50,9 @@ const uniqueArray = (arr) => {
 };
 exports.uniqueArray = uniqueArray;
 class PropertyExtractor {
-    /* eslint-enable @typescript-eslint/lines-between-class-members */
     constructor(metadata, component) {
         this.metadata = metadata;
         this.component = component;
-        /* eslint-disable @typescript-eslint/lines-between-class-members */
         this.declarations = [];
         /**
          * Analyze NgModule Metadata

package/dist/client/docs/__testfixtures__/doc-button/input.js

@@ -12,7 +12,6 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InputComponent = exports.ButtonAccent = exports.exportedConstant = void 0;
-/* eslint-disable no-underscore-dangle */
 const core_1 = require("@angular/core");
 exports.exportedConstant = 'An exported constant';
 var ButtonAccent;

package/dist/client/docs/compodoc.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.extractComponentDescription = exports.extractArgTypes = exports.extractArgTypesFromData = exports.extractType = exports.findComponentByName = exports.checkValidCompodocJson = exports.checkValidComponentOrDirective = exports.getCompodocJson = exports.setCompodocJson = exports.isMethod = void 0;
-/* eslint-disable no-underscore-dangle */
 const client_logger_1 = require("storybook/internal/client-logger");
 const global_1 = require("@storybook/global");
 const isMethod = (methodOrProp) => {

package/dist/client/docs/sourceDecorator.js

@@ -23,39 +23,31 @@ exports.skipSourceRender = skipSourceRender;
  */
 const sourceDecorator = (storyFn, context) => {
     const story = storyFn();
-    if ((0, exports.skipSourceRender)(context)) {
-        return story;
-    }
-    const channel = preview_api_1.addons.getChannel();
-    const { props, userDefinedTemplate } = story;
-    const { component, argTypes, parameters } = context;
-    const template = parameters.docs?.source?.excludeDecorators
-        ? context.originalStoryFn(context.args, context).template
-        : story.template;
-    let toEmit;
+    const source = (0, preview_api_1.useRef)(undefined);
     (0, preview_api_1.useEffect)(() => {
-        if (toEmit) {
-            const { id, unmappedArgs } = context;
-            const format = parameters?.docs?.source?.format ?? true;
-            channel.emit(docs_tools_1.SNIPPET_RENDERED, {
-                id,
-                args: unmappedArgs,
-                source: toEmit,
-                format: format === true ? 'angular' : format,
-            });
+        if ((0, exports.skipSourceRender)(context)) {
+            return;
         }
-    });
-    if (component && !userDefinedTemplate) {
-        const source = (0, renderer_1.computesTemplateSourceFromComponent)(component, props, argTypes);
-        // We might have a story with a Directive or Service defined as the component
-        // In these cases there might exist a template, even if we aren't able to create source from component
-        if (source || template) {
-            toEmit = source || template;
+        const { props, userDefinedTemplate } = story;
+        const { component, argTypes, parameters } = context;
+        const template = parameters.docs?.source?.excludeDecorators
+            ? context.originalStoryFn(context.args, context).template
+            : story.template;
+        if (component && !userDefinedTemplate) {
+            const sourceFromComponent = (0, renderer_1.computesTemplateSourceFromComponent)(component, props, argTypes);
+            // We might have a story with a Directive or Service defined as the component
+            // In these cases there might exist a template, even if we aren't able to create source from component
+            const newSource = sourceFromComponent || template;
+            if (newSource && newSource !== source.current) {
+                (0, preview_api_1.emitTransformCode)(newSource, context);
+                source.current = newSource;
+            }
         }
-    }
-    else if (template) {
-        toEmit = template;
-    }
+        else if (template && template !== source.current) {
+            (0, preview_api_1.emitTransformCode)(template, context);
+            source.current = template;
+        }
+    });
     return story;
 };
 exports.sourceDecorator = sourceDecorator;

package/dist/client/public-types.d.ts

@@ -26,9 +26,7 @@ export type Decorator<TArgs = StrictArgs> = DecoratorFunction<AngularRenderer, T
 export type Loader<TArgs = StrictArgs> = LoaderFunction<AngularRenderer, TArgs>;
 export type StoryContext<TArgs = StrictArgs> = GenericStoryContext<AngularRenderer, TArgs>;
 export type Preview = ProjectAnnotations<AngularRenderer>;
-/**
- * Utility type that transforms InputSignal and EventEmitter types
- */
+/** Utility type that transforms InputSignal and EventEmitter types */
 type TransformComponentType<T> = TransformInputSignalType<TransformOutputSignalType<TransformEventType<T>>>;
 // @ts-ignore
 type AngularInputSignal<T> = AngularCore.InputSignal<T>;

package/dist/server/angular-cli-webpack.js

@@ -4,28 +4,7 @@ const { generateI18nBrowserWebpackConfigFromContext, } = require('@angular-devki
 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');
-const getAngularWebpackUtils = () => {
-    try {
-        // Angular < 16.1.0
-        const { getCommonConfig, getStylesConfig, getDevServerConfig, getTypeScriptConfig, } = require('@angular-devkit/build-angular/src/webpack/configs');
-        return {
-            getCommonConfig,
-            getStylesConfig,
-            getDevServerConfig,
-            getTypeScriptConfig,
-        };
-    }
-    catch (e) {
-        // Angular > 16.1.0
-        const { getCommonConfig, getStylesConfig, getDevServerConfig, getTypeScriptConfig, } = require('@angular-devkit/build-angular/src/tools/webpack/configs');
-        return {
-            getCommonConfig,
-            getStylesConfig,
-            getDevServerConfig,
-            getTypeScriptConfig,
-        };
-    }
-};
+const { getCommonConfig, getStylesConfig, getDevServerConfig, getTypeScriptConfig, } = require('@angular-devkit/build-angular/src/tools/webpack/configs');
 /**
  * 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.
@@ -36,7 +15,6 @@ const getAngularWebpackUtils = () => {
  */
 exports.getWebpackConfig = async (baseConfig, { builderOptions, builderContext }) => {
     /** Get angular-cli Webpack config */
-    const { getCommonConfig, getStylesConfig, getDevServerConfig, getTypeScriptConfig } = getAngularWebpackUtils();
     const { config: cliConfig } = await generateI18nBrowserWebpackConfigFromContext({
         // Default options
         index: 'noop-index',
@@ -60,6 +38,9 @@ exports.getWebpackConfig = async (baseConfig, { builderOptions, builderContext }
         getStylesConfig(wco),
         getTypeScriptConfig ? getTypeScriptConfig(wco) : getDevServerConfig(wco),
     ]);
+    if (!builderOptions.experimentalZoneless && !cliConfig.entry.polyfills?.includes('zone.js')) {
+        cliConfig.entry.polyfills.push('zone.js');
+    }
     /** Merge baseConfig Webpack with angular-cli Webpack */
     const entry = [
         ...(cliConfig.entry.polyfills ?? []),

package/dist/server/framework-preset-angular-ivy.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.webpack = exports.runNgcc = void 0;
-const node_fs_1 = require("node:fs");
 const node_path_1 = require("node:path");
 /**
  * Source :
@@ -45,31 +44,17 @@ const runNgcc = async () => {
 };
 exports.runNgcc = runNgcc;
 const webpack = async (webpackConfig, options) => {
-    const packageJsonPath = require.resolve('@angular/core/package.json');
-    const packageJson = JSON.parse((0, node_fs_1.readFileSync)(packageJsonPath, 'utf8'));
-    const VERSION = packageJson.version;
     const framework = await options.presets.apply('framework');
     const angularOptions = (typeof framework === 'object' ? framework.options : {});
-    const angularMajorVersion = VERSION.split('.')[0];
-    const isAngular16OrNewer = parseInt(angularMajorVersion, 10) >= 16;
     // Default to true, if undefined
     if (angularOptions.enableIvy === false) {
         return webpackConfig;
     }
-    let extraMainFields = [];
-    if (angularOptions.enableNgcc !== false && !isAngular16OrNewer) {
-        // TODO: Drop if Angular 14 and 15 are not supported anymore
-        (0, exports.runNgcc)();
-        extraMainFields = ['es2015_ivy_ngcc', 'module_ivy_ngcc', 'main_ivy_ngcc'];
-    }
-    if (!isAngular16OrNewer) {
-        extraMainFields.push('es2015');
-    }
     return {
         ...webpackConfig,
         resolve: {
             ...webpackConfig.resolve,
-            mainFields: [...extraMainFields, 'browser', 'module', 'main'],
+            mainFields: ['browser', 'module', 'main'],
         },
     };
 };

package/dist/types.d.ts

@@ -23,6 +23,5 @@ type StorybookConfigFramework = {
 export type StorybookConfig = Omit<StorybookConfigBase, keyof StorybookConfigWebpack | keyof StorybookConfigFramework> & StorybookConfigWebpack & StorybookConfigFramework;
 export interface AngularOptions {
     enableIvy?: boolean;
-    enableNgcc?: boolean;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "9.0.0-alpha.9",
+  "version": "9.0.0-beta.1",
   "description": "Storybook for Angular: Develop Angular components in isolation with hot reloading.",
   "keywords": [
     "storybook",
@@ -52,8 +52,8 @@
     "prep": "rimraf dist && jiti ../../../scripts/prepare/tsc.ts"
   },
   "dependencies": {
-    "@storybook/builder-webpack5": "9.0.0-alpha.9",
-    "@storybook/core-webpack": "9.0.0-alpha.9",
+    "@storybook/builder-webpack5": "9.0.0-beta.1",
+    "@storybook/core-webpack": "9.0.0-beta.1",
     "@storybook/global": "^5.0.0",
     "@types/react": "^18.0.37",
     "@types/react-dom": "^18.0.11",
@@ -62,7 +62,7 @@
     "fd-package-json": "^1.2.0",
     "find-up": "^5.0.0",
     "semver": "^7.3.7",
-    "telejson": "^7.2.0",
+    "telejson": "8.0.0",
     "ts-dedent": "^2.0.0",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
     "util-deprecate": "^1.0.2",
@@ -93,22 +93,22 @@
     "zone.js": "^0.15.0"
   },
   "peerDependencies": {
-    "@angular-devkit/architect": ">=0.1500.0 < 0.2000.0",
-    "@angular-devkit/build-angular": ">=15.0.0 < 20.0.0",
-    "@angular-devkit/core": ">=15.0.0 < 20.0.0",
-    "@angular/animations": ">=15.0.0 < 20.0.0",
-    "@angular/cli": ">=15.0.0 < 20.0.0",
-    "@angular/common": ">=15.0.0 < 20.0.0",
-    "@angular/compiler": ">=15.0.0 < 20.0.0",
-    "@angular/compiler-cli": ">=15.0.0 < 20.0.0",
-    "@angular/core": ">=15.0.0 < 20.0.0",
-    "@angular/forms": ">=15.0.0 < 20.0.0",
-    "@angular/platform-browser": ">=15.0.0 < 20.0.0",
-    "@angular/platform-browser-dynamic": ">=15.0.0 < 20.0.0",
-    "rxjs": "^6.0.0 || ^7.4.0",
-    "storybook": "^9.0.0-alpha.9",
+    "@angular-devkit/architect": ">=0.1800.0 < 0.2000.0",
+    "@angular-devkit/build-angular": ">=18.0.0 < 20.0.0",
+    "@angular-devkit/core": ">=18.0.0 < 20.0.0",
+    "@angular/animations": ">=18.0.0 < 20.0.0",
+    "@angular/cli": ">=18.0.0 < 20.0.0",
+    "@angular/common": ">=18.0.0 < 20.0.0",
+    "@angular/compiler": ">=18.0.0 < 20.0.0",
+    "@angular/compiler-cli": ">=18.0.0 < 20.0.0",
+    "@angular/core": ">=18.0.0 < 20.0.0",
+    "@angular/forms": ">=18.0.0 < 20.0.0",
+    "@angular/platform-browser": ">=18.0.0 < 20.0.0",
+    "@angular/platform-browser-dynamic": ">=18.0.0 < 20.0.0",
+    "rxjs": "^6.5.3 || ^7.4.0",
+    "storybook": "^9.0.0-beta.1",
     "typescript": "^4.9.0 || ^5.0.0",
-    "zone.js": ">= 0.11.1 < 1.0.0"
+    "zone.js": ">=0.14.0"
   },
   "peerDependenciesMeta": {
     "@angular/animations": {
@@ -122,7 +122,7 @@
     }
   },
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=20.0.0"
   },
   "publishConfig": {
     "access": "public"