From 6c20b28046ce00b66c592e910cb672b7873608d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafa=C5=82=20Wolak?= <r.wolak@design4.pro>
Date: Thu, 24 Nov 2022 22:20:37 +0100
Subject: [PATCH 1/3] fix(ng-styled): lint errors fix

---
 .../src/app/app-shell/app-shell.component.ts              | 8 ++------
 .../app/layout/layout-header/layout-header.component.ts   | 4 ++--
 apps/ng-styled-webpage/src/app/layout/layout.component.ts | 4 ++--
 .../ng-styled-webpage/src/app/page/home/home.component.ts | 2 +-
 .../src/app/shared/code/code.component.ts                 | 2 +-
 5 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/apps/ng-styled-webpage/src/app/app-shell/app-shell.component.ts b/apps/ng-styled-webpage/src/app/app-shell/app-shell.component.ts
index 753a5b1..2e39c20 100644
--- a/apps/ng-styled-webpage/src/app/app-shell/app-shell.component.ts
+++ b/apps/ng-styled-webpage/src/app/app-shell/app-shell.component.ts
@@ -1,12 +1,8 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'ng-styled-app-shell',
   templateUrl: './app-shell.component.html',
   styleUrls: ['./app-shell.component.css'],
 })
-export class AppShellComponent implements OnInit {
-  constructor() {}
-
-  ngOnInit(): void {}
-}
+export class AppShellComponent {}
diff --git a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
index 3adaa80..89bc7a2 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
@@ -9,10 +9,10 @@ import { COMPONENT_STYLES } from './layout-header.component.styles';
 })
 @Styled(({ css }) => css(COMPONENT_STYLES))
 export class LayoutHeaderComponent {
-  classes: any;
+  classes: { host: string } | undefined;
 
   @HostBinding('class')
   get className() {
-    return this.classes.host;
+    return this.classes?.host;
   }
 }
diff --git a/apps/ng-styled-webpage/src/app/layout/layout.component.ts b/apps/ng-styled-webpage/src/app/layout/layout.component.ts
index e8e3bfc..80bc015 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout.component.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout.component.ts
@@ -9,10 +9,10 @@ import { COMPONENT_STYLES } from './layout.component.styles';
 })
 @Styled(({ css }) => css(COMPONENT_STYLES))
 export class LayoutComponent {
-  classes: any;
+  classes: { host: string } | undefined;
 
   @HostBinding('class')
   get className() {
-    return this.classes.host;
+    return this.classes?.host;
   }
 }
