@storybook/angular 8.1.0-alpha.2 → 8.1.0-alpha.4

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

@@ -1,5 +1,5 @@
 import { AnnotatedStoryFn, Args, ComponentAnnotations, DecoratorFunction, LoaderFunction, StoryAnnotations, StoryContext as GenericStoryContext, StrictArgs, ProjectAnnotations } from '@storybook/types';
-import { EventEmitter } from '@angular/core';
+import * as AngularCore from '@angular/core';
 import { AngularRenderer } from './types';
 export type { Args, ArgTypes, Parameters, StrictArgs } from '@storybook/types';
 export type { Parameters as AngularParameters } from './types';
@@ -9,23 +9,48 @@ export type { AngularRenderer };
  *
  * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
  */
-export type Meta<TArgs = Args> = ComponentAnnotations<AngularRenderer, TransformEventType<TArgs>>;
+export type Meta<TArgs = Args> = ComponentAnnotations<AngularRenderer, TransformComponentType<TArgs>>;
 /**
  * Story function that represents a CSFv2 component example.
  *
  * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
  */
-export type StoryFn<TArgs = Args> = AnnotatedStoryFn<AngularRenderer, TransformEventType<TArgs>>;
+export type StoryFn<TArgs = Args> = AnnotatedStoryFn<AngularRenderer, TransformComponentType<TArgs>>;
 /**
  * Story object that represents a CSFv3 component example.
  *
  * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
  */
-export type StoryObj<TArgs = Args> = StoryAnnotations<AngularRenderer, TransformEventType<TArgs>>;
+export type StoryObj<TArgs = Args> = StoryAnnotations<AngularRenderer, TransformComponentType<TArgs>>;
 export type Decorator<TArgs = StrictArgs> = DecoratorFunction<AngularRenderer, TArgs>;
 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
