Fix/workspace imports

.eslintrc.json

@@ -1,13 +1,9 @@
 {
   "root": true,
-  "ignorePatterns": [
-    "projects/**/*"
-  ],
+  "ignorePatterns": ["projects/**/*"],
   "overrides": [
     {
-      "files": [
-        "*.ts"
-      ],
+      "files": ["*.ts"],
       "extends": [
         "eslint:recommended",
         "plugin:prettier/recommended",
@@ -35,24 +31,14 @@
       }
     },
     {
-      "files": [
-        "*.html"
-      ],
-      "extends": [
-        "plugin:@angular-eslint/template/recommended"
-      ],
+      "files": ["*.html"],
+      "extends": ["plugin:@angular-eslint/template/recommended"],
       "rules": {}
     },
     {
-      "files": [
-        "*.html"
-      ],
-      "excludedFiles": [
-        "*inline-template-*.component.html"
-      ],
-      "extends": [
-        "plugin:prettier/recommended"
-      ],
+      "files": ["*.html"],
+      "excludedFiles": ["*inline-template-*.component.html"],
+      "extends": ["plugin:prettier/recommended"],
       "rules": {
         "prettier/prettier": [
           "error",

angular.json

@@ -56,18 +56,11 @@
               "base": "dist/lib-workspace"
             },
             "index": "projects/lib-workspace/src/index.html",
-            "polyfills": [
-              "projects/lib-workspace/src/polyfills.ts"
-            ],
+            "polyfills": ["projects/lib-workspace/src/polyfills.ts"],
             "tsConfig": "projects/lib-workspace/tsconfig.app.json",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "projects/lib-workspace/src/favicon.ico",
-              "projects/lib-workspace/src/assets"
-            ],
-            "styles": [
-              "projects/lib-workspace/src/styles.scss"
-            ],
+            "assets": ["projects/lib-workspace/src/favicon.ico", "projects/lib-workspace/src/assets"],
+            "styles": ["projects/lib-workspace/src/styles.scss"],
             "scripts": [],
             "browser": "projects/lib-workspace/src/main.ts"
           },
@@ -128,14 +121,8 @@
             "tsConfig": "projects/lib-workspace/tsconfig.spec.json",
             "karmaConfig": "projects/lib-workspace/karma.conf.js",
             "inlineStyleLanguage": "scss",
-            "assets": [
-              "projects/lib-workspace/src/favicon.ico",
-              "projects/lib-workspace/src/assets"
-            ],
-            "styles": [
-              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
-              "projects/lib-workspace/src/styles.scss"
-            ],
+            "assets": ["projects/lib-workspace/src/favicon.ico", "projects/lib-workspace/src/assets"],
+            "styles": ["./node_modules/@angular/material/prebuilt-themes/indigo-pink.css", "projects/lib-workspace/src/styles.scss"],
             "scripts": []
           }
         }

package.json

@@ -16,6 +16,7 @@
     "watch": "ng build --watch --configuration development",
     "test": "ng test",
     "format": "prettier --write .",
+    "fix": "yarn-audit-fix",
     "lint": "ng lint"
   },
   "private": false,
@@ -65,6 +66,7 @@
     "prettier-eslint": "^16.4.2",
     "sass": "^1.89.2",
     "typescript": "~5.8.3",
-    "vite": "^6.0.0"
+    "vite": "^6.0.0",
+    "yarn-audit-fix": "^10.1.1"
   }
 }

projects/lib-workspace/src/app/app.config.ts

@@ -9,8 +9,8 @@ import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
 import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar';
 import { MAT_BUTTON_CONFIG } from '@angular/material/button';
 import * as dateFnsLocales from 'date-fns/locale';
-import { FsCalendarService } from 'ngx-mat-components';
 import { APP_BASE_HREF } from '@angular/common';
+import { FsCalendarService } from 'projects/ngx-mat-components/src/public-api';
 
 const locales: any = dateFnsLocales;
 

projects/lib-workspace/src/app/content/showcase-calendar-table/showcase-calendar-table.component.html

@@ -10,9 +10,6 @@
   </mat-card-content>
 </mat-card>
 
