@storybook/angular 7.0.0-alpha.45 → 7.0.0-alpha.47

package/dist/client/angular-beta/__testfixtures__/input.component.js

@@ -0,0 +1,67 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputComponent = exports.ButtonAccent = exports.exportedConstant = void 0;
+const core_1 = require("@angular/core");
+exports.exportedConstant = 'An exported constant';
+var ButtonAccent;
+(function (ButtonAccent) {
+    ButtonAccent["Normal"] = "Normal";
+    ButtonAccent["High"] = "High";
+})(ButtonAccent = exports.ButtonAccent || (exports.ButtonAccent = {}));
+let InputComponent = class InputComponent {
+    constructor() {
+        /** Appearance style of the button. */
+        this.appearance = 'secondary';
+        /** Sets the button to a disabled state. */
+        this.isDisabled = false;
+        this.onClick = new core_1.EventEmitter();
+    }
+};
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", String)
+], InputComponent.prototype, "appearance", void 0);
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", Number)
+], InputComponent.prototype, "counter", void 0);
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", String)
+], InputComponent.prototype, "accent", void 0);
+__decorate([
+    (0, core_1.Input)('color'),
+    __metadata("design:type", String)
+], InputComponent.prototype, "foregroundColor", void 0);
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", Object)
+], InputComponent.prototype, "isDisabled", void 0);
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", String)
+], InputComponent.prototype, "label", void 0);
+__decorate([
+    (0, core_1.Input)(),
+    __metadata("design:type", Object)
+], InputComponent.prototype, "someDataObject", void 0);
+__decorate([
+    (0, core_1.Output)(),
+    __metadata("design:type", Object)
+], InputComponent.prototype, "onClick", void 0);
+InputComponent = __decorate([
+    (0, core_1.Component)({
+        selector: 'doc-button',
+        template: '<button>{{ label }}</button>',
+    })
+], InputComponent);
+exports.InputComponent = InputComponent;

package/dist/{types/client → client}/angular-beta/utils/NgComponentAnalyzer.d.ts