+ */
+type TransformComponentType<T> = TransformInputSignalType<TransformOutputSignalType<TransformEventType<T>>>;
+// @ts-ignore
+type AngularInputSignal<T> = AngularCore.InputSignal<T>;
+// @ts-ignore
+type AngularInputSignalWithTransform<T, U> = AngularCore.InputSignalWithTransform<T, U>;
+// @ts-ignore
+type AngularOutputEmitterRef<T> = AngularCore.OutputEmitterRef<T>;
+type AngularHasInputSignal = typeof AngularCore extends {
+    input: infer U;
+} ? true : false;
+type AngularHasOutputSignal = typeof AngularCore extends {
+    output: infer U;
+} ? true : false;
+type InputSignal<T> = AngularHasInputSignal extends true ? AngularInputSignal<T> : never;
+type InputSignalWithTransform<T, U> = AngularHasInputSignal extends true ? AngularInputSignalWithTransform<T, U> : never;
+type OutputEmitterRef<T> = AngularHasOutputSignal extends true ? AngularOutputEmitterRef<T> : never;
+type TransformInputSignalType<T> = {
+    [K in keyof T]: T[K] extends InputSignal<infer E> ? E : T[K] extends InputSignalWithTransform<any, infer U> ? U : T[K];
+};
+type TransformOutputSignalType<T> = {
+    [K in keyof T]: T[K] extends OutputEmitterRef<infer E> ? (e: E) => void : T[K];
+};
 type TransformEventType<T> = {
-    [K in keyof T]: T[K] extends EventEmitter<infer E> ? (e: E) => void : T[K];
+    [K in keyof T]: T[K] extends AngularCore.EventEmitter<infer E> ? (e: E) => void : T[K];
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/angular",
-  "version": "8.1.0-alpha.2",
+  "version": "8.1.0-alpha.4",
   "description": "Storybook for Angular: Develop Angular components in isolation with hot reloading.",
   "keywords": [
     "storybook",
@@ -34,21 +34,21 @@
   ],
   "scripts": {
     "check": "node ../../../scripts/node_modules/.bin/tsc",
-    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/tsc.ts"
+    "prep": "rimraf dist && node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/tsc.ts"
   },
   "dependencies": {
-    "@storybook/builder-webpack5": "8.1.0-alpha.2",
-    "@storybook/client-logger": "8.1.0-alpha.2",
-    "@storybook/core-common": "8.1.0-alpha.2",
-    "@storybook/core-events": "8.1.0-alpha.2",
-    "@storybook/core-server": "8.1.0-alpha.2",
-    "@storybook/core-webpack": "8.1.0-alpha.2",
-    "@storybook/docs-tools": "8.1.0-alpha.2",
+    "@storybook/builder-webpack5": "8.1.0-alpha.4",
+    "@storybook/client-logger": "8.1.0-alpha.4",
+    "@storybook/core-common": "8.1.0-alpha.4",
+    "@storybook/core-events": "8.1.0-alpha.4",
+    "@storybook/core-server": "8.1.0-alpha.4",
+    "@storybook/core-webpack": "8.1.0-alpha.4",
+    "@storybook/docs-tools": "8.1.0-alpha.4",
     "@storybook/global": "^5.0.0",
-    "@storybook/node-logger": "8.1.0-alpha.2",
-    "@storybook/preview-api": "8.1.0-alpha.2",
-    "@storybook/telemetry": "8.1.0-alpha.2",
-    "@storybook/types": "8.1.0-alpha.2",
+    "@storybook/node-logger": "8.1.0-alpha.4",
+    "@storybook/preview-api": "8.1.0-alpha.4",
+    "@storybook/telemetry": "8.1.0-alpha.4",
+    "@storybook/types": "8.1.0-alpha.4",
     "@types/node": "^18.0.0",
     "@types/react": "^18.0.37",
     "@types/react-dom": "^18.0.11",
@@ -65,18 +65,18 @@
   },
   "devDependencies": {
     "@analogjs/vite-plugin-angular": "^0.2.24",
-    "@angular-devkit/architect": "^0.1700.5",
-    "@angular-devkit/build-angular": "^17.0.5",
-    "@angular-devkit/core": "^17.0.5",
-    "@angular/animations": "^17.0.5",
-    "@angular/cli": "^17.0.5",
-    "@angular/common": "^17.0.5",
-    "@angular/compiler": "^17.0.5",
-    "@angular/compiler-cli": "^17.0.5",
-    "@angular/core": "^17.0.5",
-    "@angular/forms": "^17.0.5",
-    "@angular/platform-browser": "^17.0.5",
-    "@angular/platform-browser-dynamic": "^17.0.5",
+    "@angular-devkit/architect": "^0.1703.0",
+    "@angular-devkit/build-angular": "^17.3.0",
+    "@angular-devkit/core": "^17.3.0",
+    "@angular/animations": "^17.3.0",
+    "@angular/cli": "^17.3.0",
+    "@angular/common": "^17.3.0",
+    "@angular/compiler": "^17.3.0",
+    "@angular/compiler-cli": "^17.3.0",
+    "@angular/core": "^17.3.0",
+    "@angular/forms": "^17.3.0",
+    "@angular/platform-browser": "^17.3.0",
+    "@angular/platform-browser-dynamic": "^17.3.0",
     "@types/cross-spawn": "^6.0.2",
     "@types/tmp": "^0.2.3",
     "cross-spawn": "^7.0.3",
@@ -115,6 +115,7 @@
   },
   "builders": "dist/builders/builders.json",
   "bundler": {
+    "post": "./scripts/postbuild.js",
     "tsConfig": "tsconfig.build.json"
   },
   "gitHead": "e6a7fd8a655c69780bc20b9749c2699e44beae17"

package/scripts/postbuild.js

@@ -0,0 +1,16 @@
+/**
+ * This postbuild fix is needed to add a ts-ignore to the generated public-types.d.ts file.
+ * The AngularCore.InputSignal and AngularCore.InputSignalWithTransform types do not exist in Angular
+ * versions < 17.2. In these versions, the unresolved types will error and prevent Storybook from starting/building.
+ * This postbuild script adds a ts-ignore statement above the unresolved types to prevent the errors.
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+const filePath = path.join(__dirname, '../dist/client/public-types.d.ts');
+const fileContent = fs.readFileSync(filePath, 'utf8');
+const newContent = fileContent
+  .replaceAll(/(type AngularInputSignal)/g, '// @ts-ignore\n$1')
+  .replaceAll(/(type AngularOutputEmitterRef)/g, '// @ts-ignore\n$1');
+fs.writeFileSync(filePath, newContent, 'utf8');