-<fs-calendar-table
-  [(month)]="month"
-  [(year)]="year"
-  [dataSource]="calTableData">
+<fs-calendar-table [(month)]="month" [(year)]="year" [dataSource]="calTableData">
   <fs-calendar-table-name>Persons</fs-calendar-table-name>
 </fs-calendar-table>

projects/lib-workspace/src/app/content/showcase-nav-frame/dialog-content-example-dialog.html

@@ -1,62 +1,71 @@
 <h2 mat-dialog-title>Install Angular</h2>
 <mat-dialog-content class="mat-typography">
   <h3>Develop across all platforms</h3>
-  <p>Learn one way to build applications with Angular and reuse your code and abilities to build
-    apps for any deployment target. For web, mobile web, native mobile and native desktop.</p>
+  <p>
+    Learn one way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native
+    mobile and native desktop.
+  </p>
 
   <h3>Speed &amp; Performance</h3>
-  <p>Achieve the maximum speed possible on the Web Platform today, and take it further, via Web
-    Workers and server-side rendering. Angular puts you in control over scalability. Meet huge
-    data requirements by building data models on RxJS, Immutable.js or another push-model.</p>
+  <p>
+    Achieve the maximum speed possible on the Web Platform today, and take it further, via Web Workers and server-side rendering. Angular puts you in control
+    over scalability. Meet huge data requirements by building data models on RxJS, Immutable.js or another push-model.
+  </p>
 
   <h3>Incredible tooling</h3>
-  <p>Build features quickly with simple, declarative templates. Extend the template language with
-    your own components and use a wide array of existing components. Get immediate Angular-specific
-    help and feedback with nearly every IDE and editor. All this comes together so you can focus
-    on building amazing apps rather than trying to make the code work.</p>
+  <p>
+    Build features quickly with simple, declarative templates. Extend the template language with your own components and use a wide array of existing
+    components. Get immediate Angular-specific help and feedback with nearly every IDE and editor. All this comes together so you can focus on building amazing
+    apps rather than trying to make the code work.
+  </p>
 
   <h3>Loved by millions</h3>
-  <p>From prototype through global deployment, Angular delivers the productivity and scalable
-    infrastructure that supports Google's largest applications.</p>
+  <p>From prototype through global deployment, Angular delivers the productivity and scalable infrastructure that supports Google's largest applications.</p>
 
   <h3>What is Angular?</h3>
 
-  <p>Angular is a platform that makes it easy to build applications with the web. Angular
-    combines declarative templates, dependency injection, end to end tooling, and integrated
-    best practices to solve development challenges. Angular empowers developers to build
-    applications that live on the web, mobile, or the desktop</p>
+  <p>
+    Angular is a platform that makes it easy to build applications with the web. Angular combines declarative templates, dependency injection, end to end
+    tooling, and integrated best practices to solve development challenges. Angular empowers developers to build applications that live on the web, mobile, or
+    the desktop
+  </p>
 
   <h3>Architecture overview</h3>
 
-  <p>Angular is a platform and framework for building client applications in HTML and TypeScript.
-  Angular is itself written in TypeScript. It implements core and optional functionality as a
-  set of TypeScript libraries that you import into your apps.</p>
+  <p>
+    Angular is a platform and framework for building client applications in HTML and TypeScript. Angular is itself written in TypeScript. It implements core and
+    optional functionality as a set of TypeScript libraries that you import into your apps.
+  </p>
 
-  <p>The basic building blocks of an Angular application are NgModules, which provide a compilation
-  context for components. NgModules collect related code into functional sets; an Angular app is
-  defined by a set of NgModules. An app always has at least a root module that enables
-  bootstrapping, and typically has many more feature modules.</p>
+  <p>
+    The basic building blocks of an Angular application are NgModules, which provide a compilation context for components. NgModules collect related code into
+    functional sets; an Angular app is defined by a set of NgModules. An app always has at least a root module that enables bootstrapping, and typically has
+    many more feature modules.
+  </p>
 