@@ -1,4 +1,4 @@
-import { Component, Type } from '@angular/core';
+import { Type, Component } from '@angular/core';
 export declare type ComponentInputsOutputs = {
     inputs: {
         propName: string;

package/dist/client/angular-beta/utils/NgComponentAnalyzer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/angular-beta/utils/NgComponentAnalyzer.test.js

@@ -0,0 +1,340 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const core_1 = require("@angular/core");
+const testing_1 = require("@angular/core/testing");
+const testing_2 = require("@angular/platform-browser-dynamic/testing");
+const NgComponentAnalyzer_1 = require("./NgComponentAnalyzer");
+describe('getComponentInputsOutputs', () => {
+    it('should return empty if no I/O found', () => {
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({})
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.getComponentInputsOutputs)(FooComponent)).toEqual({
+            inputs: [],
+            outputs: [],
+        });
+        class BarComponent {
+        }
+        expect((0, NgComponentAnalyzer_1.getComponentInputsOutputs)(BarComponent)).toEqual({
+            inputs: [],
+            outputs: [],
+        });
+    });
+    it('should return I/O', () => {
+        let FooComponent = class FooComponent {
+            constructor() {
+                this.output = new core_1.EventEmitter();
+                this.outputWithBindingPropertyName = new core_1.EventEmitter();
+            }
+        };
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "input", void 0);
+        __decorate([
+            (0, core_1.Input)('inputPropertyName'),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "inputWithBindingPropertyName", void 0);
+        __decorate([
+            (0, core_1.Output)(),
+            __metadata("design:type", Object)
+        ], FooComponent.prototype, "output", void 0);
+        __decorate([
+            (0, core_1.Output)('outputPropertyName'),
+            __metadata("design:type", Object)
+        ], FooComponent.prototype, "outputWithBindingPropertyName", void 0);
+        FooComponent = __decorate([
+            (0, core_1.Component)({
+                template: '',
+                inputs: ['inputInComponentMetadata'],
+                outputs: ['outputInComponentMetadata'],
+            })
+        ], FooComponent);
+        const fooComponentFactory = resolveComponentFactory(FooComponent);
+        const { inputs, outputs } = (0, NgComponentAnalyzer_1.getComponentInputsOutputs)(FooComponent);
+        expect({ inputs, outputs }).toEqual({
+            inputs: [
+                { propName: 'inputInComponentMetadata', templateName: 'inputInComponentMetadata' },
+                { propName: 'input', templateName: 'input' },
+                { propName: 'inputWithBindingPropertyName', templateName: 'inputPropertyName' },
+            ],
+            outputs: [
+                { propName: 'outputInComponentMetadata', templateName: 'outputInComponentMetadata' },
+                { propName: 'output', templateName: 'output' },
+                { propName: 'outputWithBindingPropertyName', templateName: 'outputPropertyName' },
+            ],
+        });
+        expect(sortByPropName(inputs)).toEqual(sortByPropName(fooComponentFactory.inputs));
+        expect(sortByPropName(outputs)).toEqual(sortByPropName(fooComponentFactory.outputs));
+    });
+    it("should return I/O when some of component metadata has the same name as one of component's properties", () => {
+        let FooComponent = class FooComponent {
+            constructor() {
+                this.output = new core_1.EventEmitter();
+                this.outputWithBindingPropertyName = new core_1.EventEmitter();
+            }
+        };
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "input", void 0);
+        __decorate([
+            (0, core_1.Input)('inputPropertyName'),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "inputWithBindingPropertyName", void 0);
+        __decorate([
+            (0, core_1.Output)(),
+            __metadata("design:type", Object)
+        ], FooComponent.prototype, "output", void 0);
+        __decorate([
+            (0, core_1.Output)('outputPropertyName'),
+            __metadata("design:type", Object)
+        ], FooComponent.prototype, "outputWithBindingPropertyName", void 0);
+        FooComponent = __decorate([
+            (0, core_1.Component)({
+                template: '',
+                inputs: ['input', 'inputWithBindingPropertyName'],
+                outputs: ['outputWithBindingPropertyName'],
+            })
+        ], FooComponent);
+        const fooComponentFactory = resolveComponentFactory(FooComponent);
+        const { inputs, outputs } = (0, NgComponentAnalyzer_1.getComponentInputsOutputs)(FooComponent);
+        expect(sortByPropName(inputs)).toEqual(sortByPropName(fooComponentFactory.inputs));
+        expect(sortByPropName(outputs)).toEqual(sortByPropName(fooComponentFactory.outputs));
+    });
+    it('should return I/O in the presence of multiple decorators', () => {
+        let FooComponent = class FooComponent {
+        };
+        __decorate([
+            (0, core_1.Input)(),
+            (0, core_1.HostBinding)('class.preceeding-first'),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "inputPreceedingHostBinding", void 0);
+        __decorate([
+            (0, core_1.HostBinding)('class.following-binding'),
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "inputFollowingHostBinding", void 0);
+        FooComponent = __decorate([
+            (0, core_1.Component)({
+                template: '',
+            })
+        ], FooComponent);
+        const fooComponentFactory = resolveComponentFactory(FooComponent);
+        const { inputs, outputs } = (0, NgComponentAnalyzer_1.getComponentInputsOutputs)(FooComponent);
+        expect({ inputs, outputs }).toEqual({
+            inputs: [
+                { propName: 'inputPreceedingHostBinding', templateName: 'inputPreceedingHostBinding' },
+                { propName: 'inputFollowingHostBinding', templateName: 'inputFollowingHostBinding' },
+            ],
+            outputs: [],
+        });
+        expect(sortByPropName(inputs)).toEqual(sortByPropName(fooComponentFactory.inputs));
+        expect(sortByPropName(outputs)).toEqual(sortByPropName(fooComponentFactory.outputs));
+    });
+    it('should return I/O with extending classes', () => {
+        let BarComponent = class BarComponent {
+        };
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], BarComponent.prototype, "a", void 0);
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], BarComponent.prototype, "b", void 0);
+        BarComponent = __decorate([
+            (0, core_1.Component)({
+                template: '',
+            })
+        ], BarComponent);
+        let FooComponent = class FooComponent extends BarComponent {
+        };
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "b", void 0);
+        __decorate([
+            (0, core_1.Input)(),
+            __metadata("design:type", String)
+        ], FooComponent.prototype, "c", void 0);
+        FooComponent = __decorate([
+            (0, core_1.Component)({
+                template: '',
+            })
+        ], FooComponent);
+        const fooComponentFactory = resolveComponentFactory(FooComponent);
+        const { inputs, outputs } = (0, NgComponentAnalyzer_1.getComponentInputsOutputs)(FooComponent);
+        expect({ inputs, outputs }).toEqual({
+            inputs: [
+                { propName: 'a', templateName: 'a' },
+                { propName: 'b', templateName: 'b' },
+                { propName: 'c', templateName: 'c' },
+            ],
+            outputs: [],
+        });
+        expect(sortByPropName(inputs)).toEqual(sortByPropName(fooComponentFactory.inputs));
+        expect(sortByPropName(outputs)).toEqual(sortByPropName(fooComponentFactory.outputs));
+    });
+});
+describe('isDeclarable', () => {
+    it('should return true with a Component', () => {
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({})
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.isDeclarable)(FooComponent)).toEqual(true);
+    });
+    it('should return true with a Directive', () => {
+        let FooDirective = class FooDirective {
+        };
+        FooDirective = __decorate([
+            (0, core_1.Directive)({})
+        ], FooDirective);
+        expect((0, NgComponentAnalyzer_1.isDeclarable)(FooDirective)).toEqual(true);
+    });
+    it('should return true with a Pipe', () => {
+        let FooPipe = class FooPipe {
+        };
+        FooPipe = __decorate([
+            (0, core_1.Pipe)({ name: 'pipe' })
+        ], FooPipe);
+        expect((0, NgComponentAnalyzer_1.isDeclarable)(FooPipe)).toEqual(true);
+    });
+    it('should return false with simple class', () => {
+        class FooPipe {
+        }
+        expect((0, NgComponentAnalyzer_1.isDeclarable)(FooPipe)).toEqual(false);
+    });
+    it('should return false with Injectable', () => {
+        let FooInjectable = class FooInjectable {
+        };
+        FooInjectable = __decorate([
+            (0, core_1.Injectable)()
+        ], FooInjectable);
+        expect((0, NgComponentAnalyzer_1.isDeclarable)(FooInjectable)).toEqual(false);
+    });
+});
+describe('isComponent', () => {
+    it('should return true with a Component', () => {
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({})
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.isComponent)(FooComponent)).toEqual(true);
+    });
+    it('should return false with simple class', () => {
+        class FooPipe {
+        }
+        expect((0, NgComponentAnalyzer_1.isComponent)(FooPipe)).toEqual(false);
+    });
+    it('should return false with Directive', () => {
+        let FooDirective = class FooDirective {
+        };
+        FooDirective = __decorate([
+            (0, core_1.Directive)()
+        ], FooDirective);
+        expect((0, NgComponentAnalyzer_1.isComponent)(FooDirective)).toEqual(false);
+    });
+});
+describe('isStandaloneComponent', () => {
+    it('should return true with a Component with "standalone: true"', () => {
+        // TODO: `standalone` is only available in Angular v14. Remove cast to `any` once
+        // Angular deps are updated to v14.x.x.
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({ standalone: true })
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.isStandaloneComponent)(FooComponent)).toEqual(true);
+    });
+    it('should return false with a Component with "standalone: false"', () => {
+        // TODO: `standalone` is only available in Angular v14. Remove cast to `any` once
+        // Angular deps are updated to v14.x.x.
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({ standalone: false })
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.isStandaloneComponent)(FooComponent)).toEqual(false);
+    });
+    it('should return false with a Component without the "standalone" property', () => {
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({})
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.isStandaloneComponent)(FooComponent)).toEqual(false);
+    });
+    it('should return false with simple class', () => {
+        class FooPipe {
+        }
+        expect((0, NgComponentAnalyzer_1.isStandaloneComponent)(FooPipe)).toEqual(false);
+    });
+    it('should return false with Directive', () => {
+        let FooDirective = class FooDirective {
+        };
+        FooDirective = __decorate([
+            (0, core_1.Directive)()
+        ], FooDirective);
+        expect((0, NgComponentAnalyzer_1.isStandaloneComponent)(FooDirective)).toEqual(false);
+    });
+});
+describe('getComponentDecoratorMetadata', () => {
+    it('should return Component with a Component', () => {
+        let FooComponent = class FooComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({ selector: 'foo' })
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.getComponentDecoratorMetadata)(FooComponent)).toBeInstanceOf(core_1.Component);
+        expect((0, NgComponentAnalyzer_1.getComponentDecoratorMetadata)(FooComponent)).toEqual({
+            changeDetection: 1,
+            selector: 'foo',
+        });
+    });
+    it('should return Component with extending classes', () => {
+        let BarComponent = class BarComponent {
+        };
+        BarComponent = __decorate([
+            (0, core_1.Component)({ selector: 'bar' })
+        ], BarComponent);
+        let FooComponent = class FooComponent extends BarComponent {
+        };
+        FooComponent = __decorate([
+            (0, core_1.Component)({ selector: 'foo' })
+        ], FooComponent);
+        expect((0, NgComponentAnalyzer_1.getComponentDecoratorMetadata)(FooComponent)).toBeInstanceOf(core_1.Component);
+        expect((0, NgComponentAnalyzer_1.getComponentDecoratorMetadata)(FooComponent)).toEqual({
+            changeDetection: 1,
+            selector: 'foo',
+        });
+    });
+});
+function sortByPropName(array) {
+    return array.sort((a, b) => a.propName.localeCompare(b.propName));
+}
+function resolveComponentFactory(component) {
+    testing_1.TestBed.configureTestingModule({
+        declarations: [component],
+    }).overrideModule(testing_2.BrowserDynamicTestingModule, {
+        set: {
+            entryComponents: [component],
+        },
+    });
+    const componentFactoryResolver = testing_1.TestBed.inject(core_1.ComponentFactoryResolver);
+    return componentFactoryResolver.resolveComponentFactory(component);
+}

