feat: add static forRoot method that injects styles

npm/ng-packs/packages/theme-basic/src/lib/services/index.ts

@@ -1,2 +1 @@
-export * from './initial.service';
 export * from './layout-state.service';

npm/ng-packs/packages/theme-basic/src/lib/services/initial.service.ts

@@ -1,34 +0,0 @@
-import { DomInsertionService, AddReplaceableComponent, CONTENT_STRATEGY } from '@abp/ng.core';
-import { Injectable } from '@angular/core';
-import { Store } from '@ngxs/store';
-import styles from '../constants/styles';
-import { ApplicationLayoutComponent } from '../components/application-layout/application-layout.component';
-import { AccountLayoutComponent } from '../components/account-layout/account-layout.component';
-import { EmptyLayoutComponent } from '../components/empty-layout/empty-layout.component';
-import { eThemeBasicComponents } from '../enums/components';
-
-@Injectable({ providedIn: 'root' })
-export class InitialService {
-  constructor(private domInsertion: DomInsertionService, private store: Store) {
-    this.appendStyle();
-
-    this.store.dispatch([
-      new AddReplaceableComponent({
-        key: eThemeBasicComponents.ApplicationLayout,
-        component: ApplicationLayoutComponent,
-      }),
-      new AddReplaceableComponent({
-        key: eThemeBasicComponents.AccountLayout,
-        component: AccountLayoutComponent,
-      }),
-      new AddReplaceableComponent({
-        key: eThemeBasicComponents.EmptyLayout,
-        component: EmptyLayoutComponent,
-      }),
-    ]);
-  }
-
-  appendStyle() {
-    this.domInsertion.insertContent(CONTENT_STRATEGY.AppendStyleToHead(styles));
-  }
-}

npm/ng-packs/packages/theme-basic/src/lib/theme-basic.module.ts

@@ -1,6 +1,6 @@
 import { CoreModule } from '@abp/ng.core';
 import { ThemeSharedModule } from '@abp/ng.theme.shared';
-import { NgModule } from '@angular/core';
+import { ModuleWithProviders, NgModule } from '@angular/core';
 import { NgbCollapseModule, NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
 import { NgxValidateCoreModule } from '@ngx-validate/core';
 import { NgxsModule } from '@ngxs/store';
@@ -11,7 +11,7 @@ import { LogoComponent } from './components/logo/logo.component';
 import { NavItemsComponent } from './components/nav-items/nav-items.component';
 import { RoutesComponent } from './components/routes/routes.component';
 import { ValidationErrorComponent } from './components/validation-error/validation-error.component';
-import { InitialService } from './services/initial.service';
+import { BASIC_THEME_STYLES_PROVIDERS } from './providers/styles.provider';
 import { LayoutState } from './states/layout.state';
 
 export const LAYOUTS = [ApplicationLayoutComponent, AccountLayoutComponent, EmptyLayoutComponent];
@@ -62,5 +62,10 @@ export const LAYOUTS = [ApplicationLayoutComponent, AccountLayoutComponent, Empt
   entryComponents: [...LAYOUTS, ValidationErrorComponent],
 })
 export class ThemeBasicModule {
-  constructor(private initialService: InitialService) {}
+  static forRoot(): ModuleWithProviders<ThemeBasicModule> {
+    return {
+      ngModule: ThemeBasicModule,
+      providers: [BASIC_THEME_STYLES_PROVIDERS],
+    };
+  }
 }