Merge branch 'dev-starter' into starter

.npmrc

@@ -1 +0,0 @@
-legacy-peer-deps=true

angular.json

@@ -32,7 +32,7 @@
                             "crypto-js/hmac-sha256",
                             "crypto-js/enc-base64",
                             "flat",
-                            "quill"
+                            "quill-delta"
                         ],
                         "assets": [
                             "src/favicon-16x16.png",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "fuse-angular",
-    "version": "19.0.0",
+    "version": "19.1.0",
     "description": "Fuse - Angular Admin Template and Starter Project",
     "author": "https://themeforest.net/user/srcn",
     "license": "https://themeforest.net/licenses/standard",
@@ -13,54 +13,53 @@
         "test": "ng test"
     },
     "dependencies": {
-        "@angular/animations": "17.0.3",
+        "@angular/animations": "17.2.4",
-        "@angular/cdk": "17.0.1",
+        "@angular/cdk": "17.2.2",
-        "@angular/common": "17.0.3",
+        "@angular/common": "17.2.4",
-        "@angular/compiler": "17.0.3",
+        "@angular/compiler": "17.2.4",
-        "@angular/core": "17.0.3",
+        "@angular/core": "17.2.4",
-        "@angular/forms": "17.0.3",
+        "@angular/forms": "17.2.4",
-        "@angular/material": "17.0.1",
+        "@angular/material": "17.2.2",
-        "@angular/material-luxon-adapter": "17.0.1",
+        "@angular/material-luxon-adapter": "17.2.2",
-        "@angular/platform-browser": "17.0.3",
+        "@angular/platform-browser": "17.2.4",
-        "@angular/platform-browser-dynamic": "17.0.3",
+        "@angular/platform-browser-dynamic": "17.2.4",
-        "@angular/router": "17.0.3",
+        "@angular/router": "17.2.4",
-        "@ngneat/transloco": "6.0.0",
+        "@ngneat/transloco": "6.0.4",
-        "apexcharts": "3.44.0",
+        "apexcharts": "3.47.0",
-        "crypto-js": "3.3.0",
+        "crypto-js": "4.2.0",
         "highlight.js": "11.9.0",
         "lodash-es": "4.17.21",
         "luxon": "3.4.4",
-        "ng-apexcharts": "1.8.0",
+        "ng-apexcharts": "1.9.0",
-        "ngx-quill": "24.0.2",
+        "ngx-quill": "25.1.1",
         "perfect-scrollbar": "1.5.5",
-        "quill": "1.3.7",
         "rxjs": "7.8.1",
         "tslib": "2.6.2",
-        "zone.js": "0.14.2"
+        "zone.js": "0.14.4"
     },
     "devDependencies": {
-        "@angular-devkit/build-angular": "17.0.1",
+        "@angular-devkit/build-angular": "17.2.3",
-        "@angular/cli": "17.0.1",
+        "@angular/cli": "17.2.3",
-        "@angular/compiler-cli": "17.0.3",
+        "@angular/compiler-cli": "17.2.4",
         "@tailwindcss/typography": "0.5.10",
-        "@types/chroma-js": "2.4.3",
+        "@types/chroma-js": "2.4.4",
-        "@types/crypto-js": "3.1.47",
+        "@types/crypto-js": "4.2.2",
         "@types/highlight.js": "10.1.0",
-        "@types/jasmine": "5.1.2",
+        "@types/jasmine": "5.1.4",
-        "@types/lodash": "4.14.201",
+        "@types/lodash": "4.14.202",
-        "@types/lodash-es": "4.17.11",
+        "@types/lodash-es": "4.17.12",
-        "@types/luxon": "3.3.4",
+        "@types/luxon": "3.4.2",
-        "autoprefixer": "10.4.16",
+        "autoprefixer": "10.4.18",
         "chroma-js": "2.4.2",
-        "jasmine-core": "5.1.1",
+        "jasmine-core": "5.1.2",
-        "karma": "6.4.2",
+        "karma": "6.4.3",
         "karma-chrome-launcher": "3.2.0",
         "karma-coverage": "2.2.1",
         "karma-jasmine": "5.1.0",
-        "karma-jasmine-html-reporter": "2.0.0",
+        "karma-jasmine-html-reporter": "2.1.0",
         "lodash": "4.17.21",
-        "postcss": "8.4.31",
+        "postcss": "8.4.35",
-        "tailwindcss": "3.3.5",
+        "tailwindcss": "3.4.1",
-        "typescript": "5.2.2"
+        "typescript": "5.3.3"
     }
 }

