@storybook/angular 7.0.0-beta.5 → 7.0.0-beta.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/README.md +66 -0
  2. package/dist/builders/build-storybook/index.d.ts +5 -3
  3. package/dist/builders/build-storybook/index.js +7 -3
  4. package/dist/builders/build-storybook/schema.json +14 -6
  5. package/dist/builders/start-storybook/index.d.ts +5 -3
  6. package/dist/builders/start-storybook/index.js +9 -5
  7. package/dist/builders/start-storybook/schema.json +10 -5
  8. package/dist/builders/utils/run-compodoc.js +11 -27
  9. package/dist/builders/utils/run-compodoc.spec.js +42 -0
  10. package/dist/builders/utils/standalone-options.d.ts +2 -2
  11. package/dist/client/angular-beta/AbstractRenderer.d.ts +3 -3
  12. package/dist/client/angular-beta/AbstractRenderer.js +25 -32
  13. package/dist/client/angular-beta/CanvasRenderer.js +1 -1
  14. package/dist/client/angular-beta/DocsRenderer.js +5 -3
  15. package/dist/client/angular-beta/RendererFactory.js +5 -4
  16. package/dist/client/angular-beta/StorybookModule.d.ts +3 -6
  17. package/dist/client/angular-beta/StorybookModule.js +4 -45
  18. package/dist/client/angular-beta/StorybookModule.test.js +51 -36
  19. package/dist/client/angular-beta/StorybookWrapperComponent.d.ts +3 -2
  20. package/dist/client/angular-beta/StorybookWrapperComponent.js +31 -2
  21. package/dist/client/angular-beta/__testfixtures__/test.module.d.ts +4 -0
  22. package/dist/client/angular-beta/__testfixtures__/test.module.js +34 -0
  23. package/dist/client/angular-beta/utils/NgComponentAnalyzer.js +1 -1
  24. package/dist/client/angular-beta/utils/NgComponentAnalyzer.test.js +43 -5
  25. package/dist/client/angular-beta/utils/NgModulesAnalyzer.d.ts +1 -1
  26. package/dist/client/angular-beta/utils/NgModulesAnalyzer.js +4 -4
  27. package/dist/client/angular-beta/utils/NgModulesAnalyzer.test.js +3 -3
  28. package/dist/client/angular-beta/utils/PropertyExtractor.d.ts +50 -0
  29. package/dist/client/angular-beta/utils/PropertyExtractor.js +159 -0
  30. package/dist/client/angular-beta/utils/PropertyExtractor.test.d.ts +1 -0
  31. package/dist/client/angular-beta/utils/PropertyExtractor.test.js +179 -0
  32. package/dist/client/decorateStory.js +1 -1
  33. package/dist/client/docs/compodoc.js +5 -7
  34. package/dist/client/docs/config.js +1 -2
  35. package/dist/client/docs/sourceDecorator.js +2 -1
  36. package/dist/client/globals.d.ts +0 -8
  37. package/dist/client/globals.js +2 -29
  38. package/dist/client/render.d.ts +1 -0
  39. package/dist/client/render.js +1 -5
  40. package/dist/client/types.d.ts +0 -2
  41. package/dist/index.mjs +13 -0
  42. package/dist/preset.mjs +26 -0
  43. package/dist/renderer.d.ts +2 -1
  44. package/dist/renderer.js +4 -2
  45. package/dist/renderer.mjs +5 -0
  46. package/dist/server/framework-preset-angular-cli.d.ts +2 -1
  47. package/dist/server/framework-preset-angular-cli.js +21 -92
  48. package/dist/server/plugins/storybook-normalize-angular-entry-plugin.js +15 -13
  49. package/dist/server/preset-options.d.ts +3 -2
  50. package/dist/types.mjs +1 -0
  51. package/jest.config.js +19 -0
  52. package/package.json +46 -45
  53. package/template/cli/Button.stories.ts +1 -1
  54. package/template/cli/Header.stories.ts +2 -2
  55. package/template/cli/button.component.ts +2 -0
  56. package/template/components/index.js +2 -2
  57. package/template/stories/angular-mdx.stories.mdx +1 -1
  58. package/template/stories/argTypes/doc-button/doc-button.component.ts +1 -2
  59. package/template/stories/basics/component-without-selector/without-selector-ng-component-outlet.stories.ts +1 -1
  60. package/template/stories/basics/component-without-selector/without-selector-ng-factory-resolver.stories.ts +1 -1
  61. package/template/stories/basics/component-without-selector/without-selector.stories.ts +1 -1
  62. package/template/stories/basics/ng-module/import-module-chip.stories.ts +23 -0
  63. package/template/stories/basics/ng-module/import-module.stories.ts +2 -13
  64. package/template/stories/core/decorators/componentWrapperDecorator/decorators.stories.ts +0 -18
  65. package/template/stories/core/moduleMetadata/angular-src/open-close-component/open-close.component.css +13 -0
  66. package/template/stories/core/moduleMetadata/angular-src/open-close-component/open-close.component.html +7 -0
  67. package/template/stories/core/moduleMetadata/angular-src/open-close-component/open-close.component.ts +39 -0
  68. package/template/stories/core/moduleMetadata/with-browser-animations.stories.ts +30 -0
  69. package/template/stories/core/moduleMetadata/with-noop-browser-animations.stories.ts +27 -0
  70. package/template/stories/core/parameters/bootstrap-options.stories.ts +1 -5
  71. package/dist/client/angular/helpers.d.ts +0 -8
  72. package/dist/client/angular/helpers.js +0 -150
  73. package/dist/server/angular-read-workspace.d.ts +0 -13
  74. package/dist/server/angular-read-workspace.js +0 -78
  75. package/dist/server/utils/normalize-asset-patterns.d.ts +0 -7
  76. package/dist/server/utils/normalize-asset-patterns.js +0 -64
  77. package/dist/server/utils/normalize-optimization.d.ts +0 -3
  78. package/dist/server/utils/normalize-optimization.js +0 -21