-  <p>Components define views, which are sets of screen elements that Angular can choose among and
-  modify according to your program logic and data. Every app has at least a root component.</p>
+  <p>
+    Components define views, which are sets of screen elements that Angular can choose among and modify according to your program logic and data. Every app has
+    at least a root component.
+  </p>
 
-  <p>Components use services, which provide specific functionality not directly related to views.
-  Service providers can be injected into components as dependencies, making your code modular,
-  reusable, and efficient.</p>
+  <p>
+    Components use services, which provide specific functionality not directly related to views. Service providers can be injected into components as
+    dependencies, making your code modular, reusable, and efficient.
+  </p>
 
-  <p>Both components and services are simply classes, with decorators that mark their type and
-  provide metadata that tells Angular how to use them.</p>
+  <p>Both components and services are simply classes, with decorators that mark their type and provide metadata that tells Angular how to use them.</p>
 
-  <p>The metadata for a component class associates it with a template that defines a view. A
-  template combines ordinary HTML with Angular directives and binding markup that allow Angular
-  to modify the HTML before rendering it for display.</p>
+  <p>
+    The metadata for a component class associates it with a template that defines a view. A template combines ordinary HTML with Angular directives and binding
+    markup that allow Angular to modify the HTML before rendering it for display.
+  </p>
 
-  <p>The metadata for a service class provides the information Angular needs to make it available
-  to components through Dependency Injection (DI).</p>
+  <p>The metadata for a service class provides the information Angular needs to make it available to components through Dependency Injection (DI).</p>
 
-  <p>An app's components typically define many views, arranged hierarchically. Angular provides
-  the Router service to help you define navigation paths among views. The router provides
-  sophisticated in-browser navigational capabilities.</p>
+  <p>
+    An app's components typically define many views, arranged hierarchically. Angular provides the Router service to help you define navigation paths among
+    views. The router provides sophisticated in-browser navigational capabilities.
+  </p>
 </mat-dialog-content>
 <mat-dialog-actions align="end">
   <button mat-button mat-dialog-close>Cancel</button>

projects/lib-workspace/src/app/content/showcase-nav-frame/showcase-nav-frame.component.html

@@ -13,4 +13,4 @@
   <p style="position: absolute; top: 200px">&#8592; In the sidenav you can set preregisterd entrys</p>
 </div>
 
-<button mat-raised-button (click)="openDialog()">Open a dialog</button>
+<button mat-raised-button (click)="openDialog()">Open a dialog</button>

projects/lib-workspace/src/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />

projects/ngx-mat-components/_index.scss

@@ -1,7 +1,5 @@
 @use 'sass:color';
 @use 'sass:map';
 
-@forward 'theming' show component-themes,
-core,
-normalize;
-@forward './styles/fonts/roboto' show roboto;
+@forward 'theming' show component-themes, core, normalize;
+@forward './styles/fonts/roboto' show roboto;

projects/ngx-mat-components/ng-package.json

@@ -14,4 +14,4 @@
     "./styles/fs-nav-frame/_index.scss",
     "./styles/fs-nav-frame/_theming.scss"
   ]
-}
+}

projects/ngx-mat-components/src/fs-calendar/calendar-panels/calendar-panels.component.scss

@@ -147,4 +147,4 @@
 
 .tooltip .tooltiptext {
   padding: 16px;
-}
+}

projects/ngx-mat-components/src/fs-calendar/calendar-table/fs-calendar-table.component.scss

@@ -52,4 +52,4 @@ table tr td:not(:first-child) {
   font-size: 16px;
   font-weight: bold;
   line-height: 23px;
-}
+}

projects/ngx-mat-components/src/fs-calendar/directives/fs-calendar-table-name.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-calendar-table-name", [fsCalendarTableName"]',
-    host: { class: 'fs-calendar-table-name"' },
-    standalone: false
+  selector: 'fs-calendar-table-name", [fsCalendarTableName"]',
+  host: { class: 'fs-calendar-table-name"' },
+  standalone: false,
 })
 export class FsCalendarTableNameDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/directives/fs-nav-frame-content.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-frame-content, [fsNavFrameContent]',
