@testgorilla/tgo-ui 2.17.12 → 2.17.13

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@testgorilla/tgo-ui",
-  "version": "2.17.12",
+  "version": "2.17.13",
+  "license": "UNLICENSED",
   "lint-staged": {
     "src/**/*.ts": [
       "eslint --fix",

package/projects/tgo-canopy-ui/theme/_input.scss

@@ -199,6 +199,10 @@
   .mat-mdc-form-field, .autocomplete-wrapper .mat-mdc-form-field {
     &.mat-form-field-appearance-outline,  &.mat-text-field-outlined {
 
+      .mdc-text-field__input::placeholder {
+        color: $grayscale-50;
+      }
+
       .mat-mdc-form-field-hint.error,
       .mat-mdc-form-field-hint.error svg {
         color: $error-50;
@@ -263,7 +267,7 @@
 
         .mdc-notched-outline__notch {
           label {
-            color: $grayscale-40 !important;
+            color: $black !important;
           }
         }
 
@@ -282,7 +286,7 @@
         }
 
         .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above {
-          color: $grayscale-40 !important;
+          color: $black !important;
         }
 
         .mdc-notched-outline__leading {
@@ -394,11 +398,11 @@
     }
   }
 
-  .mat-mdc-select-placeholder, .ui-field[theme="dark"] .mdc-text-field__input::placeholder {
+  .mat-mdc-select-placeholder {
     color: $grayscale-40;
   }
 
-  .ui-dropdown .mat-mdc-select, .ui-field[theme="dark"] .mdc-text-field__input {
+  .ui-dropdown .mat-mdc-select {
     color: $tgo-white;
   }
 }
@@ -444,6 +448,11 @@
   }
 }
 
+.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch label,
+.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch label {
+  color: $black!important;
+}
+
 .mat-mdc-form-field {
   .mat-mdc-form-field-hint-wrapper {
     padding: 0;

package/projects/tgo-canopy-ui/theme/_tooltip.scss

@@ -30,38 +30,38 @@
 
 @mixin rebranded-tooltip-left {
   margin-right: 5px;
-    &:after {
-      content: "";
-      position: absolute;
-      right: -8px;
-      top: calc(50% - 7px);
-      height: 15px;
-      width: 15px;
-      border-top: 1px solid $tgo-white;
-      border-right: 1px solid $tgo-white;
-      background: $black;
-      z-index: 10;
-      border-top-right-radius: 4px;
-      transform: rotate(45deg);
-    }
+  &:after {
+    content: "";
+    position: absolute;
+    right: -8px;
+    top: calc(50% - 7px);
+    height: 15px;
+    width: 15px;
+    border-top: 1px solid $tgo-white;
+    border-right: 1px solid $tgo-white;
+    background: $black;
+    z-index: 10;
+    border-top-right-radius: 4px;
+    transform: rotate(45deg);
+  }
 }
 
 @mixin rebranded-tooltip-below {
   margin-top: 5px;
-    &:after {
-      content: "";
-      position: absolute;
-      right: calc(50% - 7px);
-      top: -8px;
-      height: 15px;
-      width: 15px;
-      border-top: 1px solid $tgo-white;
-      border-right: 1px solid $tgo-white;
-      background: $black;
-      z-index: 10;
-      border-top-right-radius: 4px;
-      transform: rotate(-45deg);
-    }
+  &:after {
+    content: "";
+    position: absolute;
+    right: calc(50% - 7px);
+    top: -8px;
+    height: 15px;
+    width: 15px;
+    border-top: 1px solid $tgo-white;
+    border-right: 1px solid $tgo-white;
+    background: $black;
+    z-index: 10;
+    border-top-right-radius: 4px;
+    transform: rotate(-45deg);
+  }
 }
 
 @mixin rebranded-tooltip-above {
@@ -100,9 +100,11 @@ body {
     .mat-mdc-tooltip {
       @include rebranded-tooltip()
     }
+
     .mat-mdc-tooltip-panel-right .mdc-tooltip--shown {
       @include rebranded-tooltip-right()
     }
+
     .mat-mdc-tooltip-panel-left .mdc-tooltip--shown {
       @include rebranded-tooltip-left()
     }
@@ -147,3 +149,103 @@ body {
     @include rebranded-tooltip-above()
   }
 }
+
+.template-tooltip {
+  padding: 8px;
+  background: $black;
+  color: $tgo-white;
+  border-radius: 6px;
+  border: 1px solid $tgo-white;
+}
+
+.top {
+  .template-tooltip {
+    @include rebranded-tooltip-above();
+
+    &:after {
+      bottom: -3px;
+    }
+  }
+}
+
+.bottom {
+  .template-tooltip {
+    @include rebranded-tooltip-below();
+
+    &:after {
+      top: -3px;
+    }
+  }
+}
+
+
+.right {
+  .template-tooltip {
+    @include rebranded-tooltip-right();
+
+    &:after {
+      left: -3px;
+    }
+  }
+}
+
+
+.left {
+  .template-tooltip {
+    @include rebranded-tooltip-left();
+
+    &:after {
+      right: -3px;
+    }
+  }
+}
+
+.template-tooltip {
+  padding: 8px;
+  background: $black;
+  color: $tgo-white;
+  border-radius: 6px;
+  border: 1px solid $tgo-white;
+}
+
+.top {
+  .template-tooltip {
+    @include rebranded-tooltip-above();
+
+    &:after {
+      bottom: -3px;
+    }
+  }
+}
+
+.bottom {
+  .template-tooltip {
+    @include rebranded-tooltip-below();
+
+    &:after {
+      top: -3px;
+    }
+  }
+}
+
+
+.right {
+  .template-tooltip {
+    @include rebranded-tooltip-right();
+
+    &:after {
+      left: -3px;
+    }
+  }
+}
+
+
+.left {
+  .template-tooltip {
+    @include rebranded-tooltip-left();
+
+    &:after {
+      right: -3px;
+    }
+  }
+}

package/public-api.d.ts

@@ -129,3 +129,4 @@ export * from './models/colors.model';
 export * from './components/password-strength/password-strength.component';
 export * from './components/password-strength/password-strength.component.module';
 export * from './services/icons.service';
+export * from './providers/is-mobile';

package/directives/step-line-width.directive.d.ts

@@ -1,15 +0,0 @@
-import { ElementRef, OnChanges } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Directive is used to draw lines between steps
- */
-export declare class StepLineWidthDirective implements OnChanges {
-    private el;
-    stepLineWidth: HTMLElement;
-    resize(): void;
-    constructor(el: ElementRef);
-    setSize(): void;
-    ngOnChanges(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StepLineWidthDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<StepLineWidthDirective, "[stepLineWidth]", never, { "stepLineWidth": { "alias": "stepLineWidth"; "required": false; }; }, {}, never, never, false, never>;
-}

package/esm2022/directives/step-line-width.directive.mjs

@@ -1,38 +0,0 @@
-import { Directive, HostListener, Input } from '@angular/core';
-import * as i0 from "@angular/core";
-const MARGINS = 36;
-const PADDING = 16;
-/**
- * Directive is used to draw lines between steps
- */
-export class StepLineWidthDirective {
-    resize() {
-        this.setSize();
-    }
-    constructor(el) {
-        this.el = el;
-    }
-    setSize() {
-        this.el.nativeElement.style.width = `calc(100% + ${this.stepLineWidth.getBoundingClientRect().width / 2 - PADDING}px)`;
-        this.el.nativeElement.style.left = `-${this.stepLineWidth.getBoundingClientRect().width / 2 - MARGINS}px`;
-    }
-    ngOnChanges() {
-        queueMicrotask(() => {
-            this.setSize();
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepLineWidthDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: StepLineWidthDirective, selector: "[stepLineWidth]", inputs: { stepLineWidth: "stepLineWidth" }, host: { listeners: { "window:resize.out-zone": "resize($event)" } }, usesOnChanges: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepLineWidthDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[stepLineWidth]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { stepLineWidth: [{
-                type: Input
-            }], resize: [{
-                type: HostListener,
-                args: ['window:resize.out-zone', ['$event']]
-            }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcC1saW5lLXdpZHRoLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvZGlyZWN0aXZlcy9zdGVwLWxpbmUtd2lkdGguZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBYSxNQUFNLGVBQWUsQ0FBQzs7QUFFdEYsTUFBTSxPQUFPLEdBQUcsRUFBRSxDQUFDO0FBQ25CLE1BQU0sT0FBTyxHQUFHLEVBQUUsQ0FBQztBQUVuQjs7R0FFRztBQUlILE1BQU0sT0FBTyxzQkFBc0I7SUFHakMsTUFBTTtRQUNKLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUNqQixDQUFDO0lBRUQsWUFBb0IsRUFBYztRQUFkLE9BQUUsR0FBRixFQUFFLENBQVk7SUFBRyxDQUFDO0lBRXRDLE9BQU87UUFDTCxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLGVBQWUsSUFBSSxDQUFDLGFBQWEsQ0FBQyxxQkFBcUIsRUFBRSxDQUFDLEtBQUssR0FBRyxDQUFDLEdBQUcsT0FBTyxLQUFLLENBQUM7UUFDdkgsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxJQUFJLElBQUksQ0FBQyxhQUFhLENBQUMscUJBQXFCLEVBQUUsQ0FBQyxLQUFLLEdBQUcsQ0FBQyxHQUFHLE9BQU8sSUFBSSxDQUFDO0lBQzVHLENBQUM7SUFFRCxXQUFXO1FBQ1QsY0FBYyxDQUFDLEdBQUcsRUFBRTtZQUNsQixJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7UUFDakIsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDOytHQWxCVSxzQkFBc0I7bUdBQXRCLHNCQUFzQjs7NEZBQXRCLHNCQUFzQjtrQkFIbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsaUJBQWlCO2lCQUM1QjtpR0FFVSxhQUFhO3NCQUFyQixLQUFLO2dCQUVOLE1BQU07c0JBREwsWUFBWTt1QkFBQyx3QkFBd0IsRUFBRSxDQUFDLFFBQVEsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBJbnB1dCwgT25DaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmNvbnN0IE1BUkdJTlMgPSAzNjtcbmNvbnN0IFBBRERJTkcgPSAxNjtcblxuLyoqXG4gKiBEaXJlY3RpdmUgaXMgdXNlZCB0byBkcmF3IGxpbmVzIGJldHdlZW4gc3RlcHNcbiAqL1xuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW3N0ZXBMaW5lV2lkdGhdJyxcbn0pXG5leHBvcnQgY2xhc3MgU3RlcExpbmVXaWR0aERpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIHN0ZXBMaW5lV2lkdGg6IEhUTUxFbGVtZW50O1xuICBASG9zdExpc3RlbmVyKCd3aW5kb3c6cmVzaXplLm91dC16b25lJywgWyckZXZlbnQnXSlcbiAgcmVzaXplKCk6IHZvaWQge1xuICAgIHRoaXMuc2V0U2l6ZSgpO1xuICB9XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZikge31cblxuICBzZXRTaXplKCk6IHZvaWQge1xuICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC5zdHlsZS53aWR0aCA9IGBjYWxjKDEwMCUgKyAke3RoaXMuc3RlcExpbmVXaWR0aC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKS53aWR0aCAvIDIgLSBQQURESU5HfXB4KWA7XG4gICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnN0eWxlLmxlZnQgPSBgLSR7dGhpcy5zdGVwTGluZVdpZHRoLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpLndpZHRoIC8gMiAtIE1BUkdJTlN9cHhgO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoKTogdm9pZCB7XG4gICAgcXVldWVNaWNyb3Rhc2soKCkgPT4ge1xuICAgICAgdGhpcy5zZXRTaXplKCk7XG4gICAgfSk7XG4gIH1cbn1cbiJdfQ==