@@ -0,0 +1,159 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.extractDeclarations = exports.extractSingletons = exports.extractProviders = exports.extractImports = exports.analyzeMetadata = exports.REMOVED_MODULES = void 0;
4
+ const common_1 = require("@angular/common");
5
+ const http_1 = require("@angular/common/http");
6
+ const core_1 = require("@angular/core");
7
+ const platform_browser_1 = require("@angular/platform-browser");
8
+ const animations_1 = require("@angular/platform-browser/animations");
9
+ const NgComponentAnalyzer_1 = require("./NgComponentAnalyzer");
10
+ const NgModulesAnalyzer_1 = require("./NgModulesAnalyzer");
11
+ const uniqueArray = (arr) => {
12
+ return arr.flat(Number.MAX_VALUE).filter((value, index, self) => self.indexOf(value) === index);
13
+ };
14
+ const analyzeRestricted = (ngModule) => {
15
+ /**
16
+ * BrowserModule is restricted,
17
+ * because bootstrapApplication API, which mounts the component to the DOM,
18
+ * automatically imports BrowserModule
19
+ */
20
+ if (ngModule === platform_browser_1.BrowserModule) {
21
+ return [true];
22
+ }
23
+ /**
24
+ * BrowserAnimationsModule imports BrowserModule, which is restricted,
25
+ * because bootstrapApplication API, which mounts the component to the DOM,
26
+ * automatically imports BrowserModule
27
+ */
28
+ if (ngModule === animations_1.BrowserAnimationsModule) {
29
+ return [true, (0, animations_1.provideAnimations)()];
30
+ }
31
+ /**
32
+ * NoopAnimationsModule imports BrowserModule, which is restricted,
33
+ * because bootstrapApplication API, which mounts the component to the DOM,
34
+ * automatically imports BrowserModule
35
+ */
36
+ if (ngModule === animations_1.NoopAnimationsModule) {
37
+ return [true, (0, animations_1.provideNoopAnimations)()];
38
+ }
39
+ /**
40
+ * HttpClient has to be provided manually as a singleton
41
+ */
42
+ if (ngModule === http_1.HttpClientModule) {
43
+ return [true, (0, http_1.provideHttpClient)()];
44
+ }
45
+ return [false];
46
+ };
47
+ exports.REMOVED_MODULES = new core_1.InjectionToken('REMOVED_MODULES');
48
+ /**
49
+ * Analyze NgModule Metadata
50
+ *
51
+ * - Removes Restricted Imports
52
+ * - Extracts providers from ModuleWithProviders
53
+ * - Flattens imports
54
+ * - Returns a new NgModuleMetadata object
55
+ *
56
+ *
57
+ */
58
+ const analyzeMetadata = (metadata) => {
59
+ const declarations = [...(metadata?.declarations || [])];
60
+ const providers = [...(metadata?.providers || [])];
61
+ const singletons = [];
62
+ const imports = [...(metadata?.imports || [])]
63
+ .reduce((acc, ngModule) => {
64
+ // remove ngModule and use only its providers if it is restricted
65
+ // (e.g. BrowserModule, BrowserAnimationsModule, NoopAnimationsModule, ...etc)
66
+ const [isRestricted, restrictedProviders] = analyzeRestricted(ngModule);
67
+ if (isRestricted) {
68
+ singletons.unshift(restrictedProviders || []);
69
+ return acc;
70
+ }
71
+ // destructure into ngModule & providers if it is a ModuleWithProviders
72
+ if (ngModule?.providers) {
73
+ providers.unshift(ngModule.providers || []);
74
+ // eslint-disable-next-line no-param-reassign
75
+ ngModule = ngModule.ngModule;
76
+ }
77
+ // extract providers, declarations, singletons from ngModule
78
+ // eslint-disable-next-line no-underscore-dangle
79
+ const ngMetadata = ngModule?.__annotations__?.[0];
80
+ if (ngMetadata) {
81
+ const newMetadata = (0, exports.analyzeMetadata)(ngMetadata);
82
+ acc.unshift(...newMetadata.imports);
83
+ providers.unshift(...newMetadata.providers);
84
+ singletons.unshift(...newMetadata.singletons);
85
+ declarations.unshift(...newMetadata.declarations);
86
+ if (ngMetadata.standalone === true) {
87
+ acc.push(ngModule);
88
+ }
89
+ // keeping a copy of the removed module
90
+ providers.push({ provide: exports.REMOVED_MODULES, useValue: ngModule, multi: true });
91
+ return acc;
92
+ }
93
+ // include Angular official modules as-is
94
+ if (ngModule.ɵmod) {
95
+ acc.push(ngModule);
96
+ return acc;
97
+ }
98
+ return acc;
99
+ }, [])
100
+ .flat(Number.MAX_VALUE);
101
+ return { ...metadata, imports, providers, singletons, declarations };
102
+ };
103
+ exports.analyzeMetadata = analyzeMetadata;
104
+ /**
105
+ * Extract Imports from NgModule
106
+ *
107
+ * CommonModule is always imported
108
+ * Only standalone components are imported
109
+ *
110
+ */
111
+ const extractImports = (metadata, storyComponent) => {
112
+ const { imports } = (0, exports.analyzeMetadata)(metadata);
113
+ if ((0, NgComponentAnalyzer_1.isStandaloneComponent)(storyComponent)) {
114
+ imports.push(storyComponent);
115
+ }
116
+ return uniqueArray([common_1.CommonModule, imports]);
117
+ };
118
+ exports.extractImports = extractImports;
119
+ /**
120
+ * Extract providers from NgModule
121
+ *
122
+ * - A new array is returned with:
123
+ * - metadata.providers
124
+ * - providers from each **ModuleWithProviders** (e.g. forRoot() & forChild() )
125
+ *
126
+ *
127
+ */
128
+ const extractProviders = (metadata) => {
129
+ const { providers } = (0, exports.analyzeMetadata)(metadata);
130
+ return uniqueArray(providers);
131
+ };
132
+ exports.extractProviders = extractProviders;
133
+ const extractSingletons = (metadata) => {
134
+ const { singletons } = (0, exports.analyzeMetadata)(metadata);
135
+ return uniqueArray(singletons);
136
+ };
137
+ exports.extractSingletons = extractSingletons;
138
+ /**
139
+ * Extract declarations from NgModule
140
+ *
141
+ * - If a story component is provided, it will be added to the declarations array if:
142
+ * - It is a component or directive or pipe
143
+ * - It is not already declared
144
+ * - It is not a standalone component
145
+ *
146
+ */
147
+ const extractDeclarations = (metadata, storyComponent) => {
148
+ const { declarations } = (0, exports.analyzeMetadata)(metadata);
149
+ if (storyComponent) {
150
+ const isStandalone = (0, NgComponentAnalyzer_1.isStandaloneComponent)(storyComponent);
151
+ const isDeclared = (0, NgModulesAnalyzer_1.isComponentAlreadyDeclared)(storyComponent, declarations, metadata.imports);
152
+ const requiresDeclaration = (0, NgComponentAnalyzer_1.isDeclarable)(storyComponent) && !isDeclared && !isStandalone;
153
+ if (requiresDeclaration) {
154
+ declarations.push(storyComponent);
155
+ }
156
+ }
157
+ return uniqueArray(declarations);
158
+ };
159
+ exports.extractDeclarations = extractDeclarations;
@@ -0,0 +1,179 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const common_1 = require("@angular/common");
4
+ const core_1 = require("@angular/core");
5
+ const platform_browser_1 = require("@angular/platform-browser");
6
+ const animations_1 = require("@angular/platform-browser/animations");
7
+ const http_1 = require("@angular/common/http");
8
+ const PropertyExtractor_1 = require("./PropertyExtractor");
9
+ const test_module_1 = require("../__testfixtures__/test.module");
10
+ const TEST_TOKEN = new core_1.InjectionToken('testToken');
11
+ const TestTokenProvider = { provide: TEST_TOKEN, useValue: 123 };
12
+ const TestService = (0, core_1.Injectable)()(class {
13
+ });
14
+ const TestComponent1 = (0, core_1.Component)({})(class {
15
+ });
16
+ const TestComponent2 = (0, core_1.Component)({})(class {
17
+ });
18
+ const StandaloneTestComponent = (0, core_1.Component)({ standalone: true })(class {
19
+ });
20
+ const TestDirective = (0, core_1.Directive)({})(class {
21
+ });
22
+ const TestModuleWithDeclarations = (0, core_1.NgModule)({ declarations: [TestComponent1] })(class {
23
+ });
24
+ const TestModuleWithImportsAndProviders = (0, core_1.NgModule)({
25
+ imports: [TestModuleWithDeclarations],
26
+ providers: [TestTokenProvider],
27
+ })(class {
28
+ });
29
+ describe('PropertyExtractor', () => {
30
+ describe('analyzeMetadata', () => {
31
+ it('should remove BrowserModule', () => {
32
+ const metadata = {
33
+ imports: [platform_browser_1.BrowserModule],
34
+ };
35
+ const { imports, providers, singletons } = (0, PropertyExtractor_1.analyzeMetadata)(metadata);
36
+ expect(imports.flat(Number.MAX_VALUE)).toEqual([]);
37
+ expect(providers.flat(Number.MAX_VALUE)).toEqual([]);
38
+ expect(singletons.flat(Number.MAX_VALUE)).toEqual([]);
39
+ });
40
+ it('should remove BrowserAnimationsModule and use its providers instead', () => {
41
+ const metadata = {
42
+ imports: [animations_1.BrowserAnimationsModule],
43
+ };
44
+ const { imports, providers, singletons } = (0, PropertyExtractor_1.analyzeMetadata)(metadata);
45
+ expect(imports.flat(Number.MAX_VALUE)).toEqual([]);
46
+ expect(providers.flat(Number.MAX_VALUE)).toEqual([]);
47
+ expect(singletons.flat(Number.MAX_VALUE)).toEqual((0, animations_1.provideAnimations)());
48
+ });
49
+ it('should remove NoopAnimationsModule and use its providers instead', () => {
50
+ const metadata = {
51
+ imports: [animations_1.NoopAnimationsModule],
52
+ };
53
+ const { imports, providers, singletons } = (0, PropertyExtractor_1.analyzeMetadata)(metadata);
54
+ expect(imports.flat(Number.MAX_VALUE)).toEqual([]);
55
+ expect(providers.flat(Number.MAX_VALUE)).toEqual([]);
56
+ expect(singletons.flat(Number.MAX_VALUE)).toEqual((0, animations_1.provideNoopAnimations)());
57
+ });
58
+ it('should remove Browser/Animations modules recursively', () => {
59
+ const metadata = {
60
+ imports: [test_module_1.WithAnimationsModule],
61
+ };
62
+ const { imports, providers, singletons } = (0, PropertyExtractor_1.analyzeMetadata)(metadata);
63
+ expect(imports.flat(Number.MAX_VALUE)).toEqual([]);
64
+ expect(providers.flat(Number.MAX_VALUE)).toEqual([
65
+ { provide: PropertyExtractor_1.REMOVED_MODULES, useValue: test_module_1.WithAnimationsModule, multi: true },
66
+ ]);
67
+ expect(singletons.flat(Number.MAX_VALUE)).toEqual((0, animations_1.provideAnimations)());
68
+ });
69
+ it('should not destructure Angular official module', () => {
70
+ const metadata = {
71
+ imports: [test_module_1.WithOfficialModule],
72
+ };
73
+ const { imports, providers, singletons } = (0, PropertyExtractor_1.analyzeMetadata)(metadata);
74
+ expect(imports.flat(Number.MAX_VALUE)).toEqual([common_1.CommonModule, http_1.HttpClientModule]);
75
+ expect(providers.flat(Number.MAX_VALUE)).toEqual([
76
+ { provide: PropertyExtractor_1.REMOVED_MODULES, useValue: test_module_1.WithOfficialModule, multi: true },
77
+ ]);
78
+ expect(singletons.flat(Number.MAX_VALUE)).toEqual([]);
79
+ });
80
+ });
81
+ describe('extractImports', () => {
82
+ it('should return Angular official modules', () => {
83
+ const imports = (0, PropertyExtractor_1.extractImports)({ imports: [TestModuleWithImportsAndProviders] });
84
+ expect(imports).toEqual([common_1.CommonModule]);
85
+ });
86
+ it('should return standalone components', () => {
87
+ const imports = (0, PropertyExtractor_1.extractImports)({
88
+ imports: [TestModuleWithImportsAndProviders],
89
+ }, StandaloneTestComponent);
90
+ expect(imports).toEqual([common_1.CommonModule, StandaloneTestComponent]);
91
+ });
92
+ it('should not return any regular modules (they get destructured)', () => {
93
+ const imports = (0, PropertyExtractor_1.extractImports)({
94
+ imports: [
95
+ TestModuleWithDeclarations,
96
+ { ngModule: TestModuleWithImportsAndProviders, providers: [] },
97
+ ],
98
+ });
99
+ expect(imports).toEqual([common_1.CommonModule]);
100
+ });
101
+ });
102
+ describe('extractDeclarations', () => {
103
+ it('should return an array of declarations that contains `storyComponent`', () => {
104
+ const declarations = (0, PropertyExtractor_1.extractDeclarations)({ declarations: [TestComponent1] }, TestComponent2);
105
+ expect(declarations).toEqual([TestComponent1, TestComponent2]);
106
+ });
107
+ it('should ignore `storyComponent` if it is already declared', () => {
108
+ const declarations = (0, PropertyExtractor_1.extractDeclarations)({
109
+ imports: [TestModuleWithImportsAndProviders],
110
+ declarations: [TestComponent2, StandaloneTestComponent, TestDirective],
111
+ }, TestComponent1);
112
+ expect(declarations).toEqual([
113
+ TestComponent1,
114
+ TestComponent2,
115
+ StandaloneTestComponent,
116
+ TestDirective,
117
+ ]);
118
+ });
119
+ it('should ignore `storyComponent` if it is standalone', () => {
120
+ const declarations = (0, PropertyExtractor_1.extractDeclarations)({
121
+ imports: [TestModuleWithImportsAndProviders],
122
+ declarations: [TestComponent1, TestComponent2, TestDirective],
123
+ }, StandaloneTestComponent);
124
+ expect(declarations).toEqual([TestComponent1, TestComponent2, TestDirective]);
125
+ });
126
+ it('should ignore `storyComponent` if it is not a component/directive/pipe', () => {
127
+ const declarations = (0, PropertyExtractor_1.extractDeclarations)({
128
+ imports: [TestModuleWithImportsAndProviders],
129
+ declarations: [TestComponent1, TestComponent2, StandaloneTestComponent],
130
+ }, TestService);
131
+ expect(declarations).toEqual([TestComponent1, TestComponent2, StandaloneTestComponent]);
132
+ });
133
+ });
134
+ describe('extractProviders', () => {
135
+ it('should return an array of providers', () => {
136
+ const providers = (0, PropertyExtractor_1.extractProviders)({
137
+ providers: [TestService],
138
+ });
139
+ expect(providers).toEqual([TestService]);
140
+ });
141
+ it('should return an array of providers extracted from ModuleWithProviders', () => {
142
+ const providers = (0, PropertyExtractor_1.extractProviders)({
143
+ imports: [{ ngModule: TestModuleWithImportsAndProviders, providers: [TestService] }],
144
+ });
145
+ expect(providers).toEqual([
146
+ { provide: TEST_TOKEN, useValue: 123 },
147
+ { provide: PropertyExtractor_1.REMOVED_MODULES, useValue: TestModuleWithDeclarations, multi: true },
148
+ TestService,
149
+ { provide: PropertyExtractor_1.REMOVED_MODULES, useValue: TestModuleWithImportsAndProviders, multi: true },
150
+ ]);
151
+ });
152
+ it('should return an array of unique providers', () => {
153
+ const providers = (0, PropertyExtractor_1.extractProviders)({
154
+ imports: [{ ngModule: TestModuleWithImportsAndProviders, providers: [TestService] }],
155
+ providers: [TestService, { provide: TEST_TOKEN, useValue: 123 }],
156
+ });
157
+ expect(providers).toEqual([
158
+ { provide: TEST_TOKEN, useValue: 123 },
159
+ { provide: PropertyExtractor_1.REMOVED_MODULES, useValue: TestModuleWithDeclarations, multi: true },
160
+ TestService,
161
+ {
162
+ provide: new core_1.InjectionToken('testToken'),
163
+ useValue: 123,
164
+ },
165
+ {
166
+ provide: PropertyExtractor_1.REMOVED_MODULES,
167
+ useValue: TestModuleWithImportsAndProviders,
168
+ multi: true,
169
+ },
170
+ ]);
171
+ });
172
+ it('should return an array of singletons extracted', () => {
173
+ const singeltons = (0, PropertyExtractor_1.extractSingletons)({
174
+ imports: [animations_1.BrowserAnimationsModule],
175
+ });
176
+ expect(singeltons).toEqual((0, animations_1.provideAnimations)());
177
+ });
178
+ });
179
+ });
@@ -19,7 +19,7 @@ exports.default = decorateStory;
19
19
  exports.decorateStory = decorateStory;
