@ptsecurity/mosaic 15.5.0 → 15.7.2

package/file-upload/_file-upload-theme.scss

@@ -3,10 +3,6 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-file-upload-text-color($states) {
     &, .mc-icon, .mc-link {
         color: map.get($states, border);
@@ -127,6 +123,8 @@ $tokens: meta.module-variables(tokens) !default;
 
 
 @mixin mc-file-upload-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-single-file-upload {
         @include mc-typography-level-to-styles($config, map.get($tokens, file-upload-font-single));
     }

package/file-upload/multiple-file-upload.component.d.ts

@@ -1,5 +1,5 @@
 import { FocusMonitor } from '@angular/cdk/a11y';
-import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, TemplateRef } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, Renderer2, TemplateRef } from '@angular/core';
 import { CanDisable } from '@ptsecurity/mosaic/core';
 import { McFileItem, McFileValidatorFn, McInputFile, McInputFileLabel } from './file-upload';
 import * as i0 from "@angular/core";
@@ -16,6 +16,7 @@ export declare const MC_MULTIPLE_FILE_UPLOAD_DEFAULT_CONFIGURATION: McInputFileM
 export declare class McMultipleFileUploadComponent implements AfterViewInit, OnDestroy, McInputFile, CanDisable {
     private focusMonitor;
     private cdr;
+    private renderer;
     config: McInputFileMultipleLabel;
     accept?: string[];
     disabled: boolean;
@@ -35,7 +36,7 @@ export declare class McMultipleFileUploadComponent implements AfterViewInit, OnD
     private focusMonitorSubscription;
     get acceptedFiles(): string;
     get hasErrors(): boolean;
-    constructor(focusMonitor: FocusMonitor, cdr: ChangeDetectorRef, config: McInputFileMultipleLabel);
+    constructor(focusMonitor: FocusMonitor, cdr: ChangeDetectorRef, renderer: Renderer2, config: McInputFileMultipleLabel);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     onFileSelectedViaClick({ target }: Event): void;
@@ -46,6 +47,6 @@ export declare class McMultipleFileUploadComponent implements AfterViewInit, OnD
     private mapToFileItem;
     private validateFile;
     private isCorrectExtension;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McMultipleFileUploadComponent, [null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McMultipleFileUploadComponent, [null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<McMultipleFileUploadComponent, "mc-multiple-file-upload", never, { "accept": "accept"; "disabled": "disabled"; "errors": "errors"; "files": "files"; "size": "size"; "inputId": "inputId"; "customValidation": "customValidation"; }, { "fileQueueChanged": "fileQueueChanged"; }, ["customFileIcon"], ["[hint]"], false, never>;
 }

package/file-upload/single-file-upload.component.d.ts

@@ -1,5 +1,5 @@
 import { FocusMonitor } from '@angular/cdk/a11y';
-import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, Renderer2 } from '@angular/core';
 import { CanDisable } from '@ptsecurity/mosaic/core';
 import { McFileItem, McFileValidatorFn, McInputFile, McInputFileLabel } from './file-upload';
 import * as i0 from "@angular/core";
@@ -7,6 +7,7 @@ export declare const MC_SINGLE_FILE_UPLOAD_DEFAULT_CONFIGURATION: McInputFileLab
 export declare class McSingleFileUploadComponent implements AfterViewInit, OnDestroy, McInputFile, CanDisable {
     private focusMonitor;
     private cdr;
+    private renderer;
     config: McInputFileLabel;
     accept: string[];
     disabled: boolean;
@@ -19,7 +20,7 @@ export declare class McSingleFileUploadComponent implements AfterViewInit, OnDes
     hasFocus: boolean;
     private focusMonitorSubscription;
     get acceptedFiles(): string;
-    constructor(focusMonitor: FocusMonitor, cdr: ChangeDetectorRef, config: McInputFileLabel);
+    constructor(focusMonitor: FocusMonitor, cdr: ChangeDetectorRef, renderer: Renderer2, config: McInputFileLabel);
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     onFileSelectedViaClick({ target }: Event): void;
@@ -29,6 +30,6 @@ export declare class McSingleFileUploadComponent implements AfterViewInit, OnDes
     private mapToFileItem;
     private validateFile;
     private isCorrectExtension;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McSingleFileUploadComponent, [null, null, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McSingleFileUploadComponent, [null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<McSingleFileUploadComponent, "mc-single-file-upload", never, { "accept": "accept"; "disabled": "disabled"; "errors": "errors"; "files": "files"; "inputId": "inputId"; "customValidation": "customValidation"; }, { "fileQueueChanged": "fileQueueChanged"; }, never, ["[hint]", "[mc-icon]"], false, never>;
 }

package/form-field/_form-field-theme.scss

@@ -4,10 +4,6 @@
 @use '../core/styles/theming/theming' as *;
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
 
 @mixin mc-form-field-theme($theme) {
     $foreground: map.get($theme, foreground);
@@ -97,6 +93,10 @@ $tokens: meta.module-variables(tokens) !default;
             color: mc-color($secondary);
         }
 
+        &.mc-warning {
+            color: map.get($foreground, text-warning);
+        }
+
         &.mc-error {
             color: map.get($foreground, text-error);
         }
@@ -130,11 +130,13 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-form-field-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-form-field {
         @include mc-typography-level-to-styles($config, map.get($tokens, form-field-font-default));
     }
 
-    .mc-form-field__hint {
+    .mc-form-field__hint, .mc-password-hint {
         @include mc-typography-level-to-styles($config, map.get($tokens, form-field-hint-font-default));
     }
 

package/form-field/form-field.d.ts

@@ -40,7 +40,6 @@ export declare class McFormField extends McFormFieldMixinBase implements AfterCo
     canCleanerClearByEsc: boolean;
     private $unsubscribe;
     get hasHint(): boolean;
-    get hasPasswordStrengthError(): boolean;
     get hasSuffix(): boolean;
     get hasPrefix(): boolean;
     get hasCleaner(): boolean;

package/form-field/form-field.scss

@@ -36,7 +36,7 @@ $tokens: meta.module-variables(tokens) !default;
 .mc-hint {
     display: block;
 }
-
+/* test */
 .mc-password-hint {
     display: block;
 
@@ -50,9 +50,7 @@ $tokens: meta.module-variables(tokens) !default;
 
         left: 0;
     }
-}
 
-.mc-form-field__hint > .mc-password-hint {
     margin-top: var(
         --mc-form-field-password-hint-size-margin-top, map.get($tokens, form-field-password-hint-size-margin-top)
     );

package/form-field/password-hint.d.ts

@@ -1,4 +1,5 @@
-import { AfterContentInit, ChangeDetectorRef } from '@angular/core';
+import { AfterContentInit, ChangeDetectorRef, QueryList } from '@angular/core';
+import { McFormField } from './form-field';
 import * as i0 from "@angular/core";
 export declare enum PasswordRules {
     Length = 0,
@@ -14,6 +15,7 @@ export declare const regExpPasswordValidator: {
     3: RegExp;
     4: RegExp;
 };
+export declare const hasPasswordStrengthError: (passwordHints: QueryList<McPasswordHint>) => boolean;
 export declare class McPasswordHint implements AfterContentInit {
     private changeDetectorRef;
     private formField;
@@ -22,6 +24,7 @@ export declare class McPasswordHint implements AfterContentInit {
     min: number;
     max: number;
     regex: RegExp | null;
+    viewFormField?: McFormField;
     hasError: boolean;
     checked: boolean;
     private checkRule;
@@ -34,6 +37,6 @@ export declare class McPasswordHint implements AfterContentInit {
     private checkRegexRule;
     private checkSpecialSymbolsRegexRule;
     private isValueChanged;
-    static ɵfac: i0.ɵɵFactoryDeclaration<McPasswordHint, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McPasswordHint, "mc-password-hint", never, { "id": "id"; "rule": "rule"; "min": "min"; "max": "max"; "regex": "regex"; }, {}, never, ["*"], false, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<McPasswordHint, [null, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McPasswordHint, "mc-password-hint", never, { "id": "id"; "rule": "rule"; "min": "min"; "max": "max"; "regex": "regex"; "viewFormField": "viewFormField"; }, {}, never, ["*"], false, never>;
 }

package/input/_input-theme.scss

@@ -3,11 +3,6 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-input-theme($theme) {
     $foreground: map.get($theme, foreground);
 
@@ -48,12 +43,18 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-input-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-input {
         @include mc-typography-level-to-styles($config, map.get($tokens, input-font-default));
     }
 
     .mc-input.mc-input_monospace,
-    .mc-input.mc-input-password[type="password"] {
+    .mc-input.mc-input-password {
         @include mc-typography-level-to-styles($config, map.get($tokens, input-font-monospace));
     }
+
+    .mc-input.mc-input-password::placeholder {
+        @include mc-typography-level-to-styles($config, map.get($tokens, input-font-default));
+    }
 }

package/link/_link-theme.scss

@@ -3,12 +3,7 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
-@mixin mc-link($foreground, $link) {
+@mixin mc-link($foreground, $link, $tokens) {
     display: inline-block;
 
     color: map.get($link, text);
@@ -133,12 +128,14 @@ $tokens: meta.module-variables(tokens) !default;
 
     $link: map.get(map.get($theme, components), link);
 
+    $tokens: map.get($theme, tokens);
+
     .mc-link:not(.mc-link_use-visited) {
         &:visited {
             color: map.get($link, text);
         }
 
-        @include mc-link($foreground, $link);
+        @include mc-link($foreground, $link, $tokens);
     }
 
     .mc-link.mc-link_use-visited {
@@ -155,7 +152,7 @@ $tokens: meta.module-variables(tokens) !default;
             }
         }
 
-        @include mc-link($foreground, $link);
+        @include mc-link($foreground, $link, $tokens);
     }
 
     @media print {
@@ -178,6 +175,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-link-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-link {
         @include mc-typography-level-to-styles($config, map.get($tokens, link-font-default));
     }

package/list/_list-theme.scss

@@ -3,11 +3,6 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-list-theme($theme) {
     $foreground: map.get($theme, foreground);
     $background: map.get($theme, background);
@@ -42,6 +37,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-list-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-list-item,
     .mc-list-option {
         @include mc-typography-level-to-styles($config, map.get($tokens, list-font-item));

package/loader-overlay/_loader-overlay-theme.scss

@@ -3,11 +3,6 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-loader-overlay-theme($theme) {
     $loader-overlay: map.get(map.get($theme, components), loader-overlay);
 
@@ -25,6 +20,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-loader-overlay-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-loader-overlay-text {
         @include mc-typography-level-to-styles($config, map.get($tokens, loader-overlay-font-text));
     }

package/loader-overlay/loader-overlay.scss

@@ -2,6 +2,7 @@
 @use 'sass:map';
 
 @use '../core/styles/tokens';
+@use '../core/styles/variables';
 
 
 $tokens: meta.module-variables(tokens) !default;
@@ -23,6 +24,8 @@ $tokens: meta.module-variables(tokens) !default;
     bottom: 0;
     left: 0;
 
+    z-index: variables.$z-index-loader-overlay;
+
     & .mc-loader-overlay__container {
         display: flex;
         flex-direction: column;

package/markdown/_markdown-theme.scss

@@ -1,19 +1,14 @@
-@use 'sass:meta';
 @use 'sass:map';
 
 @use '../core/styles/theming/theming' as *;
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-markdown-theme($theme) {
     $foreground: map.get($theme, foreground);
     $background: map.get($theme, background);
 
     $markdown: map.get(map.get($theme, components), markdown);
+    $tokens: map.get($theme, tokens);
 
     .mc-markdown {
         color: map.get($foreground, text);
@@ -98,6 +93,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-markdown-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-markdown {
         // h1, h2, h3, h4, h5, h6
         @for $i from 1 through 6 {

package/modal/_modal-theme.scss

@@ -3,17 +3,13 @@
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-modal-theme($theme) {
     $foreground: map.get($theme, foreground);
     $background: map.get($theme, background);
 
     $modal: map.get(map.get($theme, components), modal);
     $popup: map.get(map.get($theme, components), popup);
+    $tokens: map.get($theme, tokens);
 
     .mc-modal {
         .mc-modal-content {
@@ -80,6 +76,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-modal-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-modal-title {
         @include mc-typography-level-to-styles($config, map.get($tokens, modal-header-font-default));
     }

package/modal/modal.module.d.ts

@@ -7,8 +7,9 @@ import * as i5 from "@angular/cdk/overlay";
 import * as i6 from "@angular/cdk/a11y";
 import * as i7 from "@ptsecurity/mosaic/button";
 import * as i8 from "@ptsecurity/mosaic/icon";
+import * as i9 from "@ptsecurity/mosaic/title";
 export declare class McModalModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<McModalModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<McModalModule, [typeof i1.McModalComponent, typeof i2.McModalTitle, typeof i2.McModalBody, typeof i2.McModalFooter, typeof i3.CssUnitPipe, typeof i2.McModalMainAction], [typeof i4.CommonModule, typeof i5.OverlayModule, typeof i6.A11yModule, typeof i7.McButtonModule, typeof i8.McIconModule], [typeof i1.McModalComponent, typeof i2.McModalTitle, typeof i2.McModalBody, typeof i2.McModalFooter, typeof i2.McModalMainAction]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<McModalModule, [typeof i1.McModalComponent, typeof i2.McModalTitle, typeof i2.McModalBody, typeof i2.McModalFooter, typeof i3.CssUnitPipe, typeof i2.McModalMainAction], [typeof i4.CommonModule, typeof i5.OverlayModule, typeof i6.A11yModule, typeof i7.McButtonModule, typeof i8.McIconModule, typeof i9.McTitleModule], [typeof i1.McModalComponent, typeof i2.McModalTitle, typeof i2.McModalBody, typeof i2.McModalFooter, typeof i2.McModalMainAction]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<McModalModule>;
 }

package/modal/modal.scss

@@ -70,7 +70,13 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 .mc-modal-title {
-    margin: 0;
+    margin-top: map.get($tokens, size-s);
+    margin-bottom: map.get($tokens, size-s);
+
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
 }
 
 .mc-modal-content {
@@ -86,11 +92,17 @@ $tokens: meta.module-variables(tokens) !default;
     display: flex;
     align-items: center;
 
-    height: var(--mc-modal-header-size-height, map.get($tokens, modal-header-size-height));
+    min-height: var(--mc-modal-header-size-height, map.get($tokens, modal-header-size-height));
 
     border-radius: var(--mc-modal-header-size-border-radius, map.get($tokens, modal-header-size-border-radius));
 
     padding: var(--mc-modal-header-size-padding, map.get($tokens, modal-header-size-padding));
+
+    &.mc-modal-header_closable {
+        $size-s: map.get($tokens, size-s);
+
+        padding-right: calc(var(--mc-modal-size-close-width, map.get($tokens, modal-size-close-width)) + $size-s);
+    }
 }
 
 .mc-modal-body {

package/navbar/_navbar-theme.scss

@@ -1,13 +1,7 @@
-@use 'sass:meta';
 @use 'sass:map';
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-navbar-theme($theme) {
     $background: map.get($theme, background);
     $primary: map.get($theme, primary);
@@ -103,6 +97,8 @@ button {
 }
 
 @mixin mc-navbar-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-navbar-title {
         @include mc-typography-level-to-styles($config, map.get($tokens, navbar-font-title));
     }

package/navbar/navbar-item.component.d.ts

@@ -124,9 +124,9 @@ export declare class McNavbarItem extends McTooltipTrigger {
     collapsedText: string;
     get trigger(): string;
     set trigger(value: string);
-    get collapsed(): boolean;
     set collapsed(value: boolean);
     private _collapsed;
+    isCollapsed: boolean;
     get croppedText(): string;
     get collapsable(): boolean;
     set collapsable(value: boolean);
@@ -144,8 +144,9 @@ export declare class McNavbarItem extends McTooltipTrigger {
     updateTooltip(): void;
     getTitleWidth(): number;
     onKeyDown($event: KeyboardEvent): void;
+    private updateCollapsedState;
     static ɵfac: i0.ɵɵFactoryDeclaration<McNavbarItem, [null, null, null, null, null, null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarItem, "mc-navbar-item, [mc-navbar-item]", ["mcNavbarItem"], { "collapsedText": "collapsedText"; "trigger": "mcTrigger"; "collapsed": "collapsed"; "collapsable": "collapsable"; }, {}, ["title", "subTitle", "icon"], ["[mc-icon]", "mc-navbar-title, [mc-navbar-title]", "mc-navbar-subtitle, [mc-navbar-subtitle]", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<McNavbarItem, "mc-navbar-item, [mc-navbar-item]", ["mcNavbarItem"], { "collapsedText": "collapsedText"; "trigger": "mcTrigger"; "collapsable": "collapsable"; }, {}, ["title", "subTitle", "icon"], ["[mc-icon]", "mc-navbar-title, [mc-navbar-title]", "mc-navbar-subtitle, [mc-navbar-subtitle]", "*"], false, never>;
 }
 export declare class McNavbarToggle extends McTooltipTrigger implements OnDestroy {
     navbar: McVerticalNavbar;

package/navbar/navbar.component.d.ts

@@ -1,3 +1,4 @@
+import { FocusMonitor } from '@angular/cdk/a11y';
 import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ElementRef, OnDestroy, QueryList } from '@angular/core';
 import { FocusKeyManager } from '@ptsecurity/cdk/a11y';
 import { Observable, Subject } from 'rxjs';
@@ -6,6 +7,7 @@ import * as i0 from "@angular/core";
 export declare type McNavbarContainerPositionType = 'left' | 'right';
 export declare class McFocusableComponent implements AfterContentInit, OnDestroy {
     protected changeDetectorRef: ChangeDetectorRef;
+    private focusMonitor;
     focusableItems: QueryList<McNavbarFocusableItem>;
     keyManager: FocusKeyManager<McNavbarFocusableItem>;
     get tabIndex(): any;
@@ -16,7 +18,8 @@ export declare class McFocusableComponent implements AfterContentInit, OnDestroy
     protected readonly destroyed: Subject<void>;
     private optionFocusSubscription;
     private optionBlurSubscription;
-    constructor(changeDetectorRef: ChangeDetectorRef);
+    private focusMonitorSubscription;
+    constructor(changeDetectorRef: ChangeDetectorRef, elementRef: ElementRef, focusMonitor: FocusMonitor);
     ngAfterContentInit(): void;
     ngOnDestroy(): void;
     focus(): void;
@@ -44,7 +47,7 @@ export declare class McNavbar extends McFocusableComponent implements AfterViewI
     private get totalItemsWidth();
     private get collapsableItems();
     private resizeSubscription;
-    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef);
+    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, focusMonitor: FocusMonitor);
     ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;

package/navbar/vertical-navbar.component.d.ts

@@ -1,9 +1,11 @@
-import { AfterContentInit, ChangeDetectorRef, QueryList } from '@angular/core';
+import { FocusMonitor } from '@angular/cdk/a11y';
+import { AfterContentInit, ChangeDetectorRef, ElementRef, QueryList } from '@angular/core';
 import { Subject } from 'rxjs';
 import { McNavbarBento, McNavbarItem, McNavbarRectangleElement } from './navbar-item.component';
 import { McFocusableComponent } from './navbar.component';
 import * as i0 from "@angular/core";
 export declare class McVerticalNavbar extends McFocusableComponent implements AfterContentInit {
+    protected elementRef: ElementRef;
     rectangleElements: QueryList<McNavbarRectangleElement>;
     items: QueryList<McNavbarItem>;
     bento: McNavbarBento;
@@ -11,7 +13,7 @@ export declare class McVerticalNavbar extends McFocusableComponent implements Af
     get expanded(): boolean;
     set expanded(value: boolean);
     private _expanded;
-    constructor(changeDetectorRef: ChangeDetectorRef);
+    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, focusMonitor: FocusMonitor);
     ngAfterContentInit(): void;
     toggle(): void;
     onKeyDown(event: KeyboardEvent): void;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ptsecurity/mosaic",
-    "version": "15.5.0",
+    "version": "15.7.2",
     "description": "Mosaic",
     "repository": {
         "type": "git",
@@ -17,19 +17,16 @@
     },
     "homepage": "https://gitlab.ptsecurity.com/frontend/design-system/mosaic/-/blob/master/README.md",
     "peerDependencies": {
-        "@angular/animations": "^15.2.0",
-        "@angular/cdk": "^15.2.0",
-        "@angular/core": "^15.2.0",
-        "@angular/common": "^15.2.0",
-        "@angular/forms": "^15.2.0",
-        "@ptsecurity/cdk": "^15.5.0",
-        "@ptsecurity/mosaic-moment-adapter": "^1.1.0",
-        "@ptsecurity/mosaic-luxon-adapter": "^1.1.0",
-        "@mosaic-design/date-formatter": "^1.1.0",
-        "@ptsecurity/mosaic-icons": "^6.6.2",
-        "@mosaic-design/tokens-builder": "^1.3.0",
-        "@mosaic-design/tokens-fe-2022": "^1.7.0",
-        "@mosaic-design/tokens-legacy-2017": "^1.7.0"
+        "@angular/cdk": "15.2.9",
+        "@angular/forms": "15.2.9",
+        "@ptsecurity/cdk": "^15.7.2",
+        "@ptsecurity/mosaic-moment-adapter": "^15.7.2",
+        "@ptsecurity/mosaic-luxon-adapter": "^15.7.2",
+        "@mosaic-design/date-formatter": "1.1.0",
+        "@ptsecurity/mosaic-icons": "7.0.8",
+        "@mosaic-design/tokens-builder": "1.3.0",
+        "@mosaic-design/tokens-fe-2022": "1.7.0",
+        "@mosaic-design/tokens-legacy-2017": "1.7.0"
     },
     "dependencies": {
         "tslib": "^2.4.0"

package/popover/_popover-theme.scss

@@ -1,13 +1,7 @@
-@use 'sass:meta';
 @use 'sass:map';
 
 @use '../core/styles/typography/typography-utils' as *;
 
-@use '../core/styles/tokens';
-
-
-$tokens: meta.module-variables(tokens) !default;
-
 @mixin mc-popover-theme($theme) {
     $foreground: map.get($theme, foreground);
 
@@ -99,6 +93,8 @@ $tokens: meta.module-variables(tokens) !default;
 }
 
 @mixin mc-popover-typography($config) {
+    $tokens: map.get($config, tokens);
+
     .mc-popover__header {
         @include mc-typography-level-to-styles($config, map.get($tokens, popover-header-font-default));
     }