@ptsecurity/mosaic 15.4.1 → 15.6.0

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/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);
@@ -130,11 +126,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,12 +50,14 @@ $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)
     );
+
+    &:first-child {
+        margin-top: map.get($tokens, size-m);
+    }
 }
 
 .mc-form-field__hint > .mc-hint {

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/input/input-password.d.ts

@@ -22,6 +22,7 @@ export declare class McPasswordToggle extends McTooltipTrigger implements OnDest
     set tabIndex(value: number);
     private _tabIndex;
     get hidden(): boolean;
+    get visibility(): string;
     constructor(overlay: Overlay, elementRef: ElementRef, ngZone: NgZone, scrollDispatcher: ScrollDispatcher, hostView: ViewContainerRef, scrollStrategy: any, direction: Directionality, focusMonitor: FocusMonitor, formField: McFormField);
     ngOnDestroy(): void;
     toggle(): void;

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/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/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/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ptsecurity/mosaic",
-    "version": "15.4.1",
+    "version": "15.6.0",
     "description": "Mosaic",
     "repository": {
         "type": "git",
@@ -17,19 +17,19 @@
     },
     "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.4.1",
-        "@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/animations": "15.2.9",
+        "@angular/cdk": "15.2.9",
+        "@angular/core": "15.2.9",
+        "@angular/common": "15.2.9",
+        "@angular/forms": "15.2.9",
+        "@ptsecurity/cdk": "^15.6.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": "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));
     }