@nettyapps/ntyux 21.0.24 → 21.0.26

package/themes/redtheme.css

@@ -4,20 +4,9 @@
   color-scheme: light;
 
   /* Required field */
-  --mat-sys-required: light-dark(
-    var(--mat-sys-secondary-container),
-    var(--mat-sys-inverse-primary)
-  );
-
-  --mat-nty-save-record-header-bar: light-dark(
-    var(--mat-sys-secondary-container),
-    var(--mat-sys-primary)
-  );
-
-  --mat-nty-save-record-identifier: light-dark(
-    var(--mat-sys-on-primary-container),
-    var(--mat-sys-on-primary)
-  );
+  --mat-sys-required: var(--mat-sys-secondary-container);
+  --mat-nty-save-record-header-bar: var(--mat-sys-secondary-container);
+  --mat-nty-save-record-identifier: var(--mat-sys-on-primary-container);
 
   /* Alert */
   --mat-sys-netty-success: #00f0a0;
@@ -30,81 +19,82 @@
   --mat-sys-netty-on-warning-container: #ffb800;
 
   /* Primary palette variables */
-  --mat-sys-primary: light-dark(#b90c55, #ffb1c2);
-  --mat-sys-on-primary: light-dark(#ffffff, #66002b);
-  --mat-sys-primary-container: light-dark(#ffd9df, #8f003f);
-  --mat-sys-on-primary-container: light-dark(#3f0018, #ffd9df);
-  --mat-sys-inverse-primary: light-dark(#ffb1c2, #b90c55);
-  --mat-sys-primary-fixed: light-dark(#ffd9df, #ffd9df);
-  --mat-sys-primary-fixed-dim: light-dark(#ffb1c2, #ffb1c2);
-  --mat-sys-on-primary-fixed: light-dark(#3f0018, #3f0018);
-  --mat-sys-on-primary-fixed-variant: light-dark(#8f003f, #8f003f);
+  --mat-sys-primary: #b90c55;
+  --mat-sys-on-primary: #ffffff;
+  --mat-sys-primary-container: #ffd9df;
+  --mat-sys-on-primary-container: #3f0018;
+  --mat-sys-inverse-primary: #ffb1c2;
+  --mat-sys-primary-fixed: #ffd9df;
+  --mat-sys-primary-fixed-dim: #ffb1c2;
+  --mat-sys-on-primary-fixed: #3f0018;
+  --mat-sys-on-primary-fixed-variant: #8f003f;
 
   /* Secondary palette variables */
-  --mat-sys-secondary: light-dark(#9c3e59, #ffb1c2);
-  --mat-sys-on-secondary: light-dark(#ffffff, #600e2c);
-  --mat-sys-secondary-container: light-dark(#ffd9df, #7e2642);
-  --mat-sys-on-secondary-container: light-dark(#3f0018, #ffd9df);
-  --mat-sys-secondary-fixed: light-dark(#ffd9df, #ffd9df);
-  --mat-sys-secondary-fixed-dim: light-dark(#ffb1c2, #ffb1c2);
-  --mat-sys-on-secondary-fixed: light-dark(#3f0018, #3f0018);
-  --mat-sys-on-secondary-fixed-variant: light-dark(#7e2642, #7e2642);
+  --mat-sys-secondary: #9c3e59;
+  --mat-sys-on-secondary: #ffffff;
+  --mat-sys-secondary-container: #ffd9df;
+  --mat-sys-on-secondary-container: #3f0018;
+  --mat-sys-secondary-fixed: #ffd9df;
+  --mat-sys-secondary-fixed-dim: #ffb1c2;
+  --mat-sys-on-secondary-fixed: #3f0018;
+  --mat-sys-on-secondary-fixed-variant: #7e2642;
 
   /* Tertiary palette variables */
-  --mat-sys-tertiary: light-dark(#aa3700, #ffb59b);
-  --mat-sys-on-tertiary: light-dark(#ffffff, #5c1a00);
-  --mat-sys-tertiary-container: light-dark(#ffdbcf, #822800);
-  --mat-sys-on-tertiary-container: light-dark(#380d00, #ffdbcf);
-  --mat-sys-tertiary-fixed: light-dark(#ffdbcf, #ffdbcf);
-  --mat-sys-tertiary-fixed-dim: light-dark(#ffb59b, #ffb59b);
-  --mat-sys-on-tertiary-fixed: light-dark(#380d00, #380d00);
-  --mat-sys-on-tertiary-fixed-variant: light-dark(#822800, #822800);
+  --mat-sys-tertiary: #aa3700;
+  --mat-sys-on-tertiary: #ffffff;
+  --mat-sys-tertiary-container: #ffdbcf;
+  --mat-sys-on-tertiary-container: #380d00;
+  --mat-sys-tertiary-fixed: #ffdbcf;
+  --mat-sys-tertiary-fixed-dim: #ffb59b;
+  --mat-sys-on-tertiary-fixed: #380d00;
+  --mat-sys-on-tertiary-fixed-variant: #822800;
 
   /* Neutral palette variables */
-  --mat-sys-background: light-dark(#fff8f7, #1d1012);
-  --mat-sys-on-background: light-dark(#26181b, #f7dce0);
-  --mat-sys-surface: light-dark(#fff8f7, #1d1012);
-  --mat-sys-surface-dim: light-dark(#eed4d7, #1d1012);
-  --mat-sys-surface-bright: light-dark(#fff8f7, #463538);
-  --mat-sys-surface-container-lowest: light-dark(#ffffff, #170a0d);
-  --mat-sys-surface-container: light-dark(#ffe8eb, #2b1c1f);
-  --mat-sys-surface-container-high: light-dark(#fde2e5, #362629);
-  --mat-sys-surface-container-highest: light-dark(#f7dce0, #413034);
-  --mat-sys-on-surface: light-dark(#26181b, #f7dce0);
-  --mat-sys-shadow: light-dark(#000000, #000000);
-  --mat-sys-scrim: light-dark(#000000, #000000);
-  --mat-sys-surface-tint: light-dark(#b90c55, #ffb1c2);
-  --mat-sys-inverse-surface: light-dark(#3d2c2f, #f7dce0);
-  --mat-sys-inverse-on-surface: light-dark(#ffecee, #3d2c2f);
-  --mat-sys-outline: light-dark(#8d6f75, #a8898e);
-  --mat-sys-outline-variant: light-dark(#e1bec4, #594045);
-  --mat-sys-neutral10: light-dark(
-    #26181b,
-    #26181b
-  ); /* Variable used for the form field native select option text color */
+  --mat-sys-background: #fff8f7;
+  --mat-sys-on-background: #26181b;
+  --mat-sys-surface: #fff8f7;
+  --mat-sys-surface-dim: #eed4d7;
+  --mat-sys-surface-bright: #fff8f7;
+  --mat-sys-surface-container-lowest: #ffffff;
+  --mat-sys-surface-container: #ffe8eb;
+  --mat-sys-surface-container-high: #fde2e5;
+  --mat-sys-surface-container-highest: #f7dce0;
+  --mat-sys-on-surface: #26181b;
+  --mat-sys-shadow: #000000;
+  --mat-sys-scrim: #000000;
+  --mat-sys-surface-tint: #b90c55;
+  --mat-sys-inverse-surface: #3d2c2f;
+  --mat-sys-inverse-on-surface: #ffecee;
+  --mat-sys-outline: #8d6f75;
+  --mat-sys-outline-variant: #e1bec4;
+  --mat-sys-neutral10: #26181b;
+  /* Variable used for the form field native select option text color */
 
   /* Error palette variables */
-  --mat-sys-error: light-dark(#ba1a1a, #ffb4ab);
-  --mat-sys-on-error: light-dark(#ffffff, #690005);
-  --mat-sys-error-container: light-dark(#ffdad6, #93000a);
-  --mat-sys-on-error-container: light-dark(#410002, #ffdad6);
+  --mat-sys-error: #ba1a1a;
+  --mat-sys-on-error: #ffffff;
+  --mat-sys-error-container: #ffdad6;
+  --mat-sys-on-error-container: #410002;
 
   /* Neutral variant palette variables */
-  --mat-sys-surface-variant: light-dark(#fed9df, #594045);
-  --mat-sys-on-surface-variant: light-dark(#594045, #e1bec4);
-  --mat-sys-neutral-variant20: light-dark(
-    #412a2f,
-    #412a2f
-  ); /* Variable used for the sidenav scrim (container background shadow when opened) */
+  --mat-sys-surface-variant: #fed9df;
+  --mat-sys-on-surface-variant: #594045;
+  --mat-sys-neutral-variant20: #412a2f;
+  /* Variable used for the sidenav scrim (container background shadow when opened) */
 
   /* TYPOGRAPHY SYSTEM VARIABLES */
 
   /* Typography variables. Only used in the different typescale system variables. */
-  --mat-sys-brand-font-family: Roboto; /* The font-family to use for brand text. */
-  --mat-sys-plain-font-family: Roboto; /* The font-family to use for plain text. */
-  --mat-sys-bold-font-weight: 700; /* The font-weight to use for bold text. */
-  --mat-sys-medium-font-weight: 500; /* The font-weight to use for medium text. */
-  --mat-sys-regular-font-weight: 400; /* The font-weight to use for regular text. */
+  --mat-sys-brand-font-family: Roboto;
+  /* The font-family to use for brand text. */
+  --mat-sys-plain-font-family: Roboto;
+  /* The font-family to use for plain text. */
+  --mat-sys-bold-font-weight: 700;
+  /* The font-weight to use for bold text. */
+  --mat-sys-medium-font-weight: 500;
+  /* The font-weight to use for medium text. */
+  --mat-sys-regular-font-weight: 400;
+  /* The font-weight to use for regular text. */
 
   /* Typescale variables. */
   /* Warning: Risk of reduced fidelity from using the composite typography tokens (ex. --mat-sys-body-large) since

package/themes/themes.css

@@ -5,3 +5,4 @@
 @import "./redtheme.css";
 @import "./blueorangetheme.css";
 @import "./graytheme.css";
+@import "./nettytheme.css";

package/types/nettyapps-ntyux.d.ts

@@ -241,15 +241,12 @@ interface AppTheme {
     icon: string;
 }
 declare class Theme {
-    private readonly THEME_STORAGE_KEY;
     private appTheme;
     private themes;
     selectedTheme: _angular_core.Signal<AppTheme | undefined>;
-    constructor();
     getThemes(): AppTheme[];
     setTheme(theme: 'light' | 'dark'): void;
-    private getSavedTheme;
-    private saveTheme;
+    constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Theme, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<Theme>;
 }
@@ -259,14 +256,17 @@ interface ColorTheme {
     primary: string;
     secondary?: string;
     displayName: string;
+    type: 'light' | 'dark';
 }
 declare class ColorPalette {
     private readonly THEME_STORAGE_KEY;
     private themes;
+    private themeService;
     currentTheme: _angular_core.WritableSignal<ColorTheme | null>;
     setThemes(customThemes: ColorTheme[]): void;
-    getThemes(): ColorTheme[];
     setTheme(themeId: string): void;
+    getThemes(): ColorTheme[];
+    getCurrentTheme(): ColorTheme | null;
     private getSavedTheme;
     private saveTheme;
     updateThemeClass: _angular_core.EffectRef;
@@ -363,17 +363,18 @@ declare class NtyResizableDirective implements OnInit, OnDestroy {
 }
 
 declare class NtyUXSaveLayout {
-    title: string;
-    identifier: string;
-    viewMode: string;
-    saveDisabled: boolean;
-    showClose: boolean;
-    save: EventEmitter<void>;
-    cancel: EventEmitter<void>;
+    title: _angular_core.InputSignal<string>;
+    identifier: _angular_core.InputSignal<string>;
+    viewMode: _angular_core.InputSignal<string>;
+    saveDisabled: _angular_core.InputSignal<boolean>;
+    showClose: _angular_core.InputSignal<boolean>;
+    showSave: _angular_core.InputSignal<boolean>;
+    save: _angular_core.OutputEmitterRef<void>;
+    cancel: _angular_core.OutputEmitterRef<void>;
     onSave(): void;
     onCancel(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NtyUXSaveLayout, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NtyUXSaveLayout, "ntyux-save-layout", never, { "title": { "alias": "title"; "required": false; }; "identifier": { "alias": "identifier"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "saveDisabled": { "alias": "saveDisabled"; "required": false; }; "showClose": { "alias": "showClose"; "required": false; }; }, { "save": "save"; "cancel": "cancel"; }, never, ["[additional-menu-item]", "*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NtyUXSaveLayout, "ntyux-save-layout", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "identifier": { "alias": "identifier"; "required": false; "isSignal": true; }; "viewMode": { "alias": "viewMode"; "required": false; "isSignal": true; }; "saveDisabled": { "alias": "saveDisabled"; "required": false; "isSignal": true; }; "showClose": { "alias": "showClose"; "required": false; "isSignal": true; }; "showSave": { "alias": "showSave"; "required": false; "isSignal": true; }; }, { "save": "save"; "cancel": "cancel"; }, never, ["[additional-menu-item]", "*"], true, never>;
 }
 
 export { AutoComplete, ColorPalette, Guid, HttpError403, HttpError404, LeftSidenav, NettyFilter, NettyUXFilterCard, NtyAutoCompleteFilter, NtyAutoCompleteFilterFields, NtyResizableDirective, NtySidenavResizableDirective, NtyUXLayout, NtyUXSaveLayout, Ntyux, NtyuxModule, SelectionItem, Theme, Toolbar, ValueUnitInput };