feat(angular): v10 support

demo-angular/package.json

@@ -18,29 +18,30 @@
     "e2e-watch": "tsc -p e2e --watch"
   },
   "dependencies": {
-    "@angular/animations": "~8.2.0",
-    "@angular/common": "~8.2.0",
-    "@angular/compiler": "~8.2.0",
-    "@angular/core": "~8.2.0",
-    "@angular/forms": "~8.2.0",
-    "@angular/platform-browser": "~8.2.0",
-    "@angular/platform-browser-dynamic": "~8.2.0",
-    "@angular/router": "~8.2.0",
-    "nativescript-angular": "~8.20.0",
+    "@angular/animations": "~9.1.0",
+    "@angular/common": "~9.1.0",
+    "@angular/compiler": "~9.1.0",
+    "@angular/core": "~9.1.0",
+    "@angular/forms": "~9.1.0",
+    "@angular/platform-browser": "~9.1.0",
+    "@angular/platform-browser-dynamic": "~9.1.0",
+    "@angular/router": "~9.1.0",
+    "@nativescript/angular": "https://github.com/nstudio/ns-ng/blob/master/nativescript-angular-9.0.0.tgz?raw=true",
+    "nativescript-angular": "https://github.com/nstudio/ns-ng/blob/master/nativescript-angular-compat.tgz?raw=true",
     "nativescript-datetimepicker": "file:../src",
     "nativescript-theme-core": "~1.0.4",
     "reflect-metadata": "~0.1.10",
-    "rxjs": "^6.4.0",
-    "tns-core-modules": "^6.0.0",
-    "zone.js": "^0.9.1"
+    "rxjs": "^6.5.0",
+    "tns-core-modules": "^6.5.0",
+    "zone.js": "^0.10.3"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "~8.2.0",
-    "@ngtools/webpack": "~8.2.0",
+    "@angular/compiler-cli": "~9.1.0",
+    "@ngtools/webpack": "~9.1.0",
     "@types/node": "~10.12.18",
-    "nativescript-dev-webpack": "^1.3.0",
+    "nativescript-dev-webpack": "^1.5.0",
     "tslint": "~5.11.0",
-    "typescript": "~3.5.3"
+    "typescript": "~3.8.3"
   },
   "readme": "NativeScript DateTimePicker Demo NG"
 }

demo-angular/src/app/app-routing.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from "@angular/core";
 import { Routes } from "@angular/router";
-import { NativeScriptRouterModule } from "nativescript-angular/router";
+import { NativeScriptRouterModule } from "@nativescript/angular";
 
 const routes: Routes = [
     { path: "", redirectTo: "/home", pathMatch: "full" },

demo-angular/src/app/app.module.ts

@@ -1,5 +1,5 @@
 import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
-import { NativeScriptModule } from "nativescript-angular/nativescript.module";
+import { NativeScriptModule } from "@nativescript/angular";
 
 import { AppRoutingModule } from "./app-routing.module";
 import { AppComponent } from "./app.component";

demo-angular/src/app/home/home-routing.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from "@angular/core";
 import { Routes } from "@angular/router";
-import { NativeScriptRouterModule } from "nativescript-angular/router";
+import { NativeScriptRouterModule } from "@nativescript/angular";
 
 import { HomeComponent } from "./home.component";
 

demo-angular/src/app/home/home.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit, ViewChild, ElementRef } from "@angular/core";
 import { DateTimePicker } from "nativescript-datetimepicker";