src/@fuse/components/fullscreen/fullscreen.component.ts

@@ -1,46 +1,27 @@
 import { DOCUMENT, NgTemplateOutlet } from '@angular/common';
-import { ChangeDetectionStrategy, Component, Inject, Input, OnInit, TemplateRef, ViewEncapsulation } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Inject, Input, TemplateRef, ViewEncapsulation } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { FSDocument, FSDocumentElement } from '@fuse/components/fullscreen/fullscreen.types';
 
 @Component({
-    selector       : 'fuse-fullscreen',
+    selector: 'fuse-fullscreen',
-    templateUrl    : './fullscreen.component.html',
+    templateUrl: './fullscreen.component.html',
-    encapsulation  : ViewEncapsulation.None,
+    encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush,
-    exportAs       : 'fuseFullscreen',
+    exportAs: 'fuseFullscreen',
-    standalone     : true,
+    standalone: true,
-    imports        : [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule],
+    imports: [MatButtonModule, MatTooltipModule, NgTemplateOutlet, MatIconModule],
 })
-export class FuseFullscreenComponent implements OnInit
+export class FuseFullscreenComponent
 {
     @Input() iconTpl: TemplateRef<any>;
     @Input() tooltip: string;
-    private _fsDoc: FSDocument;
-    private _fsDocEl: FSDocumentElement;
-    private _isFullscreen: boolean = false;
 
     /**
      * Constructor
      */
-    constructor(@Inject(DOCUMENT) private _document: Document)
+    constructor(@Inject(DOCUMENT) private _document: Document) { }
-    {
-        this._fsDoc = _document as FSDocument;
-    }
-
-    // -----------------------------------------------------------------------------------------------------
-    // @ Lifecycle hooks
-    // -----------------------------------------------------------------------------------------------------
-
-    /**
-     * On init
-     */
-    ngOnInit(): void
-    {
-        this._fsDocEl = document.documentElement as FSDocumentElement;
-    }
 
     // -----------------------------------------------------------------------------------------------------
     // @ Public methods
@@ -51,121 +32,27 @@ export class FuseFullscreenComponent implements OnInit
      */
     toggleFullscreen(): void
     {
-        // Check if the fullscreen is open
+        if (!this._document.fullscreenEnabled)
-        this._isFullscreen = this._getBrowserFullscreenElement() !== null;
+        {
+            console.log('Fullscreen is not available in this browser.');
+            return;
+        }
+
+        // Check if the fullscreen is already open
+        const fullScreen = this._document.fullscreenElement;
 
         // Toggle the fullscreen
-        if ( this._isFullscreen )
+        if (fullScreen)
         {
-            this._closeFullscreen();
+            this._document.exitFullscreen();
         }
         else
         {
-            this._openFullscreen();
+            this._document.documentElement.requestFullscreen()
-        }
+                .catch(() =>
-    }
+                {
-
+                    console.error('Entering fullscreen mode failed.');
-    // -----------------------------------------------------------------------------------------------------
+                });
-    // @ Private methods
-    // -----------------------------------------------------------------------------------------------------
-
-    /**
-     * Get browser's fullscreen element
-     *
-     * @private
-     */
-    private _getBrowserFullscreenElement(): Element
-    {
-        if ( typeof this._fsDoc.fullscreenElement !== 'undefined' )
-        {
-            return this._fsDoc.fullscreenElement;
-        }
-
-        if ( typeof this._fsDoc.mozFullScreenElement !== 'undefined' )
-        {
-            return this._fsDoc.mozFullScreenElement;
-        }
-
-        if ( typeof this._fsDoc.msFullscreenElement !== 'undefined' )
-        {
-            return this._fsDoc.msFullscreenElement;
-        }
-
-        if ( typeof this._fsDoc.webkitFullscreenElement !== 'undefined' )
-        {
-            return this._fsDoc.webkitFullscreenElement;
-        }
-
-        throw new Error('Fullscreen mode is not supported by this browser');
-    }
-
-    /**
-     * Open the fullscreen
-     *
-     * @private
-     */
-    private _openFullscreen(): void
-    {
-        if ( this._fsDocEl.requestFullscreen )
-        {
-            this._fsDocEl.requestFullscreen();
-            return;
-        }
-
-        // Firefox
-        if ( this._fsDocEl.mozRequestFullScreen )
-        {
-            this._fsDocEl.mozRequestFullScreen();
-            return;
-        }
-
-        // Chrome, Safari and Opera
-        if ( this._fsDocEl.webkitRequestFullscreen )
-        {
-            this._fsDocEl.webkitRequestFullscreen();
-            return;
-        }
-
-        // IE/Edge
-        if ( this._fsDocEl.msRequestFullscreen )
-        {
-            this._fsDocEl.msRequestFullscreen();
-            return;
-        }
-    }
-
-    /**
-     * Close the fullscreen
-     *
-     * @private
-     */
-    private _closeFullscreen(): void
-    {
-        if ( this._fsDoc.exitFullscreen )
-        {
-            this._fsDoc.exitFullscreen();
-            return;
-        }
-
-        // Firefox
-        if ( this._fsDoc.mozCancelFullScreen )
-        {
-            this._fsDoc.mozCancelFullScreen();
-            return;
-        }
-
-        // Chrome, Safari and Opera
-        if ( this._fsDoc.webkitExitFullscreen )
-        {
-            this._fsDoc.webkitExitFullscreen();
-            return;
-        }
-
-        // IE/Edge
-        else if ( this._fsDoc.msExitFullscreen )
-        {
-            this._fsDoc.msExitFullscreen();
-            return;
         }
     }
 }

