diff --git a/src/app/layout/core/app.configurator.ts b/src/app/layout/core/app.configurator.ts
index 1248d5f..ee5f60c 100644
--- a/src/app/layout/core/app.configurator.ts
+++ b/src/app/layout/core/app.configurator.ts
@@ -7,8 +7,20 @@ import Lara from '@primeng/themes/lara';
 import { PrimeNG } from 'primeng/config';
 import { SelectButtonModule } from 'primeng/selectbutton';
 import { LayoutService } from '../service/layout.service';
+import { AuraBaseDesignTokens} from '@primeng/themes/aura/base';
+import { LaraBaseDesignTokens } from '@primeng/themes/lara/base';
+import { NoraBaseDesignTokens } from '@primeng/themes/nora/base';
+import { MaterialBaseDesignTokens } from '@primeng/themes/material/base';
 
-const presets = {
+export interface Preset {
+    Aura: AuraBaseDesignTokens;
+    Lara: LaraBaseDesignTokens;
+    Nora?: NoraBaseDesignTokens;
+    Material?: MaterialBaseDesignTokens
+
+}
+
+const presets: Preset = {
     Aura,
     Lara
 };
@@ -74,7 +86,7 @@ export class AppConfigurator {
 
     platformId = inject(PLATFORM_ID);
 
-    presets = Object.keys(presets);
+    presets: any = Object.keys(presets);
 
     menuModeOptions = [
         { label: 'Static', value: 'static' },
@@ -254,7 +266,7 @@ export class AppConfigurator {
     getPresetExt() {
         const color = this.primaryColors().find((c) => c.name === this.selectedPrimaryColor());
 
-        if (color.name === 'noir') {
+        if (color?.name === 'noir') {
             return {
                 semantic: {
                     primary: {
@@ -306,7 +318,7 @@ export class AppConfigurator {
             if (this.layoutService.layoutConfig().preset === 'Nora') {
                 return {
                     semantic: {
-                        primary: color.palette,
+                        primary: color?.palette,
                         colorScheme: {
                             light: {
                                 primary: {
@@ -342,7 +354,7 @@ export class AppConfigurator {
             } else if (this.layoutService.layoutConfig().preset === 'Material') {
                 return {
                     semantic: {
-                        primary: color.palette,
+                        primary: color?.palette,
                         colorScheme: {
                             light: {
                                 primary: {
@@ -378,7 +390,7 @@ export class AppConfigurator {
             } else {
                 return {
                     semantic: {
-                        primary: color.palette,
+                        primary: color?.palette,
                         colorScheme: {
                             light: {
                                 primary: {
@@ -437,7 +449,7 @@ export class AppConfigurator {
     onPresetChange(event: any) {
         this.layoutService.layoutConfig.update((state) => ({ ...state, preset: event }));
         const preset = presets[event];
-        const surfacePalette = this.surfaces.find((s) => s.name === this.selectedSurfaceColor())?.palette;
+        const surfacePalette = this.surfaces.find((s: any) => s.name === this.selectedSurfaceColor())?.palette;
         if (this.layoutService.layoutConfig().preset === 'Material') {
             document.body.classList.add('material');
             this.config.ripple.set(true);
diff --git a/src/app/layout/core/app.layout.ts b/src/app/layout/core/app.layout.ts
index a4e9288..de6142d 100644
--- a/src/app/layout/core/app.layout.ts
+++ b/src/app/layout/core/app.layout.ts
@@ -61,7 +61,7 @@ export class AppLayout {
         const topbarEl = document.querySelector('.layout-menu-button');
         const eventTarget = event.target as Node;
 
-        return !(sidebarEl.isSameNode(eventTarget) || sidebarEl.contains(eventTarget) || topbarEl.isSameNode(eventTarget) || topbarEl.contains(eventTarget));
+        return !(sidebarEl?.isSameNode(eventTarget) || sidebarEl?.contains(eventTarget) || topbarEl?.isSameNode(eventTarget) || topbarEl?.contains(eventTarget));
     }
 
     hideMenu() {
diff --git a/src/app/layout/core/app.menuitem.ts b/src/app/layout/core/app.menuitem.ts
index e24a57b..f770224 100644
--- a/src/app/layout/core/app.menuitem.ts
+++ b/src/app/layout/core/app.menuitem.ts
@@ -53,7 +53,7 @@ import { LayoutService } from '../service/layout.service';
 })
 export class AppMenuitem {
 
-    @Input() item: MenuItem;
+    @Input() item!: MenuItem;
 
     @Input() index!: number;
 
diff --git a/src/app/layout/service/layout.service.ts b/src/app/layout/service/layout.service.ts
index 26c7fd3..923d052 100644
--- a/src/app/layout/service/layout.service.ts
+++ b/src/app/layout/service/layout.service.ts
@@ -4,7 +4,7 @@ import { Subject } from 'rxjs';
 export interface layoutConfig {
     preset?: string;
     primary?: string;
-    surface?: string;
+    surface?: string | undefined | null;
     darkTheme?: boolean;
     menuMode?: string;
 }
diff --git a/src/app/pages/uikit/inputdemo.ts b/src/app/pages/uikit/inputdemo.ts
index 27e2da1..bf890b8 100644
--- a/src/app/pages/uikit/inputdemo.ts
+++ b/src/app/pages/uikit/inputdemo.ts
@@ -28,6 +28,7 @@ import {TextareaModule} from "primeng/textarea";
 import { ToggleButtonModule } from 'primeng/togglebutton';
 import { CountryService } from '../service/country.service';
 import { NodeService } from '../service/node.service';
+import { TreeNode } from 'primeng/api';
 
 @Component({
     selector: 'app-input-demo',
@@ -311,7 +312,7 @@ export class InputDemo implements OnInit {
 
     inputGroupValue: boolean = false;
 
-    treeSelectNodes: any[] = null;
+    treeSelectNodes!: TreeNode[];
 
     selectedNode: any = null;
 
diff --git a/src/app/pages/uikit/listdemo.ts b/src/app/pages/uikit/listdemo.ts
index 9a9081a..183b706 100644
--- a/src/app/pages/uikit/listdemo.ts
+++ b/src/app/pages/uikit/listdemo.ts
@@ -189,7 +189,7 @@ export class ListDemo {
         ];
     }
 
-    getSeverity(product) {
+    getSeverity(product: Product) {
         switch (product.inventoryStatus) {
             case 'INSTOCK':
                 return 'success';
@@ -201,7 +201,7 @@ export class ListDemo {
                 return 'danger';
 
             default:
-                return null;
+                return 'info';
         }
     }
 }
diff --git a/src/app/pages/uikit/messagesdemo.ts b/src/app/pages/uikit/messagesdemo.ts
index 96d13a0..3a1a784 100644
--- a/src/app/pages/uikit/messagesdemo.ts
+++ b/src/app/pages/uikit/messagesdemo.ts
@@ -1,6 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { Component } from '@angular/core';
-import {MessageService } from 'primeng/api';
+import { MessageService, ToastMessageOptions } from 'primeng/api';
 import { ButtonModule } from 'primeng/button';
 import { InputTextModule } from 'primeng/inputtext';
 import { ToastModule } from 'primeng/toast';
@@ -53,7 +53,7 @@ import { FormsModule } from '@angular/forms';
 })
 export class MessagesDemo {
 
-    msgs = [];
+    msgs: ToastMessageOptions[] | null = [];
 
     username: string | undefined
 
diff --git a/src/app/pages/uikit/overlaydemo.ts b/src/app/pages/uikit/overlaydemo.ts
index e6e3a14..7156449 100644
--- a/src/app/pages/uikit/overlaydemo.ts
+++ b/src/app/pages/uikit/overlaydemo.ts
@@ -215,7 +215,7 @@ export class OverlayDemo implements OnInit {
         op.toggle(event);
     }
 
-    onProductSelect(op, event: any) {
+    onProductSelect(op: Popover, event: any) {
         op.hide();
         this.messageService.add({ severity: 'info', summary: 'Product Selected', detail: event?.data.name, life: 3000 });
     }
diff --git a/tsconfig.json b/tsconfig.json
index 235f40e..5985f6c 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -4,7 +4,7 @@
   "compileOnSave": false,
   "compilerOptions": {
     "outDir": "./dist/out-tsc",
-    "strict": false,
+    "strict": true,
     "noImplicitOverride": true,
     "noPropertyAccessFromIndexSignature": true,
     "noImplicitReturns": true,