diff --git a/apps/ng-styled-webpage/src/app/page/home/home.component.ts b/apps/ng-styled-webpage/src/app/page/home/home.component.ts
index c12d644..47bf555 100644
--- a/apps/ng-styled-webpage/src/app/page/home/home.component.ts
+++ b/apps/ng-styled-webpage/src/app/page/home/home.component.ts
@@ -33,7 +33,7 @@ import { Styled, StyledProp } from '@design4pro/ng-styled';
 })
 export class HomeComponent {
   title = 'Angular JSS';
-  classes: any;
+  classes: { root: string; title: string; hint: string } | undefined;
 
   code = `
     import { ChangeDetectionStrategy, Component } from '@angular/core';
diff --git a/apps/ng-styled-webpage/src/app/shared/code/code.component.ts b/apps/ng-styled-webpage/src/app/shared/code/code.component.ts
index 419b442..8461c4c 100644
--- a/apps/ng-styled-webpage/src/app/shared/code/code.component.ts
+++ b/apps/ng-styled-webpage/src/app/shared/code/code.component.ts
@@ -16,7 +16,7 @@ import { GITHUB_STYLES } from './code.component.styles';
   );
 })
 export class CodeComponent {
-  classes: any;
+  classes: { root: string } | undefined;
 
   @Input()
   code = '';

From d37bcc388b7796e131c51fba0aae4d241b1194aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafa=C5=82=20Wolak?= <r.wolak@design4.pro>
Date: Thu, 24 Nov 2022 22:35:40 +0100
Subject: [PATCH 2/3] fix(ng-styled-webpage): classes fix

---
 .../src/app/layout/layout-header/layout-header.component.html   | 2 +-
 .../src/app/layout/layout-header/layout-header.component.ts     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.html b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.html
index 78d1b4f..d586ef2 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.html
+++ b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.html
@@ -4,4 +4,4 @@
   width="48"
   alt="Angular Logo"
 />
-<h1 [ngClass]="classes.h1">Angular JSS <span>by DESIGN4PRO</span></h1>
+<h1 [ngClass]="classes?.h1">Angular JSS <span>by DESIGN4PRO</span></h1>
diff --git a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
index 89bc7a2..f22efbf 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.ts
@@ -9,7 +9,7 @@ import { COMPONENT_STYLES } from './layout-header.component.styles';
 })
 @Styled(({ css }) => css(COMPONENT_STYLES))
 export class LayoutHeaderComponent {
-  classes: { host: string } | undefined;
+  classes: { host: string; h1: string } | undefined;
 
   @HostBinding('class')
   get className() {

From 9884f6d0bac94d883d0e6518b660b7b495a462d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafa=C5=82=20Wolak?= <r.wolak@design4.pro>
Date: Fri, 25 Nov 2022 08:59:43 +0100
Subject: [PATCH 3/3] fix(ci): fix test

---
 apps/ng-styled-webpage/src/app/app.component.spec.ts         | 2 ++
 apps/ng-styled-webpage/src/app/app.module.ts                 | 2 +-
 .../app/layout/layout-footer/layout-footer.component.html    | 2 +-
 .../src/app/layout/layout-footer/layout-footer.component.ts  | 4 +++-
 .../app/layout/layout-header/layout-header.component.spec.ts | 1 -
 .../src/app/layout/layout.component.spec.ts                  | 4 ++--
 .../src/app/page/home/home.component.spec.ts                 | 4 ++--
 .../src/app/shared/code/code.component.spec.ts               | 3 ++-
 libs/ng-styled/src/lib/styled.module.ts                      | 4 ++--
 libs/ng-styled/src/lib/styled.service.ts                     | 2 +-
 libs/ng-styled/src/lib/theme/theme-context.ts                | 5 +++--
 11 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/apps/ng-styled-webpage/src/app/app.component.spec.ts b/apps/ng-styled-webpage/src/app/app.component.spec.ts
index 059bb54..c921acf 100644
--- a/apps/ng-styled-webpage/src/app/app.component.spec.ts
+++ b/apps/ng-styled-webpage/src/app/app.component.spec.ts
@@ -1,10 +1,12 @@
 import { TestBed } from '@angular/core/testing';
+import { RouterModule } from '@angular/router';
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       declarations: [AppComponent],
+      imports: [RouterModule],
     }).compileComponents();
   });
 
diff --git a/apps/ng-styled-webpage/src/app/app.module.ts b/apps/ng-styled-webpage/src/app/app.module.ts
index 8420d08..f9c9130 100644
--- a/apps/ng-styled-webpage/src/app/app.module.ts
+++ b/apps/ng-styled-webpage/src/app/app.module.ts
@@ -2,8 +2,8 @@ import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import {
   createTheme,
-  StyledModule,
   Options,
+  StyledModule,
   Theme,
 } from '@design4pro/ng-styled';
 import { create, Jss } from 'jss';
diff --git a/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.html b/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.html
index 4dd1775..77acd1a 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.html
+++ b/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.html
@@ -1 +1 @@
-<p>layout-footer works!</p>
+<p>©{{ year }} DESIGN4PRO</p>
diff --git a/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.ts b/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.ts
index 3cdad82..e806d6c 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout-footer/layout-footer.component.ts
@@ -5,4 +5,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
   templateUrl: './layout-footer.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class LayoutFooterComponent {}
+export class LayoutFooterComponent {
+  year = new Date().getFullYear();
+}
diff --git a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.spec.ts b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.spec.ts
index 57b3a26..9f38e62 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.spec.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout-header/layout-header.component.spec.ts
@@ -1,5 +1,4 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { LayoutHeaderComponent } from './layout-header.component';
 
 describe('LayoutHeaderComponent', () => {
diff --git a/apps/ng-styled-webpage/src/app/layout/layout.component.spec.ts b/apps/ng-styled-webpage/src/app/layout/layout.component.spec.ts
index ba2fd32..dd39a5a 100644
--- a/apps/ng-styled-webpage/src/app/layout/layout.component.spec.ts
+++ b/apps/ng-styled-webpage/src/app/layout/layout.component.spec.ts
@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { AppModule } from '../app.module';
 import { LayoutComponent } from './layout.component';
 
 describe('LayoutComponent', () => {
@@ -8,7 +8,7 @@ describe('LayoutComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [LayoutComponent],
+      imports: [AppModule],
     }).compileComponents();
   });
 
diff --git a/apps/ng-styled-webpage/src/app/page/home/home.component.spec.ts b/apps/ng-styled-webpage/src/app/page/home/home.component.spec.ts
index 0c08827..7eda747 100644
--- a/apps/ng-styled-webpage/src/app/page/home/home.component.spec.ts
+++ b/apps/ng-styled-webpage/src/app/page/home/home.component.spec.ts
@@ -1,6 +1,6 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { HomeComponent } from './home.component';
+import { HomeModule } from './home.module';
 
 describe('HomeComponent', () => {
   let component: HomeComponent;
@@ -8,7 +8,7 @@ describe('HomeComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [HomeComponent],
+      imports: [HomeModule],
     }).compileComponents();
   });
 
diff --git a/apps/ng-styled-webpage/src/app/shared/code/code.component.spec.ts b/apps/ng-styled-webpage/src/app/shared/code/code.component.spec.ts
index 612f275..a182d13 100644
--- a/apps/ng-styled-webpage/src/app/shared/code/code.component.spec.ts
+++ b/apps/ng-styled-webpage/src/app/shared/code/code.component.spec.ts
@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { SharedModule } from '../shared.module';
 import { CodeComponent } from './code.component';
 
 describe('CodeComponent', () => {
@@ -9,6 +9,7 @@ describe('CodeComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       declarations: [CodeComponent],
+      imports: [SharedModule],
     }).compileComponents();
   });
 
diff --git a/libs/ng-styled/src/lib/styled.module.ts b/libs/ng-styled/src/lib/styled.module.ts
index bcaf44e..a85a040 100644
--- a/libs/ng-styled/src/lib/styled.module.ts
+++ b/libs/ng-styled/src/lib/styled.module.ts
@@ -1,5 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { APP_INITIALIZER, ModuleWithProviders, NgModule } from '@angular/core';
+import { JssStore } from './jss/context';
 import {
   StyledOptions,
   styledOptionsFactory,
@@ -8,8 +9,7 @@ import {
   STYLED_OPTIONS_INJECTOR,
   STYLED_THEME_INJECTOR,
 } from './styled.options';
-import { StyledService, styledFactory } from './styled.service';
-import { JssStore } from './jss/context';
+import { styledFactory, StyledService } from './styled.service';
 import defaultTheme from './theme/default-theme';
 import { ThemeStore } from './theme/theme-context';
 
diff --git a/libs/ng-styled/src/lib/styled.service.ts b/libs/ng-styled/src/lib/styled.service.ts
index 88f268f..d996169 100644
--- a/libs/ng-styled/src/lib/styled.service.ts
+++ b/libs/ng-styled/src/lib/styled.service.ts
@@ -1,11 +1,11 @@
 import { Injectable } from '@angular/core';
 import { createGenerateId, SheetsRegistry } from 'jss';
-import { StyledOptions, StyledTheme } from './styled.options';
 import { JssContext, JssStore } from './jss/context';
 import { manageSheet } from './jss/managers';
 import { JssManagers, StaticStyles } from './jss/types';
 import getSheetIndex from './jss/utils/get-sheet-index';
 import { createStyleSheet } from './jss/utils/sheets';
+import { StyledOptions, StyledTheme } from './styled.options';
 import normalize from './styles/normalize';
 import { ThemeContext, ThemeStore } from './theme/theme-context';
 import shallowEqualObjects from './utils/shallow-equal-objects';
diff --git a/libs/ng-styled/src/lib/theme/theme-context.ts b/libs/ng-styled/src/lib/theme/theme-context.ts
index d1b7975..f8a542c 100644
--- a/libs/ng-styled/src/lib/theme/theme-context.ts
+++ b/libs/ng-styled/src/lib/theme/theme-context.ts
@@ -1,15 +1,16 @@
 import { Injectable } from '@angular/core';
 import { Store } from '../utils/store';
+import defaultTheme from './default-theme';
 import { Theme } from './types';
 
-export class ThemeContext implements Partial<Theme> {}
+export type ThemeContext = Partial<Theme>;
 
 @Injectable()
 export class ThemeStore extends Store<ThemeContext> {
   private static instance: ThemeStore;
 
   constructor() {
-    super(new ThemeContext());
+    super(defaultTheme);
   }
 
   static getInstance(): ThemeStore {