package/dist/client/angular-beta/utils/NgModulesAnalyzer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/client/angular-beta/utils/NgModulesAnalyzer.test.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const core_1 = require("@angular/core");
+const NgModulesAnalyzer_1 = require("./NgModulesAnalyzer");
+const FooComponent = (0, core_1.Component)({})(class {
+});
+const BarComponent = (0, core_1.Component)({})(class {
+});
+const BetaModule = (0, core_1.NgModule)({ declarations: [FooComponent] })(class {
+});
+const AlphaModule = (0, core_1.NgModule)({ imports: [BetaModule] })(class {
+});
+describe('isComponentAlreadyDeclaredInModules', () => {
+    it('should return true when the component is already declared in one of modules', () => {
+        expect((0, NgModulesAnalyzer_1.isComponentAlreadyDeclaredInModules)(FooComponent, [], [AlphaModule])).toEqual(true);
+    });
+    it('should return true if the component is in moduleDeclarations', () => {
+        expect((0, NgModulesAnalyzer_1.isComponentAlreadyDeclaredInModules)(BarComponent, [BarComponent], [AlphaModule])).toEqual(true);
+    });
+    it('should return false if the component is not declared', () => {
+        expect((0, NgModulesAnalyzer_1.isComponentAlreadyDeclaredInModules)(BarComponent, [], [AlphaModule])).toEqual(false);
+    });
+});

package/dist/{types/client → client}/decorateStory.d.ts

@@ -1,4 +1,4 @@
-import type { DecoratorFunction, LegacyStoryFn } from '@storybook/types';
-import type { AngularFramework } from './types';
+import { DecoratorFunction, LegacyStoryFn } from '@storybook/types';
+import { AngularFramework } from './types';
 export default function decorateStory(mainStoryFn: LegacyStoryFn<AngularFramework>, decorators: DecoratorFunction<AngularFramework>[]): LegacyStoryFn<AngularFramework>;
 export { decorateStory };

package/dist/client/decorateStory.test.d.ts

@@ -0,0 +1 @@
+export {};