diff --git a/libs/components/src/anon-layout/anon-layout-wrapper.stories.ts b/libs/components/src/anon-layout/anon-layout-wrapper.stories.ts index 63181e04649..5d9ed4300db 100644 --- a/libs/components/src/anon-layout/anon-layout-wrapper.stories.ts +++ b/libs/components/src/anon-layout/anon-layout-wrapper.stories.ts @@ -1,4 +1,4 @@ -import { importProvidersFrom, Component } from "@angular/core"; +import { importProvidersFrom, Component, ChangeDetectionStrategy, signal } from "@angular/core"; import { RouterModule, Routes } from "@angular/router"; import { Meta, @@ -31,7 +31,6 @@ export default { } as Meta; const decorators = (options: { - components: any[]; routes: Routes; applicationVersion?: string; clientType?: ClientType; @@ -56,7 +55,6 @@ const decorators = (options: { }, ), moduleMetadata({ - declarations: options.components, imports: [RouterModule, ButtonModule], providers: [ { @@ -103,39 +101,31 @@ type Story = StoryObj; // Default Example -// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush -// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection @Component({ selector: "bit-default-primary-outlet-example-component", template: "

Primary Outlet Example:
your primary component goes here

", - standalone: false, + changeDetection: ChangeDetectionStrategy.OnPush, }) export class DefaultPrimaryOutletExampleComponent {} -// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush -// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection @Component({ selector: "bit-default-secondary-outlet-example-component", template: "

Secondary Outlet Example:
your secondary component goes here

", - standalone: false, + changeDetection: ChangeDetectionStrategy.OnPush, }) export class DefaultSecondaryOutletExampleComponent {} -// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush -// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection @Component({ selector: "bit-default-env-selector-outlet-example-component", template: "

Env Selector Outlet Example:
your env selector component goes here

", - standalone: false, + changeDetection: ChangeDetectionStrategy.OnPush, }) export class DefaultEnvSelectorOutletExampleComponent {} -// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush -// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection @Component({ selector: "bit-header-actions-outlet-example-component", template: "

Header Actions Outlet Example:
your header actions component goes here

", - standalone: false, + changeDetection: ChangeDetectionStrategy.OnPush, }) export class DefaultHeaderActionsOutletExampleComponent {} @@ -145,11 +135,6 @@ export const DefaultContentExample: Story = { template: "", }), decorators: decorators({ - components: [ - DefaultPrimaryOutletExampleComponent, - DefaultSecondaryOutletExampleComponent, - DefaultEnvSelectorOutletExampleComponent, - ], routes: [ { path: "**", @@ -212,28 +197,27 @@ const changedData: AnonLayoutWrapperData = { pageIcon: RegistrationCheckEmailIcon, }; -// FIXME(https://bitwarden.atlassian.net/browse/CL-764): Migrate to OnPush -// eslint-disable-next-line @angular-eslint/prefer-on-push-component-change-detection @Component({ selector: "bit-dynamic-content-example-component", template: ` `, - standalone: false, + imports: [ButtonModule], + changeDetection: ChangeDetectionStrategy.OnPush, }) export class DynamicContentExampleComponent { - initialData = true; + private readonly initialData = signal(true); constructor(private anonLayoutWrapperDataService: AnonLayoutWrapperDataService) {} toggleData() { - if (this.initialData) { + if (this.initialData()) { this.anonLayoutWrapperDataService.setAnonLayoutWrapperData(changedData); } else { this.anonLayoutWrapperDataService.setAnonLayoutWrapperData(initialData); } - this.initialData = !this.initialData; + this.initialData.update((v) => !v); } } @@ -243,7 +227,6 @@ export const DynamicContentExample: Story = { template: "", }), decorators: decorators({ - components: [DynamicContentExampleComponent], routes: [ { path: "**", diff --git a/libs/components/src/header/header.component.ts b/libs/components/src/header/header.component.ts index 44b0c063d89..a60e4619baf 100644 --- a/libs/components/src/header/header.component.ts +++ b/libs/components/src/header/header.component.ts @@ -7,7 +7,6 @@ import { TypographyDirective } from "../typography/typography.directive"; templateUrl: "./header.component.html", imports: [TypographyDirective], changeDetection: ChangeDetectionStrategy.OnPush, - standalone: true, }) export class HeaderComponent { /** diff --git a/libs/components/src/icon/icon.component.ts b/libs/components/src/icon/icon.component.ts index c1ec43d5bd0..d11176ec790 100644 --- a/libs/components/src/icon/icon.component.ts +++ b/libs/components/src/icon/icon.component.ts @@ -10,7 +10,6 @@ import { BitwardenIcon } from "../shared/icon"; @Component({ selector: "bit-icon", - standalone: true, host: { "[class]": "classList()", "[attr.aria-hidden]": "ariaLabel() ? null : true", diff --git a/libs/components/src/landing-layout/landing-card.component.ts b/libs/components/src/landing-layout/landing-card.component.ts index cea04f6f784..d1bd70dce53 100644 --- a/libs/components/src/landing-layout/landing-card.component.ts +++ b/libs/components/src/landing-layout/landing-card.component.ts @@ -26,7 +26,6 @@ import { BaseCardComponent } from "../card"; @Component({ selector: "bit-landing-card", changeDetection: ChangeDetectionStrategy.OnPush, - standalone: true, imports: [BaseCardComponent], templateUrl: "./landing-card.component.html", }) diff --git a/libs/components/src/layout/scroll-layout.directive.ts b/libs/components/src/layout/scroll-layout.directive.ts index 35a4c5b63d8..1ae6fb94f05 100644 --- a/libs/components/src/layout/scroll-layout.directive.ts +++ b/libs/components/src/layout/scroll-layout.directive.ts @@ -28,7 +28,6 @@ export class ScrollLayoutService { **/ @Directive({ selector: "[bitScrollLayoutHost]", - standalone: true, host: { class: "cdk-virtual-scrollable", }, @@ -55,7 +54,6 @@ export class ScrollLayoutHostDirective implements OnDestroy { */ @Directive({ selector: "[bitScrollLayout]", - standalone: true, providers: [{ provide: VIRTUAL_SCROLLABLE, useExisting: ScrollLayoutDirective }], }) export class ScrollLayoutDirective extends CdkVirtualScrollable implements OnInit { diff --git a/libs/components/src/menu/menu-trigger-for.directive.ts b/libs/components/src/menu/menu-trigger-for.directive.ts index 6306f3326d6..58cffbe9ac0 100644 --- a/libs/components/src/menu/menu-trigger-for.directive.ts +++ b/libs/components/src/menu/menu-trigger-for.directive.ts @@ -53,7 +53,6 @@ const CONTEXT_MENU_POSITIONS: ConnectedPosition[] = [ @Directive({ selector: "[bitMenuTriggerFor]", exportAs: "menuTrigger", - standalone: true, host: { "[attr.role]": "this.role()" }, }) export class MenuTriggerForDirective implements OnDestroy { diff --git a/libs/components/src/popover/popover-trigger-for.directive.spec.ts b/libs/components/src/popover/popover-trigger-for.directive.spec.ts index 8a3bdc2cb8c..cb0180f89ab 100644 --- a/libs/components/src/popover/popover-trigger-for.directive.spec.ts +++ b/libs/components/src/popover/popover-trigger-for.directive.spec.ts @@ -15,7 +15,6 @@ import { PopoverComponent } from "./popover.component"; * - tick(0) flushes microtasks, useful for Angular effects that run synchronously */ @Component({ - standalone: true, template: ` `, })