src/@fuse/components/fullscreen/fullscreen.types.ts

@@ -1,16 +0,0 @@
-export interface FSDocument extends HTMLDocument
-{
-    mozFullScreenElement?: Element;
-    mozCancelFullScreen?: () => void;
-    msFullscreenElement?: Element;
-    msExitFullscreen?: () => void;
-    webkitFullscreenElement?: Element;
-    webkitExitFullscreen?: () => void;
-}
-
-export interface FSDocumentElement extends HTMLElement
-{
-    mozRequestFullScreen?: () => void;
-    msRequestFullscreen?: () => void;
-    webkitRequestFullscreen?: () => void;
-}

src/@fuse/components/fullscreen/public-api.ts

@@ -1,2 +1 @@
 export * from '@fuse/components/fullscreen/fullscreen.component';
-export * from '@fuse/components/fullscreen/fullscreen.types';

src/@fuse/styles/tailwind.scss

@@ -121,7 +121,7 @@
     }
 
     /* Set the foreground color for disabled elements */
-    [disabled] * {
+    [disabled] {
         @apply text-disabled #{'!important'};
     }
 

src/@fuse/version/fuse-version.ts

@@ -1,3 +1,3 @@
 import { Version } from '@fuse/version/version';
 
-export const FUSE_VERSION = new Version('19.0.0').full;
+export const FUSE_VERSION = new Version('19.1.0').full;

src/app/layout/common/messages/messages.component.html

@@ -32,6 +32,7 @@
             <div class="text-lg font-medium leading-10">Messages</div>
             <div class="ml-auto">
                 <button
+                    class="dark:text-white"
                     mat-icon-button
                     [disabled]="unreadCount === 0"
                     [matTooltip]="'Mark all as read'"

src/app/layout/common/notifications/notifications.component.html

@@ -32,6 +32,7 @@
             <div class="text-lg font-medium leading-10">Notifications</div>
             <div class="ml-auto">
                 <button
+                    class="dark:text-white"
                     mat-icon-button
                     [matTooltip]="'Mark all as read'"
                     [disabled]="unreadCount === 0"