-import { EventData } from "tns-core-modules/data/observable";
-import { Button } from "tns-core-modules/ui/button";
+import { Button, EventData } from "@nativescript/core";
 
 @Component({
     selector: "Home",

demo-angular/src/app/home/home.module.ts

@@ -1,7 +1,6 @@
 import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
-import { NativeScriptCommonModule } from "nativescript-angular/common";
+import { NativeScriptCommonModule, NativeScriptFormsModule } from "@nativescript/angular";
 import { NativeScriptDateTimePickerModule } from "nativescript-datetimepicker/angular";
-import { NativeScriptFormsModule } from "nativescript-angular/forms";
 
 import { HomeRoutingModule } from "./home-routing.module";
 import { HomeComponent } from "./home.component";

demo-angular/src/main.ts

@@ -1,5 +1,5 @@
 // this import should be first in order to load some required settings (like globals and reflect-metadata)
-import { platformNativeScriptDynamic } from "nativescript-angular/platform";
+import { platformNativeScriptDynamic } from "@nativescript/angular";
 
 import { AppModule } from "./app/app.module";
 

demo-angular/tsconfig.json

@@ -8,9 +8,9 @@
         "emitDecoratorMetadata": true,
         "experimentalDecorators": true,
         "lib": [
-            "es6",
-            "dom",
-            "es2015.iterable"
+          "es2017",
+          "dom",
+          "es6"
         ],
         "pretty": true,
         "allowUnreachableCode": false,
@@ -25,7 +25,6 @@
         "baseUrl": ".",
         "paths": {
             "*": [
-                "./node_modules/tns-core-modules/*",
                 "./node_modules/*"
             ],
             "~/*": [
@@ -42,5 +41,8 @@
         "node_modules",
         "platforms"
     ],
-    "compileOnSave": false
+    "compileOnSave": false,
+    "angularCompilerOptions": {
+      "enableIvy": false
+    }
 }

demo-vue/app/components/Home.vue

@@ -172,8 +172,7 @@
 
 <script>
     import { DateTimePicker } from "nativescript-datetimepicker";
-    import { EventData } from "tns-core-modules/data/observable";
-    import { Button } from "tns-core-modules/ui/button";
+    import { EventData, Button } from "@nativescript/core";
     export default {
         computed: {
             message() {

demo-vue/jsconfig.json

@@ -2,7 +2,7 @@
     "compilerOptions": {
         "baseUrl": "./",
         "paths": {
-            "*": ["./node_modules/tns-core-modules/*", "./node_modules/*"],
+            "*": ["./node_modules/*"],
             "~/*": ["app/*"]
         }
     },

demo-vue/package.json

@@ -15,17 +15,17 @@
         "nativescript-datetimepicker": "file:../src",
         "nativescript-theme-core": "~1.0.4",
         "nativescript-vue": "~2.4.0",
-        "tns-core-modules": "^6.0.0"
+        "tns-core-modules": "^6.5.0"
     },
     "devDependencies": {
         "@babel/core": "~7.2.0",
         "@babel/preset-env": "~7.2.0",
         "babel-loader": "~8.0.0",
-        "nativescript-dev-webpack": "^1.3.0",
+        "nativescript-dev-webpack": "^1.5.0",
         "nativescript-vue-template-compiler": "~2.4.0",
         "node-sass": "~4.12.0",
         "vue-loader": "~15.4.0",
-        "typescript": "~3.5.3"
+        "typescript": "~3.8.3"
     },
     "readme": "NativeScript DateTimePicker Demo Vue"
 }

demo-vue/tsconfig.json

@@ -16,7 +16,6 @@
                 "app/*"
             ],
             "*": [
-                "./node_modules/tns-core-modules/*",
                 "./node_modules/*"
             ]
         }

demo/app/app.ts

@@ -4,9 +4,9 @@ You can use this file to perform app-level initialization, but the primary
 purpose of the file is to pass control to the app’s first module.
 */
 
-import * as app from "tns-core-modules/application";
+import { Application } from "@nativescript/core";
 
-app.run({ moduleName: "app-root" });
+Application.run({ moduleName: "app-root" });
 
 /*
 Do not place any code after the application has been started as it will not

demo/app/home/home-page.ts

@@ -4,7 +4,7 @@ a code-behind file. The code-behind is a great place to place your view
 logic, and to set up your page’s data binding.
 */
 
-import { NavigatedData, Page } from "tns-core-modules/ui/page";
+import { NavigatedData, Page } from "@nativescript/core";
 
 import { HomeViewModel } from "./home-view-model";
 

demo/app/home/home-view-model.ts

@@ -1,8 +1,5 @@
-import { Observable } from "tns-core-modules/data/observable";
 import { DateTimePicker } from "nativescript-datetimepicker";
-import { EventData } from "tns-core-modules/data/observable";
-import { Button } from "tns-core-modules/ui/button";
-import { ScrollView } from "tns-core-modules/ui/scroll-view";
+import { ScrollView, Button, EventData, Observable } from "@nativescript/core";
 
 export class HomeViewModel extends Observable {
     private scrollView: ScrollView;

demo/package.json

@@ -18,12 +18,12 @@
     "dependencies": {
         "nativescript-datetimepicker": "file:../src",
         "nativescript-theme-core": "~1.0.4",
-        "tns-core-modules": "^6.0.0"
+        "tns-core-modules": "^6.5.0"
     },
     "devDependencies": {
-        "nativescript-dev-webpack": "^1.3.0",
+        "nativescript-dev-webpack": "^1.5.0",
         "tslint": "~5.11.0",
-        "typescript": "~3.5.3"
+        "typescript": "~3.8.3"
     },
     "readme": "NativeScript DateTimePicker Demo Core"
 }

src/angular/nativescript-datetimepicker.accessors.d.ts

@@ -1,12 +1,36 @@
 import { ElementRef } from "@angular/core";
-import { BaseValueAccessor } from "nativescript-angular/forms/value-accessors";
+import { BaseValueAccessor } from "@nativescript/angular";
 import { DatePickerField } from "../ui/date-picker-field";
 import { TimePickerField } from "../ui/time-picker-field";
+import { DateTimePickerFields } from "../ui/date-time-picker-fields";
+import * as i0 from "@angular/core";
 export declare class DatePickerValueAccessor extends BaseValueAccessor<DatePickerField> {
+    private _hasBeenOpened;
     constructor(elementRef: ElementRef);
     writeValue(value: any): void;
+    handleDateChange(args: any): void;
+    handleDatePickerOpened(args: any): void;
+    handleDatePickerClosed(args: any): void;
+    static ɵfac: i0.ɵɵFactoryDef<DatePickerValueAccessor, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<DatePickerValueAccessor, "DatePickerField[ngModel],DatePickerField[formControlName],DatePickerField[formControl],datepickerfield[ngModel],datepickerfield[formControlName],datepickerfield[formControl],datePickerField[ngModel],datePickerField[formControlName],datePickerField[formControl],date-picker-field[ngModel],date-picker-field[formControlName],date-picker-field[formControl]", never, {}, {}, never>;
 }
 export declare class TimePickerValueAccessor extends BaseValueAccessor<TimePickerField> {
+    private _hasBeenOpened;
     constructor(elementRef: ElementRef);
     writeValue(value: any): void;
+    handleTimeChange(args: any): void;
+    handleTimePickerOpened(args: any): void;
+    handleTimePickerClosed(args: any): void;
+    static ɵfac: i0.ɵɵFactoryDef<TimePickerValueAccessor, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<TimePickerValueAccessor, "TimePickerField[ngModel],TimePickerField[formControlName],TimePickerField[formControl],timepickerfield[ngModel],timepickerfield[formControlName],timepickerfield[formControl],timePickerField[ngModel],timePickerField[formControlName],timePickerField[formControl],time-picker-field[ngModel],time-picker-field[formControlName],time-picker-field[formControl]", never, {}, {}, never>;
+}
+export declare class DateTimePickersValueAccessor extends BaseValueAccessor<DateTimePickerFields> {
+    private _hasBeenOpened;
+    constructor(elementRef: ElementRef);
+    writeValue(value: any): void;
+    handleDateChange(args: any): void;
+    handlePickerOpened(args: any): void;
+    handlePickerClosed(args: any): void;
+    static ɵfac: i0.ɵɵFactoryDef<DateTimePickersValueAccessor, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<DateTimePickersValueAccessor, "DateTimePickerFields[ngModel],DateTimePickerFields[formControlName],DateTimePickerFields[formControl],datetimepickerfields[ngModel],datetimepickerfields[formControlName],datetimepickerfields[formControl],dateTimePickerFields[ngModel],dateTimePickerFields[formControlName],dateTimePickerFields[formControl],date-time-picker-fields[ngModel],date-time-picker-fields[formControlName],date-time-picker-fields[formControl]", never, {}, {}, never>;
 }

src/angular/nativescript-datetimepicker.accessors.ts

@@ -1,6 +1,6 @@
 import { Directive, ElementRef, forwardRef } from "@angular/core";
 import { NG_VALUE_ACCESSOR } from "@angular/forms";
-import { BaseValueAccessor } from "nativescript-angular/forms/value-accessors";
+import { BaseValueAccessor } from "@nativescript/angular";
 import { DatePickerField } from "../ui/date-picker-field";
 import { TimePickerField } from "../ui/time-picker-field";
 import { DateTimePickerFields } from "../ui/date-time-picker-fields";

src/angular/nativescript-datetimepicker.directives.d.ts

@@ -1,6 +1,13 @@
-import { DatePickerValueAccessor, TimePickerValueAccessor } from "./nativescript-datetimepicker.accessors";
+import * as i0 from "@angular/core";
 export declare class DatePickerFieldDirective {
+    static ɵfac: i0.ɵɵFactoryDef<DatePickerFieldDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<DatePickerFieldDirective, "DatePickerField", never, {}, {}, never>;
 }
 export declare class TimePickerFieldDirective {
+    static ɵfac: i0.ɵɵFactoryDef<TimePickerFieldDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<TimePickerFieldDirective, "TimePickerField", never, {}, {}, never>;
+}
+export declare class DateTimePickerFieldsDirective {
+    static ɵfac: i0.ɵɵFactoryDef<DateTimePickerFieldsDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDefWithMeta<DateTimePickerFieldsDirective, "DateTimePickerFields", never, {}, {}, never>;
 }
-export declare const DIRECTIVES: (typeof DatePickerFieldDirective | typeof DatePickerValueAccessor | typeof TimePickerValueAccessor)[];

src/angular/nativescript-datetimepicker.directives.ts

@@ -1,7 +1,4 @@
 import { Directive } from "@angular/core";
-import {
-    DatePickerValueAccessor, TimePickerValueAccessor, DateTimePickersValueAccessor
-} from "./nativescript-datetimepicker.accessors";
 
 @Directive({
     selector: "DatePickerField"
@@ -16,7 +13,4 @@ export class TimePickerFieldDirective { }
 @Directive({
     selector: "DateTimePickerFields"
 })
-export class DateTimePickerFieldsDirective { }
-
-export const DIRECTIVES = [DatePickerFieldDirective, TimePickerFieldDirective, DateTimePickerFieldsDirective,
-    DatePickerValueAccessor, TimePickerValueAccessor, DateTimePickersValueAccessor];
+export class DateTimePickerFieldsDirective { }

src/angular/nativescript-datetimepicker.module.d.ts

@@ -1,2 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./nativescript-datetimepicker.directives";
+import * as i2 from "./nativescript-datetimepicker.accessors";
+export { DatePickerFieldDirective, TimePickerFieldDirective, DateTimePickerFieldsDirective, } from "./nativescript-datetimepicker.directives";
+export { DatePickerValueAccessor, TimePickerValueAccessor, DateTimePickersValueAccessor, } from "./nativescript-datetimepicker.accessors";
 export declare class NativeScriptDateTimePickerModule {
+    static ɵmod: i0.ɵɵNgModuleDefWithMeta<NativeScriptDateTimePickerModule, [typeof i1.DatePickerFieldDirective, typeof i1.TimePickerFieldDirective, typeof i1.DateTimePickerFieldsDirective, typeof i2.DatePickerValueAccessor, typeof i2.TimePickerValueAccessor, typeof i2.DateTimePickersValueAccessor], never, [typeof i1.DatePickerFieldDirective, typeof i1.TimePickerFieldDirective, typeof i1.DateTimePickerFieldsDirective, typeof i2.DatePickerValueAccessor, typeof i2.TimePickerValueAccessor, typeof i2.DateTimePickersValueAccessor]>;
+    static ɵinj: i0.ɵɵInjectorDef<NativeScriptDateTimePickerModule>;
 }

src/angular/nativescript-datetimepicker.module.ts

@@ -1,17 +1,48 @@
 import { NgModule } from "@angular/core";
-import { registerElement } from "nativescript-angular/element-registry";
-import { DatePickerField } from "../ui/date-picker-field";
-import { TimePickerField } from "../ui/time-picker-field";
-import { DateTimePickerFields } from "../ui/date-time-picker-fields";
+import { registerElement } from "@nativescript/angular";
+import { DatePickerField, TimePickerField, DateTimePickerFields } from "../ui";
+import {
+  DatePickerFieldDirective,
+  TimePickerFieldDirective,
+  DateTimePickerFieldsDirective,
+} from "./nativescript-datetimepicker.directives";
+import {
+  DatePickerValueAccessor,
+  TimePickerValueAccessor,
+  DateTimePickersValueAccessor,
+} from "./nativescript-datetimepicker.accessors";
 
-import { DIRECTIVES } from "./nativescript-datetimepicker.directives";
+export {
+  DatePickerFieldDirective,
+  TimePickerFieldDirective,
+  DateTimePickerFieldsDirective,
+} from "./nativescript-datetimepicker.directives";
+export {
+  DatePickerValueAccessor,
+  TimePickerValueAccessor,
+  DateTimePickersValueAccessor,
+} from "./nativescript-datetimepicker.accessors";
 
 @NgModule({
-    declarations: [DIRECTIVES],
-    exports: [DIRECTIVES],
+  declarations: [
+    DatePickerFieldDirective,
+    TimePickerFieldDirective,
+    DateTimePickerFieldsDirective,
+    DatePickerValueAccessor,
+    TimePickerValueAccessor,
+    DateTimePickersValueAccessor,
+  ],
+  exports: [
+    DatePickerFieldDirective,
+    TimePickerFieldDirective,
+    DateTimePickerFieldsDirective,
+    DatePickerValueAccessor,
+    TimePickerValueAccessor,
+    DateTimePickersValueAccessor,
+  ],
 })
-export class NativeScriptDateTimePickerModule { }
+export class NativeScriptDateTimePickerModule {}
 
 registerElement("DatePickerField", () => DatePickerField);
 registerElement("TimePickerField", () => TimePickerField);
-registerElement("DateTimePickerFields", () => DateTimePickerFields);
+registerElement("DateTimePickerFields", () => DateTimePickerFields);