fixed components for angular 9 support

Author: morrisjdev

.idea/workspace.xml

@@ -1,13 +1,13 @@
 {
   "name": "ng-metro4",
   "description": "Angular components for Metro4 UI library in modern ui style.",
-  "version": "1.0.10",
+  "version": "2.0.0",
   "peerDependencies": {
-    "@angular/common": "~8.1.0",
-    "@angular/core": "~8.1.0",
+    "@angular/common": "~9.0.1",
+    "@angular/core": "~9.0.1",
     "moment": "^2.24.0",
 	  "metro4": "4.3.5",
-    "rxjs": "~6.5.2"
+    "rxjs": "~6.5.4"
   },
   "schematics": "./schematics/collection.json",
   "keywords": [

projects/ng-metro4/package.json

@@ -1,5 +1,5 @@
 <input type="text" #input
-       [ngClass]="class"
+
        data-input-format="%m/%d/%Y"
 
        [attr.data-calendar-wide]="calendarWide"

projects/ng-metro4/src/lib/form/calendar-picker/calendar-picker.component.html

@@ -18,7 +18,7 @@ declare var $: any;
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CalendarPickerComponent extends ControlBase<moment.Moment> {
-  @Input('class') class: string;
+
   @Input('calendar-wide') calendarWide: boolean;
   @Input('calendar-wide-point') calendarWidePoint: WidePointType;
   @Input('dialog-mode') dialogMode: boolean;

projects/ng-metro4/src/lib/form/calendar-picker/calendar-picker.component.ts

@@ -1,5 +1,5 @@
 <div #object
-     [ngClass]="class"
+
 
      [attr.data-years-before]="yearsBefore"
      [attr.data-years-after]="yearsAfter"

projects/ng-metro4/src/lib/form/calendar/calendar.component.html

@@ -1,5 +1,5 @@
-@import (once) '~metro4/source/include/vars';
-@import (once) '~metro4/source/include/mixins';
+@import (once) 'node_modules/metro4/source/include/vars';
+@import (once) 'node_modules/metro4/source/include/mixins';
 
 .calendar {
   each(@accentColors, {

projects/ng-metro4/src/lib/form/calendar/calendar.component.less

@@ -19,7 +19,7 @@ declare var $: any;
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CalendarComponent extends ControlBase<moment.Moment|moment.Moment[]> {
-  @Input('class') class: string;
+
   @Input('years-before') yearsBefore: number;
   @Input('years-after') yearsAfter: number;
   @Input('show') show: moment.Moment;

projects/ng-metro4/src/lib/form/calendar/calendar.component.ts

@@ -1,5 +1,5 @@
 <ng-container *ngIf="options; else noOptions">
-  <m4-checkbox *ngFor="let option of options | objectKeys" [value]="options[option]" [caption]="option" [class]="class"></m4-checkbox>
+  <m4-checkbox *ngFor="let option of options | objectKeys" [value]="options[option]" [caption]="option"></m4-checkbox>
 </ng-container>
 <ng-template #noOptions>
   <ng-content></ng-content>

projects/ng-metro4/src/lib/form/checkbox-group/checkbox-group.component.html

@@ -23,7 +23,7 @@ import {asapScheduler} from 'rxjs';
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class CheckboxGroupComponent extends ControlBase<any[]> {
-  @Input('class') class: string;
+
   @Input() readonly = false;
   @Input() options: { [title: string]: any };
 

projects/ng-metro4/src/lib/form/checkbox-group/checkbox-group.component.ts

@@ -1,5 +1,5 @@
 <input type="checkbox" #input
-       [ngClass]="class"
+
 
        [readonly]="readonly"
 

projects/ng-metro4/src/lib/form/checkbox/checkbox.component.html

@@ -1,5 +1,5 @@
-@import (once) '~metro4/source/include/vars';
-@import (once) '~metro4/source/include/mixins';
+@import (once) 'node_modules/metro4/source/include/vars';
+@import (once) 'node_modules/metro4/source/include/mixins';
 
 .checkbox {
   each(@accentColors, {

projects/ng-metro4/src/lib/form/checkbox/checkbox.component.less

@@ -16,7 +16,7 @@ declare var $: any;
   encapsulation: ViewEncapsulation.None
 })
 export class CheckboxComponent extends ControlBase<boolean> {
-  @Input('class') class: string;
+
   @Input('value') value: any;
 
   @Input('readonly') readonly = false;

projects/ng-metro4/src/lib/form/checkbox/checkbox.component.ts

@@ -1,5 +1,5 @@
 <input type="text" #input
-       [ngClass]="class"
+
 
        [attr.data-month]="month"
        [attr.data-day]="day"

projects/ng-metro4/src/lib/form/date-picker/date-picker.component.html

@@ -1,5 +1,5 @@
-@import (once) '~metro4/source/include/vars';
-@import (once) '~metro4/source/include/mixins';
+@import (once) 'node_modules/metro4/source/include/vars';
+@import (once) 'node_modules/metro4/source/include/mixins';
 
 .date-picker {
   each(@accentColors, {

projects/ng-metro4/src/lib/form/date-picker/date-picker.component.less

@@ -17,7 +17,7 @@ declare var $: any;
   encapsulation: ViewEncapsulation.None
 })
 export class DatePickerComponent extends ControlBase<moment.Moment> {
-  @Input('class') class: string;
+
   @Input('month') month: boolean;
   @Input('day') day: boolean;
   @Input('year') year: boolean;

projects/ng-metro4/src/lib/form/date-picker/date-picker.component.ts

@@ -1,5 +1,5 @@
 <input type="file" #input
-       [ngClass]="class"
+
 
        [accept]="accept"
        [multiple]="multiple"

projects/ng-metro4/src/lib/form/file-input/file-input.component.html

@@ -1,5 +1,5 @@
-@import (once) '~metro4/source/include/vars';
-@import (once) '~metro4/source/include/mixins';
+@import (once) 'node_modules/metro4/source/include/vars';
+@import (once) 'node_modules/metro4/source/include/mixins';
 
 .drop-zone {
   each(@accentColors, {

projects/ng-metro4/src/lib/form/file-input/file-input.component.less

@@ -21,7 +21,7 @@ export interface FileEntry {
   encapsulation: ViewEncapsulation.None
 })
 export class FileInputComponent extends ControlBase<File | File[] | FileEntry | FileEntry[]> {
-  @Input('class') class: string;
+
   @Input('multiple') multiple = false;
   @Input('accept') accept = '';
   @Input('read') read: FileReadModeType = '';