-    host: { class: 'fs-nav-frame-content' },
-    standalone: false
+  selector: 'fs-nav-frame-content, [fsNavFrameContent]',
+  host: { class: 'fs-nav-frame-content' },
+  standalone: false,
 })
 export class FsNavFrameContentDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/fs-nav-frame.modules.ts

@@ -1,4 +1,4 @@
-import { LucideIconData } from "lucide-angular";
+import { LucideIconData } from 'lucide-angular';
 
 /**
  *  @interface NavFrameConfig

projects/ngx-mat-components/src/fs-nav-frame/fs-nav-user-profile/directives/fs-nav-user-profile-actions.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-user-profile-actions, [fsNavUserProfileActions]',
-    host: { class: 'fs-nav-user-profile-actions' },
-    standalone: false
+  selector: 'fs-nav-user-profile-actions, [fsNavUserProfileActions]',
+  host: { class: 'fs-nav-user-profile-actions' },
+  standalone: false,
 })
 export class FsNavUserProfileActionsDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/fs-nav-user-profile/directives/fs-nav-user-profile-name.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-user-profile-name, [fsNavUserProfileName]',
-    host: { class: 'fs-nav-user-profile-name' },
-    standalone: false
+  selector: 'fs-nav-user-profile-name, [fsNavUserProfileName]',
+  host: { class: 'fs-nav-user-profile-name' },
+  standalone: false,
 })
 export class FsNavUserProfileNameDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/fs-nav-user-profile/directives/fs-nav-user-profile-subname.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-user-profile-subname, [fsNavUserProfileSubName]',
-    host: { class: 'fs-nav-user-profile-subname' },
-    standalone: false
+  selector: 'fs-nav-user-profile-subname, [fsNavUserProfileSubName]',
+  host: { class: 'fs-nav-user-profile-subname' },
+  standalone: false,
 })
 export class FsNavUserProfileSubNameDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/fs-nav-user-profile/fs-nav-user-profile.component.ts

@@ -2,16 +2,16 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output
 import { FsNavFrameService } from '../services/fs-nav-frame.service';
 
 @Component({
-    selector: 'fs-nav-user-profile',
-    templateUrl: './fs-nav-user-profile.component.html',
-    styleUrls: ['./fs-nav-user-profile.component.scss'],
-    encapsulation: ViewEncapsulation.None,
-    changeDetection: ChangeDetectionStrategy.OnPush,
-    host: {
-        class: 'fs-nav-user-profile',
+  selector: 'fs-nav-user-profile',
+  templateUrl: './fs-nav-user-profile.component.html',
+  styleUrls: ['./fs-nav-user-profile.component.scss'],
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  host: {
+    class: 'fs-nav-user-profile',
     'data-component-id': 'fs-nav-user-profile-unique',
-    },
-    standalone: false
+  },
+  standalone: false,
 })
 export class FsNavUserProfileComponent implements OnInit {
   @Output() onClickProfile = new EventEmitter<any>();

projects/ngx-mat-components/src/fs-nav-frame/nav-frame-toolbar/directives/fs-nav-frame-toolbar-center.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-frame-toolbar-center, [fsNavFrameToolbarCenter]',
-    host: { class: 'fs-nav-frame-toolbar-center' },
-    standalone: false
+  selector: 'fs-nav-frame-toolbar-center, [fsNavFrameToolbarCenter]',
+  host: { class: 'fs-nav-frame-toolbar-center' },
+  standalone: false,
 })
 export class FsNavFrameToolbarCenterDirective {
   constructor() {}

projects/ngx-mat-components/src/fs-nav-frame/nav-frame-toolbar/directives/fs-nav-frame-toolbar-end.directive.ts

@@ -1,9 +1,9 @@
 import { Directive } from '@angular/core';
 
 @Directive({
-    selector: 'fs-nav-frame-toolbar-end, [fsNavFrameToolbarEnd]',
-    host: { class: 'fs-nav-frame-toolbar-end' },
-    standalone: false
+  selector: 'fs-nav-frame-toolbar-end, [fsNavFrameToolbarEnd]',
+  host: { class: 'fs-nav-frame-toolbar-end' },
+  standalone: false,
 })
 export class FsNavFrameToolbarEndDirective {
   constructor() {}