20
20
  const prepareMain = (story, context) => {
21
21
  let { template } = story;
22
- const component = story.component ?? context.component;
22
+ const { component } = context;
23
23
  const userDefinedTemplate = !hasNoTemplate(template);
24
24
  if (!userDefinedTemplate && component) {
25
25
  template = (0, ComputesTemplateFromComponent_1.computesTemplateFromComponent)(component, story.props, '');
@@ -1,20 +1,18 @@
1
1
  "use strict";
2
- /* eslint-disable no-underscore-dangle */
3
- /* global window */
4
2
  Object.defineProperty(exports, "__esModule", { value: true });
5
3
  exports.extractComponentDescription = exports.extractArgTypes = exports.extractArgTypesFromData = exports.extractType = exports.findComponentByName = exports.checkValidCompodocJson = exports.checkValidComponentOrDirective = exports.getCompodocJson = exports.setCompodocJson = exports.isMethod = void 0;
4
+ /* eslint-disable no-underscore-dangle */
5
+ const global_1 = require("@storybook/global");
6
6
  const client_logger_1 = require("@storybook/client-logger");
7
7
  const isMethod = (methodOrProp) => {
8
8
  return methodOrProp.args !== undefined;
9
9
  };
10
10
  exports.isMethod = isMethod;
11
11
  const setCompodocJson = (compodocJson) => {
12
- // @ts-expect-error (Converted from ts-ignore)
13
- window.__STORYBOOK_COMPODOC_JSON__ = compodocJson;
12
+ global_1.global.__STORYBOOK_COMPODOC_JSON__ = compodocJson;
14
13
  };
15
14
  exports.setCompodocJson = setCompodocJson;
16
- // @ts-expect-error (Converted from ts-ignore)
17
- const getCompodocJson = () => window.__STORYBOOK_COMPODOC_JSON__;
15
+ const getCompodocJson = () => global_1.global.__STORYBOOK_COMPODOC_JSON__;
18
16
  exports.getCompodocJson = getCompodocJson;
19
17
  const checkValidComponentOrDirective = (component) => {
20
18
  if (!component.name) {
@@ -167,7 +165,7 @@ const extractDefaultValueFromComments = (property, value) => {
167
165
  let commentValue = value;
168
166
  property.jsdoctags.forEach((tag) => {
169
167
  if (['default', 'defaultvalue'].includes(tag.tagName.escapedText)) {
170
- const dom = new window.DOMParser().parseFromString(tag.comment, 'text/html');
168
+ const dom = new global_1.global.DOMParser().parseFromString(tag.comment, 'text/html');
171
169
  commentValue = dom.body.textContent;
172
170
  }
173
171
  });
@@ -6,8 +6,7 @@ const compodoc_1 = require("./compodoc");
6
6
  const sourceDecorator_1 = require("./sourceDecorator");
7
7
  exports.parameters = {
8
8
  docs: {
9
- // probably set this to true by default once it's battle-tested
10
- inlineStories: false,
9
+ story: { inline: true },
11
10
  extractArgTypes: compodoc_1.extractArgTypes,
12
11
  extractComponentDescription: compodoc_1.extractComponentDescription,
13
12
  source: {
@@ -31,7 +31,8 @@ const sourceDecorator = (storyFn, context) => {
31
31
  let toEmit;
32
32
  (0, preview_api_1.useEffect)(() => {
33
33
  if (toEmit) {
34
- channel.emit(docs_tools_1.SNIPPET_RENDERED, context.id, toEmit, 'angular');
34
+ const { id, args } = context;
35
+ channel.emit(docs_tools_1.SNIPPET_RENDERED, { id, args, source: toEmit, format: 'angular' });
35
36
  }
36
37
  });
37
38
  if (component && !userDefinedTemplate) {
@@ -13,14 +13,6 @@
13
13
  *
14
14
  * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
15
15
  */
16
- /** *************************************************************************************************
17
- * BROWSER POLYFILLS
18
- */
19
- /** IE9, IE10 and IE11 requires all of the following polyfills. * */
20
- /** IE10 and IE11 requires the following for NgClass support on SVG elements */
21
- /** Evergreen browsers require these. * */
22
- import 'core-js/es/reflect';
23
- import 'core-js/proposals/reflect-metadata';
24
16
  /**
25
17
  * Required to support Web Animations `@angular/animation`.
26
18
  * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
@@ -1,9 +1,6 @@
1
1
  "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
2
  Object.defineProperty(exports, "__esModule", { value: true });
6
- const global_1 = __importDefault(require("global"));
3
+ const global_1 = require("@storybook/global");
7
4
  /**
8
5
  * This file includes polyfills needed by Angular and is loaded before the app.
9
6
  * You can add your own extra polyfills to this file.
@@ -19,29 +16,6 @@ const global_1 = __importDefault(require("global"));
19
16
  *
20
17
  * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
21
18
  */
22
- /** *************************************************************************************************
23
- * BROWSER POLYFILLS
24
- */
25
- /** IE9, IE10 and IE11 requires all of the following polyfills. * */
26
- // import 'core-js/es6/symbol';
27
- // import 'core-js/es6/object';
28
- // import 'core-js/es6/function';
29
- // import 'core-js/es6/parse-int';
30
- // import 'core-js/es6/parse-float';
31
- // import 'core-js/es6/number';
32
- // import 'core-js/es6/math';
33
- // import 'core-js/es6/string';
34
- // import 'core-js/es6/date';
35
- // import 'core-js/es6/array';
36
- // import 'core-js/es6/regexp';
37
- // import 'core-js/es6/map';
38
- // import 'core-js/es6/weak-map';
39
- // import 'core-js/es6/set';
40
- /** IE10 and IE11 requires the following for NgClass support on SVG elements */
41
- // import 'classlist.js'; // Run `npm install --save classlist.js`.
42
- /** Evergreen browsers require these. * */
43
- require("core-js/es/reflect");
44
- require("core-js/proposals/reflect-metadata");
45
19
  /**
46
20
  * Required to support Web Animations `@angular/animation`.
47
21
  * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
@@ -63,5 +37,4 @@ require("zone.js/dist/zone"); // Included with Angular CLI.
63
37
  * Need to import at least one locale-data with intl.
64
38
  */
65
39
  // import 'intl/locale-data/jsonp/en';
66
- const { window: globalWindow } = global_1.default;
67
- globalWindow.STORYBOOK_ENV = 'angular';
40
+ global_1.global.STORYBOOK_ENV = 'angular';
@@ -1,3 +1,4 @@
1
+ import '@angular/compiler';
1
2
  import { RenderContext, ArgsStoryFn } from '@storybook/types';
2
3
  import { AngularRenderer } from './types';
3
4
  import { RendererFactory } from './angular-beta/RendererFactory';
@@ -1,17 +1,13 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.renderToCanvas = exports.render = exports.rendererFactory = void 0;
4
- const helpers_1 = require("./angular/helpers");
4
+ require("@angular/compiler");
5
5
  const RendererFactory_1 = require("./angular-beta/RendererFactory");
6
6
  exports.rendererFactory = new RendererFactory_1.RendererFactory();
7
7
  const render = (props) => ({ props });
8
8
  exports.render = render;
9
9
  async function renderToCanvas({ storyFn, showMain, forceRemount, storyContext: { parameters, component }, id, }, element) {
10
10
  showMain();
11
- if (parameters.angularLegacyRendering) {
12
- (0, helpers_1.renderNgApp)(storyFn, !forceRemount);
13
- return;
14
- }
15
11
  const renderer = await exports.rendererFactory.getRendererInstance(id, element);
16
12
  await renderer.render({
17
13
  storyFnAngular: storyFn(),
@@ -29,8 +29,6 @@ export interface AngularRenderer extends WebRenderer {
29
29
  storyResult: StoryFnAngularReturnType;
30
30
  }
31
31
  export type Parameters = DefaultParameters & {
32
- /** Uses legacy angular rendering engine that use dynamic component */
33
- angularLegacyRendering?: boolean;
34
32
  bootstrapModuleOptions?: unknown;
35
33
  };
36
34
  export type StoryContext = DefaultStoryContext<AngularRenderer> & {
package/dist/index.mjs ADDED
@@ -0,0 +1,13 @@
1
+ export * from './client/index';
2
+ export * from './types';
3
+ /*
4
+ * ATTENTION:
5
+ * - moduleMetadata
6
+ * - NgModuleMetadata
7
+ * - ICollection
8
+ *
9
+ * These typings are coped out of decorators.d.ts and types.d.ts in order to fix a bug with tsc
10
+ * It was imported out of dist before which was not the proper way of exporting public API
11
+ *
12
+ * This can be fixed by migrating app/angular to typescript
13
+ */
@@ -0,0 +1,26 @@
1
+ import path from 'path';
2
+ export const addons = [
3
+ require.resolve('./server/framework-preset-angular-cli'),
4
+ require.resolve('./server/framework-preset-angular-ivy'),
5
+ require.resolve('./server/framework-preset-angular-docs'),
6
+ ];
7
+ export const previewAnnotations = (entries = []) => [
8
+ ...entries,
9
+ require.resolve('./client/config'),
10
+ ];
11
+ export const core = async (config, options) => {
12
+ const framework = await options.presets.apply('framework');
13
+ return {
14
+ ...config,
15
+ builder: {
16
+ name: path.dirname(require.resolve(path.join('@storybook/builder-webpack5', 'package.json'))),
17
+ options: typeof framework === 'string' ? {} : framework.options.builder || {},
18
+ },
19
+ };
20
+ };
21
+ export const typescript = async (config) => {
22
+ return {
23
+ ...config,
24
+ skipBabel: true,
25
+ };
26
+ };
@@ -1,4 +1,5 @@
1
+ export { storyPropsProvider } from './client/angular-beta/StorybookProvider';
1
2
  export { computesTemplateSourceFromComponent } from './client/angular-beta/ComputesTemplateFromComponent';
2
3
  export { rendererFactory } from './client/render';
3
4
  export { AbstractRenderer } from './client/angular-beta/AbstractRenderer';
4
- export { getStorybookModuleMetadata } from './client/angular-beta/StorybookModule';
5
+ export { getApplication } from './client/angular-beta/StorybookModule';
package/dist/renderer.js CHANGED
@@ -1,6 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getStorybookModuleMetadata = exports.AbstractRenderer = exports.rendererFactory = exports.computesTemplateSourceFromComponent = void 0;
3
+ exports.getApplication = exports.AbstractRenderer = exports.rendererFactory = exports.computesTemplateSourceFromComponent = exports.storyPropsProvider = void 0;
4
+ var StorybookProvider_1 = require("./client/angular-beta/StorybookProvider");
5
+ Object.defineProperty(exports, "storyPropsProvider", { enumerable: true, get: function () { return StorybookProvider_1.storyPropsProvider; } });
4
6
  var ComputesTemplateFromComponent_1 = require("./client/angular-beta/ComputesTemplateFromComponent");
5
7
  Object.defineProperty(exports, "computesTemplateSourceFromComponent", { enumerable: true, get: function () { return ComputesTemplateFromComponent_1.computesTemplateSourceFromComponent; } });
6
8
  var render_1 = require("./client/render");
@@ -8,4 +10,4 @@ Object.defineProperty(exports, "rendererFactory", { enumerable: true, get: funct
8
10
  var AbstractRenderer_1 = require("./client/angular-beta/AbstractRenderer");
9
11
  Object.defineProperty(exports, "AbstractRenderer", { enumerable: true, get: function () { return AbstractRenderer_1.AbstractRenderer; } });
10
12
  var StorybookModule_1 = require("./client/angular-beta/StorybookModule");
11
- Object.defineProperty(exports, "getStorybookModuleMetadata", { enumerable: true, get: function () { return StorybookModule_1.getStorybookModuleMetadata; } });
13
+ Object.defineProperty(exports, "getApplication", { enumerable: true, get: function () { return StorybookModule_1.getApplication; } });
@@ -0,0 +1,5 @@
1
+ export { storyPropsProvider } from './client/angular-beta/StorybookProvider';
2
+ export { computesTemplateSourceFromComponent } from './client/angular-beta/ComputesTemplateFromComponent';
3
+ export { rendererFactory } from './client/render';
4
+ export { AbstractRenderer } from './client/angular-beta/AbstractRenderer';
5
+ export { getApplication } from './client/angular-beta/StorybookModule';
@@ -1,3 +1,4 @@
1
1
  import webpack from 'webpack';
2
2
  import { PresetOptions } from './preset-options';
3
- export declare function webpackFinal(baseConfig: webpack.Configuration, options: PresetOptions): Promise<webpack.Configuration>;
3
+ export declare function webpackFinal(baseConfig: webpack.Configuration, options: PresetOptions): Promise<any>;
4
+ export declare const migrationToBuilderReferrenceMessage: string;