@ngx-stoui/core 19.0.2 → 20.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ngx-stoui/core",
-  "version": "19.0.2",
+  "version": "20.0.1",
   "author": {
     "name": "Ronnie Laugen",
     "email": "rhenri@equinor.com"
@@ -21,8 +21,8 @@
     "equinor"
   ],
   "peerDependencies": {
-    "@angular/common": "^19.0.0",
-    "@angular/core": "^19.0.0",
+    "@angular/common": "^20.0.0",
+    "@angular/core": "^20.0.0",
     "date-fns": "^3.6.0"
   },
   "dependencies": {

package/style/datatable/ngx-datatable.scss

@@ -15,6 +15,9 @@
       -moz-user-select: none; /* Firefox */
       -ms-user-select: none; /* IE10+/Edge */
       user-select: none; /* Standard */
+      &:has(.mat-mdc-checkbox) {
+        padding: 4px 8px 0 8px;
+      }
 
       .datatable-header-cell-wrapper {
         position: relative;
@@ -41,10 +44,6 @@
           border-right: none;
         }
       }
-      .mat-mdc-checkbox {
-        --mdc-checkbox-state-layer-size: 18px;
-        margin-left: 11px;
-      }
     }
 
     .resize-handle {
@@ -59,11 +58,13 @@
 
     .datatable-body-row {
       .datatable-body-cell {
-        --mdc-checkbox-state-layer-size: 35px;
+        --mat-checkbox-state-layer-size: 35px;
         padding: 8px;
         vertical-align: top;
         border-top: 0;
-        transition: width 0.3s ease, box-shadow 250ms linear;
+        transition:
+          width 0.3s ease,
+          box-shadow 250ms linear;
         &:has(.mat-mdc-form-field),
         &:has(.mat-mdc-checkbox) {
           padding: 0;

package/style/form/sto-form.scss

@@ -13,7 +13,7 @@
   .sto-form {
     &__field {
       input {
-        color: var(--mdc-filled-text-field-label-text-color);
+        color: var(--mat-form-field-filled-label-text-color);
       }
     }
 
@@ -124,7 +124,8 @@ $height: 72px;
   &__field {
     cursor: pointer;
     @extend %sto-form__field;
-    --mdc-filled-text-field-container-color: #{$form-field-bg};
+    --mat-form-field-filled-container-color: #{$form-field-bg};
+    --mat-form-field-state-layer-color: #{$form-field-bg};
 
     &.mat-focused {
       @extend %sto-form__field--focused;
@@ -183,7 +184,7 @@ $height: 72px;
       color: var(--text);
       display: flex;
       .mat-mdc-icon-button {
-        --mdc-icon-button-state-layer-size: 23px;
+        --mat-icon-button-state-layer-size: 23px;
       }
       > span {
         display: inline-block;

package/style/theme/_datatable.scss

@@ -89,7 +89,7 @@
     }
 
     .mat-mdc-checkbox {
-      --mdc-checkbox-state-layer-size: 35px;
+      --mat-checkbox-state-layer-size: 35px;
       display: inline-flex;
     }
     .datatable-header {
@@ -122,7 +122,7 @@
           background-color: $hover-color;
         }
         .mat-mdc-icon-button {
-          --mdc-icon-button-state-layer-size: 28px;
+          --mat-icon-button-state-layer-size: 28px;
         }
       }
     }

package/style/theme/_input-overrides.scss

@@ -12,7 +12,6 @@
 
   .sto-form__field,
   .sto-form__field.mat-mdc-form-field {
-    --mdc-filled-text-field-container-color: #{$form-field-bg};
     .mat-mdc-form-field-flex {
       // background-color: $form-field-bg;
 

package/lib/abstract-and-interfaces/keyPress.enum.d.ts

@@ -1,138 +0,0 @@
-/**
-MIT License
-
-Copyright (c) 2017 Nathan Friend
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-    The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE. **/
-export declare enum Key {
-    Backspace = 8,
-    Tab = 9,
-    Enter = 13,
-    Shift = 16,
-    Ctrl = 17,
-    Alt = 18,
-    PauseBreak = 19,
-    CapsLock = 20,
-    Escape = 27,
-    Space = 32,
-    PageUp = 33,
-    PageDown = 34,
-    End = 35,
-    Home = 36,
-    LeftArrow = 37,
-    UpArrow = 38,
-    RightArrow = 39,
-    DownArrow = 40,
-    Insert = 45,
-    Delete = 46,
-    Zero = 48,
-    ClosedParen = 48,
-    One = 49,
-    ExclamationMark = 49,
-    Two = 50,
-    AtSign = 50,
-    Three = 51,
-    PoundSign = 51,
-    Hash = 51,
-    Four = 52,
-    DollarSign = 52,
-    Five = 53,
-    PercentSign = 53,
-    Six = 54,
-    Caret = 54,
-    Hat = 54,
-    Seven = 55,
-    Ampersand = 55,
-    Eight = 56,
-    Star = 56,
-    Asterik = 56,
-    Nine = 57,
-    OpenParen = 57,
-    A = 65,
-    B = 66,
-    C = 67,
-    D = 68,
-    E = 69,
-    F = 70,
-    G = 71,
-    H = 72,
-    I = 73,
-    J = 74,
-    K = 75,
-    L = 76,
-    M = 77,
-    N = 78,
-    O = 79,
-    P = 80,
-    Q = 81,
-    R = 82,
-    S = 83,
-    T = 84,
-    U = 85,
-    V = 86,
-    W = 87,
-    X = 88,
-    Y = 89,
-    Z = 90,
-    LeftWindowKey = 91,
-    RightWindowKey = 92,
-    SelectKey = 93,
-    Numpad0 = 96,
-    Numpad1 = 97,
-    Numpad2 = 98,
-    Numpad3 = 99,
-    Numpad4 = 100,
-    Numpad5 = 101,
-    Numpad6 = 102,
-    Numpad7 = 103,
-    Numpad8 = 104,
-    Numpad9 = 105,
-    Multiply = 106,
-    Add = 107,
-    Subtract = 109,
-    DecimalPoint = 110,
-    Divide = 111,
-    F1 = 112,
-    F2 = 113,
-    F3 = 114,
-    F4 = 115,
-    F5 = 116,
-    F6 = 117,
-    F7 = 118,
-    F8 = 119,
-    F9 = 120,
-    F10 = 121,
-    F11 = 122,
-    F12 = 123,
-    NumLock = 144,
-    ScrollLock = 145,
-    SemiColon = 186,
-    Equals = 187,
-    Comma = 188,
-    Dash = 189,
-    Period = 190,
-    UnderScore = 189,
-    PlusSign = 187,
-    ForwardSlash = 191,
-    Tilde = 192,
-    GraveAccent = 192,
-    OpenBracket = 219,
-    ClosedBracket = 221,
-    Quote = 222
-}

package/lib/sto-directives/context-menu.directive.d.ts

@@ -1,11 +0,0 @@
-import { MatMenuTrigger } from '@angular/material/menu';
-import { MenuOverlayDirective } from './menu-overlay.directive';
-import * as i0 from "@angular/core";
-export declare class ContextMenuDirective {
-    menuTrigger: MatMenuTrigger;
-    overlayDirective: MenuOverlayDirective;
-    menuContext: unknown;
-    contextMenu(event: MouseEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ContextMenuDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ContextMenuDirective, "[stoContextMenu]", never, { "menuTrigger": { "alias": "menuTrigger"; "required": false; }; "overlayDirective": { "alias": "overlayDirective"; "required": false; }; "menuContext": { "alias": "menuContext"; "required": false; }; }, {}, never, never, true, never>;
-}

package/lib/sto-directives/date-form-field-click.directive.d.ts

@@ -1,20 +0,0 @@
-import { OnDestroy, OnInit, QueryList } from '@angular/core';
-import { MatDatepicker } from '@angular/material/datepicker';
-import { MatInput } from '@angular/material/input';
-import * as i0 from "@angular/core";
-/**
- * Directive that can be placed on mat-form-fields that contains a mat-datepicker.
- * This directive has two tasks:
- * Clicking anywhere on the mat-form-field will open the datepicker dialog
- * When the datepicker is closed in any manner, we shift focus back to the datepicker input
- */
-export declare class DateFormFieldClickDirective implements OnInit, OnDestroy {
-    inputs: QueryList<MatInput>;
-    stoDateFormFieldClick: MatDatepicker<Date>;
-    private destroy$;
-    clickEvent(): void;
-    ngOnInit(): void;
-    ngOnDestroy(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DateFormFieldClickDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DateFormFieldClickDirective, "[stoDateFormFieldClick]", never, { "stoDateFormFieldClick": { "alias": "stoDateFormFieldClick"; "required": false; }; }, {}, ["inputs"], never, true, never>;
-}

package/lib/sto-directives/directives.module.d.ts

@@ -1,12 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./quick-keys.directive";
-import * as i2 from "./date-form-field-click.directive";
-import * as i3 from "./sto-select-text-on-focus.directive";
-import * as i4 from "./sto-grid.directive";
-import * as i5 from "./menu-overlay.directive";
-import * as i6 from "./context-menu.directive";
-export declare class StoDirectivesModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoDirectivesModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<StoDirectivesModule, never, [typeof i1.QuickKeysDirective, typeof i2.DateFormFieldClickDirective, typeof i3.StoSelectTextOnFocusDirective, typeof i4.StoGridDirective, typeof i4.StoGridColumnDirective, typeof i4.StoGridSpacerDirective, typeof i5.MenuOverlayDirective, typeof i6.ContextMenuDirective], [typeof i1.QuickKeysDirective, typeof i2.DateFormFieldClickDirective, typeof i3.StoSelectTextOnFocusDirective, typeof i4.StoGridDirective, typeof i4.StoGridColumnDirective, typeof i4.StoGridSpacerDirective, typeof i5.MenuOverlayDirective, typeof i6.ContextMenuDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<StoDirectivesModule>;
-}

package/lib/sto-directives/index.d.ts

@@ -1,6 +0,0 @@
-export * from './quick-keys.directive';
-export * from './date-form-field-click.directive';
-export * from './sto-select-text-on-focus.directive';
-export * from './sto-grid.directive';
-export * from './menu-overlay.directive';
-export * from './context-menu.directive';

package/lib/sto-directives/menu-overlay.directive.d.ts

@@ -1,12 +0,0 @@
-import * as i0 from "@angular/core";
-export declare class MenuOverlayDirective {
-    private trigger;
-    left: number;
-    top: number;
-    private readonly menu;
-    constructor();
-    updatePosition(event: MouseEvent): void;
-    private setStyle;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MenuOverlayDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<MenuOverlayDirective, "[stoMenuOverlay]", ["stoMenuOverlay"], {}, {}, never, never, true, never>;
-}

package/lib/sto-directives/quick-keys.directive.d.ts

@@ -1,42 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import { UntypedFormGroup } from '@angular/forms';
-import * as i0 from "@angular/core";
-/**
- * QuickKeysDirective is used to implement shortcut keys on DOM elements, e.g to submit or reset a form on enter/escape
- * <form quickKeys (quickSubmit)="save()" (quickCancel)="reset()">
- */
-export declare class QuickKeysDirective {
-    quickKeys: unknown;
-    /**
-     * Optional formGroup input, when used in combination with a reactive form
-     */
-    formGroup: UntypedFormGroup;
-    /**
-     * Emits when ctrl + enter is clicked in combination
-     * <form (quickSubmit)="save()">
-     */
-    quickSubmit: EventEmitter<void>;
-    /**
-     * Emits when escape is clicked
-     * <form (quickCancel)="cancel()">
-     */
-    quickCancel: EventEmitter<void>;
-    /**
-     * Listens on the host element for any keyup events
-     * @param e
-     */
-    onKeyUp(e: KeyboardEvent): void;
-    /**
-     * Handler for generic keydowns, such as cancel events to close drawers
-     * @param e
-     * void
-     */
-    private handleGenericKeydown;
-    /**
-     * Handler for form specific shortcuts, such as saving the form
-     * @param e
-     */
-    private handleFormKeys;
-    static ɵfac: i0.ɵɵFactoryDeclaration<QuickKeysDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<QuickKeysDirective, "[stoQuickKeys]", never, { "quickKeys": { "alias": "quickKeys"; "required": false; }; "formGroup": { "alias": "formGroup"; "required": false; }; }, { "quickSubmit": "quickSubmit"; "quickCancel": "quickCancel"; }, never, never, true, never>;
-}

package/lib/sto-directives/sto-grid.directive.d.ts

@@ -1,31 +0,0 @@
-import { AfterViewInit, ElementRef, OnDestroy, QueryList } from '@angular/core';
-import * as i0 from "@angular/core";
-interface BreakpointConfig {
-    2: number;
-    4: number;
-}
-export declare class StoGridSpacerDirective {
-    useClass: boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoGridSpacerDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<StoGridSpacerDirective, "[stoGridSpacer]", never, {}, {}, never, never, true, never>;
-}
-export declare class StoGridColumnDirective {
-    useClass: boolean;
-    stoGridColumnDouble: boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoGridColumnDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<StoGridColumnDirective, "[stoGridColumn]", never, { "stoGridColumnDouble": { "alias": "stoGridColumnDouble"; "required": false; }; }, {}, never, never, true, never>;
-}
-export declare class StoGridDirective implements AfterViewInit, OnDestroy {
-    private elRef;
-    maxWidth: number;
-    minWidth: number;
-    baseClass: boolean;
-    columns: QueryList<ElementRef<HTMLElement>>;
-    breakpoints: BreakpointConfig;
-    private observer;
-    ngAfterViewInit(): void;
-    ngOnDestroy(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoGridDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<StoGridDirective, "[stoGrid]", ["stoGrid"], { "maxWidth": { "alias": "maxWidth"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "breakpoints": { "alias": "breakpoints"; "required": false; }; }, {}, ["columns"], never, true, never>;
-}
-export {};

package/lib/sto-directives/sto-select-text-on-focus.directive.d.ts

@@ -1,16 +0,0 @@
-import * as i0 from "@angular/core";
-/**
- * stoSelectTextOnFocus listens for input focus events, and selects the contents of the input
- * A user service is established in {@link StoUserPreferenceService} that allows a user to toggle this feature
- */
-export declare class StoSelectTextOnFocusDirective {
-    private elementRef;
-    private _el;
-    constructor();
-    /**
-     * Listens for focus events on the host (input) element, and focuses if applicable
-     */
-    onFocus(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoSelectTextOnFocusDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<StoSelectTextOnFocusDirective, "[stoSelectTextOnFocus]", never, {}, {}, never, never, true, never>;
-}

package/lib/sto-pipes/currency-format.pipe.d.ts

@@ -1,16 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Pipe used to transform numbers to a currency format
- *
- * @example
- *
- * <span>{{ 5000.5824 | currentFormat:'$':3 }}</span>
- * Results in
- * <span>5 000,582 $</span>
- */
-export declare class CurrencyFormatPipe implements PipeTransform {
-    transform(value: number, unit?: string, maximumFractionDigits?: number): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CurrencyFormatPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<CurrencyFormatPipe, "currencyFormat", true>;
-}

package/lib/sto-pipes/date-format.pipe.d.ts

@@ -1,16 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Pipe used to transform dates, based on our default formats.
- *
- * @example
- *
- * public date = "2018-08-27 14:00:30"
- * <span>{{ date | dateFormat }}</span> -> Aug 27, 2018
- * <span>{{ date | dateFormat:'long' }}</span> -> Monday Aug 27, 2018
- */
-export declare class DateFormatPipe implements PipeTransform {
-    transform(value: string | number | Date | null, format?: string): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DateFormatPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<DateFormatPipe, "formatDate", true>;
-}

package/lib/sto-pipes/keys.pipe.d.ts

@@ -1,15 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Transforms an Object to an Array.
- *
- * @example
- *
- * public obj = {a: 1, b: 2, c: 3};
- * <span *ngFor="let key of obj | keys "> {{ obj[key] }}, </span> -> 1, 2, 3,
- */
-export declare class KeysPipe implements PipeTransform {
-    transform(value: Record<string, unknown>): Array<string>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KeysPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<KeysPipe, "keys", true>;
-}

package/lib/sto-pipes/number-format.pipe.d.ts

@@ -1,20 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Formats numbers to use our standard formatting (d ddd,ddd)
- *
- * @example
- *
- * {{ 1234,32 | numberFormat }} -> 1 234,320
- * {{ 1234,32 | numberFormat:'M3' }} -> 1 234,320 M3
- * {{ -1234,32 | numberFormat:'M3':true }} -> 1 234,320 M3
- * {{ 1234,32 | numberFormat:'M3':false:false }} -> 1 234 M3
- * {{ 1234,32 | numberFormat:'M3':false:true:5 }} -> 1 234,32000 M3
- */
-export declare class NumberFormatPipe implements PipeTransform {
-    transform(value: number | string, unit?: string, abs?: boolean, appendDecimals?: boolean, numberOfDecimals?: number): string | null;
-    private prettyPrintValue;
-    private toFixed;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NumberFormatPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<NumberFormatPipe, "numberFormat", true>;
-}

package/lib/sto-pipes/sto-pipes.module.d.ts

@@ -1,12 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./date-format.pipe";
-import * as i2 from "./keys.pipe";
-import * as i3 from "./number-format.pipe";
-import * as i4 from "./currency-format.pipe";
-import * as i5 from "./with-unit";
-import * as i6 from "./yes-no";
-export declare class StoPipesModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<StoPipesModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<StoPipesModule, never, [typeof i1.DateFormatPipe, typeof i2.KeysPipe, typeof i3.NumberFormatPipe, typeof i4.CurrencyFormatPipe, typeof i5.GetUnit, typeof i5.ExcludeUnit, typeof i6.YesNoPipe], [typeof i1.DateFormatPipe, typeof i2.KeysPipe, typeof i3.NumberFormatPipe, typeof i4.CurrencyFormatPipe, typeof i5.GetUnit, typeof i5.ExcludeUnit, typeof i6.YesNoPipe]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<StoPipesModule>;
-}

package/lib/sto-pipes/with-unit.d.ts

@@ -1,12 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class GetUnit implements PipeTransform {
-    transform(value: string, withParens?: boolean): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<GetUnit, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<GetUnit, "getUnit", true>;
-}
-export declare class ExcludeUnit implements PipeTransform {
-    transform(value: string): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ExcludeUnit, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<ExcludeUnit, "excludeUnit", true>;
-}

package/lib/sto-pipes/yes-no.d.ts

@@ -1,7 +0,0 @@
-import { PipeTransform } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class YesNoPipe implements PipeTransform {
-    transform(value: boolean, ignoreNulls?: boolean): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<YesNoPipe, never>;
-    static ɵpipe: i0.ɵɵPipeDeclaration<YesNoPipe, "yesNo", true>;
-}