@analogjs/storybook-angular 2.0.0-alpha.9 → 2.0.0-beta.10

package/README.md

@@ -2,6 +2,9 @@
 
 Integration package for Storybook using Angular & Vite.
 
+> This is a community integration not maintained by the Storybook team. If you have issues,
+> file an issue in our [GitHub repo](https://github.com/analogjs/analog/issues).
+
 ## Setup
 
 If you don't have Storybook setup already, run the following command to initialize Storybook for your project:
@@ -22,33 +25,7 @@ npm install @analogjs/storybook-angular --save-dev
 
 ## Configuring Storybook
 
-Add the `zone.js` import to the top of the `.storybook/preview.ts` file.
-
-```ts
-import 'zone.js';
-import { applicationConfig, type Preview } from '@storybook/angular';
-import { provideNoopAnimations } from '@angular/platform-browser/animations';
-
-const preview: Preview = {
-  decorators: [
-    applicationConfig({
-      providers: [provideNoopAnimations()],
-    }),
-  ],
-  parameters: {
-    controls: {
-      matchers: {
-        color: /(background|color)$/i,
-        date: /Date$/i,
-      },
-    },
-  },
-};
-
-export default preview;
-```
-
-Next, update the `.storybook/main.ts` file to use the `StorybookConfig`. Also update the `framework` to use the `@analogjs/storybook-angular` package.
+Update the `.storybook/main.ts` file to use the `StorybookConfig` type. Also update the `framework` to use the `@analogjs/storybook-angular` package.
 
 ```ts
 import { StorybookConfig } from '@analogjs/storybook-angular';
@@ -60,11 +37,13 @@ const config: StorybookConfig = {
     options: {},
   },
 };
+
+export default config;
 ```
 
 Remove the existing `webpackFinal` config function if present.
 
-Next, update the Storybook builders in the `angular.json` or `project.json`.
+Next, update the Storybook targets in the `angular.json` or `project.json`
 
 ```json
     "storybook": {
@@ -77,7 +56,61 @@ Next, update the Storybook builders in the `angular.json` or `project.json`.
 
 Remove any `webpack` specific options and remove the `browserTarget` option.
 
-Add the `/storybook-static` folder to your `.gitignore` file.
+Add the `/storybook-static` folder to the `.gitignore` file.
+
+## Setting up CSS
+
+To register global styles, add them to the `@analogjs/storybook-angular` builder options in the `angular.json` or `project.json`.
+
+```json
+    "storybook": {
+      "builder": "@analogjs/storybook-angular:start-storybook",
+      "options": {
+        // ... other options
+        "styles": [
+          "src/styles.css"
+        ],
+        "stylePreprocessorOptions": {
+          "loadPaths": ["libs/my-lib/styles"]
+        }
+      }
+    },
+    "build-storybook": {
+      "builder": "@analogjs/storybook-angular:build-storybook",
+      "options": {
+        // ... other options
+        "styles": [
+          "src/styles.css"
+        ],
+        "stylePreprocessorOptions": {
+          "loadPaths": ["libs/my-lib/styles"]
+        }
+      }
+    }
+```
+
+## Setting up Static Assets
+
+Static assets are configured in the `.storybook/main.ts` file using the `staticDirs` array.
+
+The example below shows how to add the `public` directory from `src/public` relative to the `.storybook/main.ts` file.
+
+```ts
+import { StorybookConfig } from '@analogjs/storybook-angular';
+
+const config: StorybookConfig = {
+  // other config, addons, etc.
+  framework: {
+    name: '@analogjs/storybook-angular',
+    options: {},
+  },
+  staticDirs: ['../public'],
+};
+
+export default config;
+```
+
+See the [Storybook docs on images and assets](https://storybook.js.org/docs/configure/integration/images-and-assets) for more information.
 
 ## Running Storybook
 
@@ -95,26 +128,6 @@ Run the command for building the storybook.
 npm run build-storybook
 ```
 
-## Using shared CSS paths
-
-To load shared CSS paths, configure them using `loadPaths` css option in the `viteFinal` function.
-
-```ts
-import path from 'node:path';
-
-async viteFinal() {
-  return {
-    css: {
-      preprocessorOptions: {
-        scss: {
-          loadPaths: `${path.resolve(__dirname, '../src/lib/styles')}`
-        }
-      }
-    }
-  };
-}
-```
-
 ## Using TypeScript Config Path Aliases
 
 If you are using `paths` in your `tsconfig.json`, support for those aliases can be added to the `vite.config.ts`.
@@ -127,32 +140,85 @@ First, install the `vite-tsconfig-paths` package.
 npm install vite-tsconfig-paths --save-dev
 ```
 
-Next, add the plugin to the `plugins` array.
+Next, add the plugin to the `plugins` array in the `.storybook/main.ts`.
 
 ```ts
 import viteTsConfigPaths from 'vite-tsconfig-paths';
+import { UserConfig, mergeConfig } from 'vite';
 
-async viteFinal() {
-  return {
-    plugins: [
-      viteTsConfigPaths()
-    ],
-  };
-}
+import type { StorybookConfig } from '@analogjs/storybook-angular';
+
+const config: StorybookConfig = {
+  // ... other config, addons, etc.
+  async viteFinal(config: UserConfig) {
+    return mergeConfig(config, {
+      plugins: [viteTsConfigPaths()],
+    });
+  },
+};
+
+export default config;
 ```
 
 ### With Nx
 
-For Nx workspaces, import and use the `nxViteTsPaths` plugin from the `@nx/vite` package.
+For Nx workspaces, import and use the `nxViteTsPaths` plugin from the `@nx/vite` package. Add the plugin to the `plugins` array in the `.storybook/main.ts`.
 
 ```ts
 import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { UserConfig, mergeConfig } from 'vite';
+
+import type { StorybookConfig } from '@analogjs/storybook-angular';
+
+const config: StorybookConfig = {
+  // ... other config, addons, etc.
+  async viteFinal(config: UserConfig) {
+    return mergeConfig(config, {
+      plugins: [nxViteTsPaths()],
+    });
+  },
+};
+
+export default config;
+```
+
+## Using File Replacements
+
+You can also use the `replaceFiles()` plugin from Nx to replace files during your build.
+
+Import the plugin and set it up:
+
+```ts
+import { replaceFiles } from '@nx/vite/plugins/rollup-replace-files.plugin';
+import { UserConfig, mergeConfig } from 'vite';
 
-async viteFinal(config: UserConfig) {
-  return {
-    plugins: [
-      nxViteTsPaths()
-    ],
-  };
+import type { StorybookConfig } from '@analogjs/storybook-angular';
+
+const config: StorybookConfig = {
+  // ... other config, addons, etc.
+  async viteFinal(config: UserConfig) {
+    return mergeConfig(config, {
+      plugins: [
+        replaceFiles([
+          {
+            replace: './src/one.ts',
+            with: './src/two.ts',
+          },
+        ]),
+      ],
+    });
+  },
+};
+
+export default config;
+```
+
+Adding the replacement files to `files` array in the `tsconfig.app.json` may also be necessary.
+
+```json
+{
+  "extends": "./tsconfig.json",
+  // other config
+  "files": ["src/main.ts", "src/main.server.ts", "src/two.ts"]
 }
 ```

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@analogjs/storybook-angular",
-  "version": "2.0.0-alpha.9",
+  "version": "2.0.0-beta.10",
   "description": "Storybook Integration for Angular & Vite",
+  "type": "module",
   "keywords": [
     "storybook",
     "angular",
@@ -27,19 +28,24 @@
       "import": "./src/index.js",
       "require": "./src/index.js"
     },
-    "./preset": "./src/preset.js",
+    "./preset": "./preset.mjs",
     "./package.json": "./package.json",
-    "./*": "./src/*"
+    "./*": "./src/*",
+    "./testing": {
+      "types": "./src/lib/testing.d.ts",
+      "import": "./src/lib/testing.js",
+      "require": "./src/lib/testing.js"
+    }
   },
   "main": "src/index.js",
   "dependencies": {
-    "@storybook/builder-vite": ">=8.6.0 || next"
+    "@storybook/builder-vite": ">=8.6.0 || ^9.0.0"
   },
   "peerDependencies": {
-    "@storybook/angular": ">=8.6.0 || next",
-    "@analogjs/vite-plugin-angular": ">=1.12.0 < 2.0.0 || beta",
-    "storybook": ">=8.6.0 || next",
-    "vite": "^5.0.0 || ^6.0.0"
+    "@storybook/angular": ">=8.6.0 || ^9.0.0",
+    "@analogjs/vite-plugin-angular": "*",
+    "storybook": ">=8.6.0 || ^9.0.0",
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
   },
   "engines": {
     "node": ">=18.0.0"
@@ -59,6 +65,10 @@
       "@analogjs/vitest-angular"
     ]
   },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
   "types": "./src/index.d.ts",
-  "type": "commonjs"
+  "module": "./src/index.js"
 }

package/{src/preset.d.ts → preset.d.ts}

@@ -1,5 +1,5 @@
 import { PresetProperty } from 'storybook/internal/types';
-import { StorybookConfig } from './types';
+import { StorybookConfig } from './src/types';
 export declare const core: PresetProperty<'core'>;
 export declare const viteFinal: NonNullable<StorybookConfig['viteFinal']>;
 export { addons, previewAnnotations } from '@storybook/angular/dist/preset.js';

package/preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset.js","sourceRoot":"","sources":["../../../../packages/storybook-angular/src/preset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAKvE,MAAM,OAAO,GAAG,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC/C,MAAM,eAAe,GAAG,CAAmB,KAAQ,EAAK,EAAE,CACxD,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAQ,CAAC;AAE/D,MAAM,CAAC,MAAM,IAAI,GAA2B,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACpE,MAAM,UAAU,GAAI,UAAkB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAExD,OAAO;QACL,GAAG,UAAU;QACb,OAAO,EAAE;YACP,IAAI,EAAE,eAAe,CAAC,yBAAyB,CAAC;YAChD,OAAO,EAAE,EAAE,GAAG,UAAU,CAAC,OAAO,EAAE;SACnC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAA8C,KAAK,EACvE,MAAM,EACN,OAAoC,EACpC,EAAE;IACF,qDAAqD;IACrD,MAAM,EAAE,WAAW,EAAE,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC;IAC7C,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,MAAM,MAAM,CAAC,+BAA+B,CAAC,CAAC;IAE3E,aAAa;IACb,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,KAAK,CAAM,WAAW,CAAC,CAAC;IAEhE,OAAO,WAAW,CAAC,MAAM,EAAE;QACzB,uCAAuC;QACvC,YAAY,EAAE;YACZ,OAAO,EAAE;gBACP,yCAAyC;gBACzC,6BAA6B;gBAC7B,mBAAmB;gBACnB,sCAAsC;gBACtC,+BAA+B;gBAC/B,uBAAuB;gBACvB,OAAO;gBACP,SAAS;aACV;SACF;QACD,OAAO,EAAE;YACP,OAAO,CAAC;gBACN,GAAG,EACD,OAAO,SAAS,CAAC,OAAO,EAAE,GAAG,KAAK,WAAW;oBAC3C,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,GAAG;oBACxB,CAAC,CAAC,IAAI;gBACV,UAAU,EACR,OAAO,SAAS,CAAC,OAAO,EAAE,UAAU,KAAK,WAAW;oBAClD,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,UAAU;oBAC/B,CAAC,CAAC,KAAK;gBACX,QAAQ,EAAE,OAAO,EAAE,QAAQ,IAAI,4BAA4B;aAC5D,CAAC;SACH;QACD,MAAM,EAAE;YACN,yBAAyB,EAAE,IAAI,CAAC,SAAS,CAAC;gBACxC,oBAAoB,EAClB,CAAC,CAAC,OAAO,EAAE,qBAAqB,EAAE,oBAAoB;aACzD,CAAC;SACH;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC"}

package/preset.mjs

@@ -0,0 +1,149 @@
+import { dirname, join, resolve } from 'node:path';
+import { createRequire } from 'node:module';
+import { core as PresetCore } from '@storybook/angular/dist/preset.js';
+const require = createRequire(import.meta.url);
+const getAbsolutePath = (input) =>
+  dirname(require.resolve(join(input, 'package.json')));
+export const core = async (config, options) => {
+  const presetCore = PresetCore(config, options);
+  return {
+    ...presetCore,
+    builder: {
+      name: getAbsolutePath('@storybook/builder-vite'),
+      options: { ...presetCore.options },
+    },
+  };
+};
+export const viteFinal = async (config, options) => {
+  // Remove any loaded analogjs plugins from a vite.config.(m)ts file
+  config.plugins = config.plugins
+    .flat()
+    .filter((plugin) => !plugin.name.includes('analogjs'));
+
+  // Merge custom configuration into the default config
+  const { mergeConfig, normalizePath } = await import('vite');
+  const { default: angular } = await import('@analogjs/vite-plugin-angular');
+  // @ts-ignore
+  const framework = await options.presets.apply('framework');
+  return mergeConfig(config, {
+    // Add dependencies to pre-optimization
+    optimizeDeps: {
+      include: [
+        '@storybook/angular/dist/client/index.js',
+        '@analogjs/storybook-angular',
+        '@angular/compiler',
+        '@angular/platform-browser',
+        '@angular/platform-browser/animations',
+        'tslib',
+        ...(options?.angularBuilderOptions?.experimentalZoneless
+          ? []
+          : ['zone.js']),
+      ],
+    },
+    plugins: [
+      angular({
+        jit:
+          typeof framework.options?.jit !== 'undefined'
+            ? framework.options?.jit
+            : true,
+        liveReload:
+          typeof framework.options?.liveReload !== 'undefined'
+            ? framework.options?.liveReload
+            : false,
+        tsconfig: options?.tsConfig ?? './.storybook/tsconfig.json',
+        inlineStylesExtension:
+          typeof framework.options?.inlineStylesExtension !== 'undefined'
+            ? framework.options?.inlineStylesExtension
+            : 'css',
+      }),
+      angularOptionsPlugin(options, { normalizePath }),
+      storybookEsbuildPlugin(),
+    ],
+    define: {
+      STORYBOOK_ANGULAR_OPTIONS: JSON.stringify({
+        experimentalZoneless:
+          !!options?.angularBuilderOptions?.experimentalZoneless,
+      }),
+    },
+  });
+};
+
+function angularOptionsPlugin(options, { normalizePath }) {
+  return {
+    name: 'analogjs-storybook-options-plugin',
+    config() {
+      const loadPaths =
+        options?.angularBuilderOptions?.stylePreprocessorOptions?.loadPaths;
+      const sassOptions =
+        options?.angularBuilderOptions?.stylePreprocessorOptions?.sass;
+
+      if (Array.isArray(loadPaths)) {
+        return {
+          css: {
+            preprocessorOptions: {
+              scss: {
+                ...sassOptions,
+                loadPaths: loadPaths.map(
+                  (loadPath) =>
+                    `${resolve(options.angularBuilderContext.workspaceRoot, loadPath)}`,
+                ),
+              },
+            },
+          },
+        };
+      }
+
+      return;
+    },
+    transform(code, id) {
+      if (
+        normalizePath(id).endsWith(
+          normalizePath(`${options.configDir}/preview.ts`),
+        )
+      ) {
+        const imports = [];
+        const styles = options?.angularBuilderOptions?.styles;
+
+        if (Array.isArray(styles)) {
+          styles.forEach((style) => {
+            imports.push(style);
+          });
+        }
+
+        const zoneless = options?.angularBuilderOptions?.experimentalZoneless;
+
+        if (!zoneless) {
+          imports.push('zone.js');
+        }
+
+        return {
+          code: `
+            ${imports.map((extraImport) => `import '${extraImport}';`).join('\n')}
+            ${code}
+          `,
+        };
+      }
+
+      return;
+    },
+  };
+}
+
+function storybookEsbuildPlugin() {
+  return {
+    name: 'analogjs-storybook-esbuild-config',
+    apply: 'build',
+    config() {
+      return {
+        esbuild: {
+          // Don't mangle class names during the build
+          // This fixes display of compodoc argtypes
+          keepNames: true,
+        },
+      };
+    },
+  };
+}
+
+export { addons, previewAnnotations } from '@storybook/angular/dist/preset.js';
+//# sourceMappingURL=preset.js.map

package/src/index.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./types"), exports);
-tslib_1.__exportStar(require("@storybook/angular/dist/client/index.js"), exports);
+export * from './types';
+export * from '@storybook/angular/dist/client/index.js';
 //# sourceMappingURL=index.js.map

package/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/storybook-angular/src/index.ts"],"names":[],"mappings":";;;AAAA,kDAAwB;AACxB,kFAAwD"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/storybook-angular/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,yCAAyC,CAAC"}

package/src/lib/build-storybook/build-storybook.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const index_js_1 = tslib_1.__importDefault(require("@storybook/angular/dist/builders/build-storybook/index.js"));
-exports.default = index_js_1.default;
+import BuildStorybookBuilder from '@storybook/angular/dist/builders/build-storybook/index.js';
+export default BuildStorybookBuilder;
 //# sourceMappingURL=build-storybook.js.map

package/src/lib/build-storybook/build-storybook.js.map

@@ -1 +1 @@
-{"version":3,"file":"build-storybook.js","sourceRoot":"","sources":["../../../../../../packages/storybook-angular/src/lib/build-storybook/build-storybook.ts"],"names":[],"mappings":";;;AAAA,iHAA8F;AAE9F,kBAAe,kBAAqB,CAAC"}
+{"version":3,"file":"build-storybook.js","sourceRoot":"","sources":["../../../../../../packages/storybook-angular/src/lib/build-storybook/build-storybook.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,MAAM,2DAA2D,CAAC;AAE9F,eAAe,qBAAqB,CAAC"}

package/src/lib/build-storybook/schema.json

@@ -69,6 +69,56 @@
       "type": "boolean",
       "description": "Experimental: Use zoneless change detection.",
       "default": false
+    },
+    "styles": {
+      "type": "array",
+      "description": "Global styles to be included in the build.",
+      "default": [],
+      "items": {
+        "type": "string"
+      }
+    },
+    "stylePreprocessorOptions": {
+      "description": "Options to pass to style preprocessors.",
+      "type": "object",
+      "properties": {
+        "loadPaths": {
+          "description": "Paths to include.",
+          "type": "array",
+          "items": {
+            "type": "string"
+          }
+        },
+        "sass": {
+          "description": "Options to pass to the sass preprocessor.",
+          "type": "object",
+          "properties": {
+            "fatalDeprecations": {
+              "description": "A set of deprecations to treat as fatal. If a deprecation warning of any provided type is encountered during compilation, the compiler will error instead. If a Version is provided, then all deprecations that were active in that compiler version will be treated as fatal.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "silenceDeprecations": {
+              "description": " A set of active deprecations to ignore. If a deprecation warning of any provided type is encountered during compilation, the compiler will ignore it instead.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "futureDeprecations": {
+              "description": "A set of future deprecations to opt into early. Future deprecations passed here will be treated as active by the compiler, emitting warnings as necessary.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            }
+          },
+          "additionalProperties": false
+        }
+      },
+      "additionalProperties": false
     }
   },
   "additionalProperties": false

package/src/lib/builders.json

@@ -1,14 +1,15 @@
 {
   "builders": {
     "build-storybook": {
-      "implementation": "./build-storybook/build-storybook",
+      "implementation": "./build-storybook/build-storybook.js",
       "schema": "./build-storybook/schema.json",
       "description": "Build storybook"
     },
     "start-storybook": {
-      "implementation": "./start-storybook/start-storybook",
+      "implementation": "./start-storybook/start-storybook.js",
       "schema": "./start-storybook/schema.json",
       "description": "Start storybook"
-    }
+    },
+    "test-storybook": "@analogjs/vitest-angular:test"
   }
 }

package/src/lib/start-storybook/schema.json

@@ -105,6 +105,56 @@
       "type": "boolean",
       "description": "Experimental: Use zoneless change detection.",
       "default": false
+    },
+    "styles": {
+      "type": "array",
+      "description": "Global styles to be included in the build.",
+      "default": [],
+      "items": {
+        "type": "string"
+      }
+    },
+    "stylePreprocessorOptions": {
+      "description": "Options to pass to style preprocessors.",
+      "type": "object",
+      "properties": {
+        "loadPaths": {
+          "description": "Paths to include.",
+          "type": "array",
+          "items": {
+            "type": "string"
+          }
+        },
+        "sass": {
+          "description": "Options to pass to the sass preprocessor.",
+          "type": "object",
+          "properties": {
+            "fatalDeprecations": {
+              "description": "A set of deprecations to treat as fatal. If a deprecation warning of any provided type is encountered during compilation, the compiler will error instead. If a Version is provided, then all deprecations that were active in that compiler version will be treated as fatal.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "silenceDeprecations": {
+              "description": " A set of active deprecations to ignore. If a deprecation warning of any provided type is encountered during compilation, the compiler will ignore it instead.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            },
+            "futureDeprecations": {
+              "description": "A set of future deprecations to opt into early. Future deprecations passed here will be treated as active by the compiler, emitting warnings as necessary.",
+              "type": "array",
+              "items": {
+                "type": "string"
+              }
+            }
+          },
+          "additionalProperties": false
+        }
+      },
+      "additionalProperties": false
     }
   },
   "additionalProperties": false

package/src/lib/start-storybook/start-storybook.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const index_js_1 = tslib_1.__importDefault(require("@storybook/angular/dist/builders/start-storybook/index.js"));
-exports.default = index_js_1.default;
+import StartStorybookBuilder from '@storybook/angular/dist/builders/start-storybook/index.js';
+export default StartStorybookBuilder;
 //# sourceMappingURL=start-storybook.js.map

package/src/lib/start-storybook/start-storybook.js.map

@@ -1 +1 @@
-{"version":3,"file":"start-storybook.js","sourceRoot":"","sources":["../../../../../../packages/storybook-angular/src/lib/start-storybook/start-storybook.ts"],"names":[],"mappings":";;;AAAA,iHAA8F;AAE9F,kBAAe,kBAAqB,CAAC"}
+{"version":3,"file":"start-storybook.js","sourceRoot":"","sources":["../../../../../../packages/storybook-angular/src/lib/start-storybook/start-storybook.ts"],"names":[],"mappings":"AAAA,OAAO,qBAAqB,MAAM,2DAA2D,CAAC;AAE9F,eAAe,qBAAqB,CAAC"}

package/src/lib/testing.d.ts

@@ -0,0 +1,5 @@
+import type { AngularRenderer } from '@storybook/angular';
+import { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations, RenderContext } from 'storybook/internal/types';
+export declare const render: any;
+export declare function renderToCanvas(context: RenderContext<AngularRenderer>, element: HTMLElement): Promise<void>;
+export declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]): NormalizedProjectAnnotations<AngularRenderer>;

package/src/lib/testing.js

@@ -0,0 +1,20 @@
+import { setProjectAnnotations as originalSetProjectAnnotations } from '@storybook/angular/dist/client/index.mjs';
+import * as configAnnotations from '@storybook/angular/dist/client/config.mjs';
+export const render = configAnnotations.render;
+export async function renderToCanvas(context, element) {
+    element.id = context.id;
+    await configAnnotations.renderToCanvas(context, element);
+}
+const renderAnnotations = {
+    render,
+    renderToCanvas,
+};
+export function setProjectAnnotations(projectAnnotations) {
+    return originalSetProjectAnnotations([
+        renderAnnotations,
+        ...(Array.isArray(projectAnnotations)
+            ? projectAnnotations
+            : [projectAnnotations]),
+    ]);
+}
+//# sourceMappingURL=testing.js.map

package/src/lib/testing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"testing.js","sourceRoot":"","sources":["../../../../../packages/storybook-angular/src/lib/testing.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,IAAI,6BAA6B,EAAE,MAAM,0CAA0C,CAAC;AAMlH,OAAO,KAAK,iBAAiB,MAAM,2CAA2C,CAAC;AAE/E,MAAM,CAAC,MAAM,MAAM,GAAG,iBAAiB,CAAC,MAAM,CAAC;AAE/C,MAAM,CAAC,KAAK,UAAU,cAAc,CAClC,OAAuC,EACvC,OAAoB;IAEpB,OAAO,CAAC,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC;IACxB,MAAM,iBAAiB,CAAC,cAAc,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;AAC3D,CAAC;AAED,MAAM,iBAAiB,GAAG;IACxB,MAAM;IACN,cAAc;CACf,CAAC;AAEF,MAAM,UAAU,qBAAqB,CACnC,kBAE2C;IAE3C,OAAO,6BAA6B,CAAC;QACnC,iBAAiB;QACjB,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,kBAAkB,CAAC;YACnC,CAAC,CAAC,kBAAkB;YACpB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC;KAC1B,CAAkD,CAAC;AACtD,CAAC"}

package/src/lib/utils/standalone-options.js

@@ -1,3 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};
 //# sourceMappingURL=standalone-options.js.map

package/src/types.d.ts

@@ -7,6 +7,7 @@ export type FrameworkOptions = {
     builder?: BuilderOptions;
     jit?: boolean;
     liveReload?: boolean;
+    inlineStylesExtension?: string;
 };
 type StorybookConfigFramework = {
     framework: FrameworkName | {

package/src/types.js

@@ -1,3 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};
 //# sourceMappingURL=types.js.map

package/src/preset.js

@@ -1,93 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (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 () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.previewAnnotations = exports.addons = exports.viteFinal = exports.core = void 0;
-const node_path_1 = require("node:path");
-const preset_js_1 = require("@storybook/angular/dist/preset.js");
-const getAbsolutePath = (input) => (0, node_path_1.dirname)(require.resolve((0, node_path_1.join)(input, 'package.json')));
-const core = async (config, options) => {
-    const presetCore = preset_js_1.core(config, options);
-    return {
-        ...presetCore,
-        builder: {
-            name: getAbsolutePath('@storybook/builder-vite'),
-            options: { ...presetCore.options },
-        },
-    };
-};
-exports.core = core;
-const viteFinal = async (config, options) => {
-    // Merge custom configuration into the default config
-    const { mergeConfig } = await Promise.resolve().then(() => __importStar(require('vite')));
-    const { default: angular } = await Promise.resolve().then(() => __importStar(require('@analogjs/vite-plugin-angular')));
-    // @ts-ignore
-    const framework = await options.presets.apply('framework');
-    return mergeConfig(config, {
-        // Add dependencies to pre-optimization
-        optimizeDeps: {
-            include: [
-                '@storybook/angular/dist/client/index.js',
-                '@analogjs/storybook-angular',
-                '@angular/compiler',
-                '@angular/platform-browser/animations',
-                '@storybook/addon-docs/angular',
-                'react/jsx-dev-runtime',
-                'tslib',
-                'zone.js',
-            ],
-        },
-        plugins: [
-            angular({
-                jit: typeof framework.options?.jit !== 'undefined'
-                    ? framework.options?.jit
-                    : true,
-                liveReload: typeof framework.options?.liveReload !== 'undefined'
-                    ? framework.options?.liveReload
-                    : false,
-                tsconfig: options?.tsConfig ?? './.storybook/tsconfig.json',
-            }),
-        ],
-        define: {
-            STORYBOOK_ANGULAR_OPTIONS: JSON.stringify({
-                experimentalZoneless: !!options?.angularBuilderOptions?.experimentalZoneless,
-            }),
-        },
-    });
-};
-exports.viteFinal = viteFinal;
-var preset_js_2 = require("@storybook/angular/dist/preset.js");
-Object.defineProperty(exports, "addons", { enumerable: true, get: function () { return preset_js_2.addons; } });
-Object.defineProperty(exports, "previewAnnotations", { enumerable: true, get: function () { return preset_js_2.previewAnnotations; } });
-//# sourceMappingURL=preset.js.map

package/src/preset.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"preset.js","sourceRoot":"","sources":["../../../../packages/storybook-angular/src/preset.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yCAA0C;AAG1C,iEAAuE;AAKvE,MAAM,eAAe,GAAG,CAAmB,KAAQ,EAAK,EAAE,CACxD,IAAA,mBAAO,EAAC,OAAO,CAAC,OAAO,CAAC,IAAA,gBAAI,EAAC,KAAK,EAAE,cAAc,CAAC,CAAC,CAAQ,CAAC;AAExD,MAAM,IAAI,GAA2B,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACpE,MAAM,UAAU,GAAI,gBAAkB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAExD,OAAO;QACL,GAAG,UAAU;QACb,OAAO,EAAE;YACP,IAAI,EAAE,eAAe,CAAC,yBAAyB,CAAC;YAChD,OAAO,EAAE,EAAE,GAAG,UAAU,CAAC,OAAO,EAAE;SACnC;KACF,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,IAAI,QAUf;AAEK,MAAM,SAAS,GAA8C,KAAK,EACvE,MAAM,EACN,OAAoC,EACpC,EAAE;IACF,qDAAqD;IACrD,MAAM,EAAE,WAAW,EAAE,GAAG,wDAAa,MAAM,GAAC,CAAC;IAC7C,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,wDAAa,+BAA+B,GAAC,CAAC;IAE3E,aAAa;IACb,MAAM,SAAS,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,KAAK,CAAM,WAAW,CAAC,CAAC;IAEhE,OAAO,WAAW,CAAC,MAAM,EAAE;QACzB,uCAAuC;QACvC,YAAY,EAAE;YACZ,OAAO,EAAE;gBACP,yCAAyC;gBACzC,6BAA6B;gBAC7B,mBAAmB;gBACnB,sCAAsC;gBACtC,+BAA+B;gBAC/B,uBAAuB;gBACvB,OAAO;gBACP,SAAS;aACV;SACF;QACD,OAAO,EAAE;YACP,OAAO,CAAC;gBACN,GAAG,EACD,OAAO,SAAS,CAAC,OAAO,EAAE,GAAG,KAAK,WAAW;oBAC3C,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,GAAG;oBACxB,CAAC,CAAC,IAAI;gBACV,UAAU,EACR,OAAO,SAAS,CAAC,OAAO,EAAE,UAAU,KAAK,WAAW;oBAClD,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,UAAU;oBAC/B,CAAC,CAAC,KAAK;gBACX,QAAQ,EAAE,OAAO,EAAE,QAAQ,IAAI,4BAA4B;aAC5D,CAAC;SACH;QACD,MAAM,EAAE;YACN,yBAAyB,EAAE,IAAI,CAAC,SAAS,CAAC;gBACxC,oBAAoB,EAClB,CAAC,CAAC,OAAO,EAAE,qBAAqB,EAAE,oBAAoB;aACzD,CAAC;SACH;KACF,CAAC,CAAC;AACL,CAAC,CAAC;AA7CW,QAAA,SAAS,aA6CpB;AAEF,+DAA+E;AAAtE,mGAAA,MAAM,OAAA;AAAE,+GAAA,kBAAkB,OAAA"}

package/src/test-setup.d.ts

@@ -1 +0,0 @@
-import '@analogjs/vite-plugin-angular/setup-vitest';

package/src/test-setup.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-require("@analogjs/vite-plugin-angular/setup-vitest");
-const testing_1 = require("@angular/core/testing");
-const testing_2 = require("@angular/platform-browser-dynamic/testing");
-(0, testing_1.getTestBed)().initTestEnvironment(testing_2.BrowserDynamicTestingModule, (0, testing_2.platformBrowserDynamicTesting)());
-//# sourceMappingURL=test-setup.js.map

package/src/test-setup.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"test-setup.js","sourceRoot":"","sources":["../../../../packages/storybook-angular/src/test-setup.ts"],"names":[],"mappings":";;AAAA,sDAAoD;AACpD,mDAAmD;AACnD,uEAGmD;AAEnD,IAAA,oBAAU,GAAE,CAAC,mBAAmB,CAC9B,qCAA2B,EAC3B,IAAA,uCAA6B,GAAE,CAChC,CAAC"}