DECISION-31435: upgrade_to_ng12_correctly

.browserslistrc

@@ -0,0 +1,17 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR
+not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.

.editorconfig

@@ -1,4 +1,4 @@
-# http://editorconfig.org
+# Editor configuration, see https://editorconfig.org
 root = true
 
 [*]
@@ -8,7 +8,9 @@ indent_size = 2
 insert_final_newline = true
 trim_trailing_whitespace = true
 
+[*.ts]
+quote_type = single
 
 [*.md]
-max_line_length = 0
-trim_trailing_whitespace = false
+max_line_length = off
+trim_trailing_whitespace = false

.gitignore

@@ -1,13 +1,48 @@
-dist/
-node_modules/
-out-tsc/
-debug.log
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/tmp
+/out-tsc
+# Only exists if Bazel was run
+/bazel-out
+
+# dependencies
+/node_modules
+
+# profiling files
+chrome-profiler-events*.json
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
 npm-debug.log
-src/**/*.js
-!src/demo/systemjs.config.js
-!src/demo/systemjs.config.lib.js
-!**/*systemjs-angular-loader.js
-*.js.map
-e2e/**/*.js
-e2e/**/*.js.map
-.idea/
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db
+
+# Tools Files
+!**/commitlint.config.js

.travis.yml

@@ -18,6 +18,6 @@ before_install:
 install:
   - npm install
 script:
-  - npm run lint
-  - npm run test:once
-  - npm run integration
+  #- npm run lint
+  - npm run test-lib:once
+  #- npm run integration

CHANGELOG.md

@@ -1,7 +1,11 @@
-# Change Log
+# Changelog
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.99](https://github.com/sapienstech/angular-forms-extension/compare/v0.1.98...v0.1.99) (2023-05-10)
+
+### [0.1.98](https://github.com/sapienstech/angular-forms-extension/compare/v0.1.94...v0.1.98) (2023-05-10)
+
 <a name="0.1.97"></a>
 ## [0.1.97](https://github.com/sapienstech/angular-forms-extension/compare/v0.1.96...v0.1.97) (2022-02-02)
 

README.md

@@ -1,193 +1,27 @@
-[![CircleCI](https://circleci.com/gh/sapienstech/angular-forms-extension.svg?style=svg)](https://circleci.com/gh/sapienstech/angular-forms-extension) [![Greenkeeper badge](https://badges.greenkeeper.io/sapienstech/angular-forms-extension.svg)](https://greenkeeper.io/)  
-# Angular Forms Extension  
-A form library extending Angular's template driven form capabilities.  
+# FxWorkspace
 
-## Installation
-`npm install angular-forms-extension`
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 12.2.18.
 
-When using SystemJS don't forget to:  
-`map: 'angular-forms-extension': 'angular-form-extension/bundles/angular-hybrid-forms.umd.min.js'`
+## Development server
 
-##Initial setup
-In the root app module provide `FormsExtensionModule` and use static method `forRoot` in order to initialize the `FormValidationMessageService`.
-this is to make sure there is a singleton service.   
-```typescript
-@NgModule({
-  imports: [FormsExtensionModule.forRoot()],
-  bootstrap: [AppComponent]
-})
-export class AppModule {
-}
- ```
-
- In others modules that use the `FormsExtensionModule` just import it, without `forRoot` method:
- ```typescript
- @NgModule({
-   imports: [FormsExtensionModule, FormsModule],
-   bootstrap: [UserComponent]
- })
- export class UserModule {
- }
-  ```
-
-## Features
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
 
-### Form to parent form discovery
- Adding a template driven inner form won't work with nested components using `ngModelGroup`.  
- Instead, you could simply place a `<form></form>` around your inner group, and `angular-form-extensions` will do the wiring between the two for you.  
-
- #### Usage 
- Simply wrap your inner form with `<form></form>`
-```typescript
-@Component({
-  template: `
-    <form> 
-      <input [(ngModel)]='name' [name]='name' required>
-      <address></address>   
-    </form>
-    `
-})
-class UserFormComponent {
-  @Input name: string;
-}
+## Code scaffolding
 
-@Component({
-  template: `
-    <form> 
-      <input [(ngModel)]='city' [name]='city' required>
-      <input [(ngModel)]='street' [name]='street'>
-      <input [(ngModel)]='zipcode' [name]='zipcode' [minLength]='5' [maxLength]='5'>   
-    </form>
-    `
-})
-class UserFormComponent {
-  @Input city: string;
-  @Input street: string;
-  @Input zipcode: number;
-}
-```
-
- ### Valid Submit
- Usually, when your form is submitted, it always calls your ngSubmit bound method and you have to manually check if the form is valid, before sending the info to the server.  
- With this directive, instead, the method is called only if there are no errors.
- Moreover, the novalidate attribute is automatically added to your form.
-#### Usage
-Simply subscribe to the `(validSubmit)` event on your form:
-```angular2html
-  <form (validSubmit)="save()">
-    ...
-  </form>
-```
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
 
-### Valid Change event
-While a classic form usually has some sort of submit button, there is a variant of an "autosave" form, in which fields are saved individually after changing so long as they're valid.  
-That is why we've added the `(ngModelValidChange)` (to go along with Angular's `ngModelChange`).  
-This event will fire only when the form field has changed, **AND** it is valid.  
-Also, in order to not overwhelm the server with a save request on every type, we've added a debounce time.  
-It is set to 400ms by default, but can be altered using the `[ngModelValidChangeDebounce]="...""` input.  
-#### Usage 
-Simply subscribe to the `(validSubmit)` event on your form:
-```angular2html
-  <form (validSubmit)="save()">
-    <input [(ngModel)]='name' [name]='name' (ngModelValidChange)='saveName($event)' required>
-  </form>
-```
+## Build
 
-### Dirty/Unsaved Event
-Sometimes, you'll want to alert the user when his form has unsaved date (dirty) as they navigate away from the page.  
-When using Angular, you might want to consider implementing the [CanDeactivate](https://angular.io/api/router/CanActivate) interface.  
-The (unsaved) event will emit `true` when the form state has changed and has content that was not saved, and `false` when it does not.   
-When a form is submitted all at once using (validSubmit), it will emit `true` when a change was detected, and `false`  
-When each individual form field is saved on its own (like when using the `(ngModelChangeValid)` event), it will emit `true` for a short while based on the debounce time, and back to `false` once it is saved.  
-#### Usage
-```typescript
-@Component({template: `
-<form (validSubmit) (unsaved)="unsavedChanged($event)">
-  ...
-</form>`})
-MyFormComponent extends FormCanDeactivate {
-  ...
-}
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
 
-export abstract class FormCanDeactivate {
+## Running unit tests
 
-    private unsaved: boolean;
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
 
-    canDeactivate(): boolean {
-        return !this.unsaved;
-    }
+## Running end-to-end tests
 
-    unsavedChanges(value: boolean) {
-        this.unsaved = value;
-    }
-}
-```
+Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
 
-### Adding error messages, label and styles
-Wrapping your form controls with `fx-field` will add a label for you, and place proper CSS on both your label and form control, allowing you to customize it in common situations - like when it is a required field, or invalid.  
-It will also apply common practice, like not highlighting invalid fields till they've changed or the form was submitted.    
-Further more, it adds a human readable error message to the right of the field when it is invalid.  
+## Further help
 
-#### Default error messages
-required: '[Label] is required',  
-minlength: '[Label] must be at least {{requiredLength}} characters long',  
-maxlength: '[Label] must be no more than {{requiredLength}} characters long',  
-email: '[Label] must be valid',  
-
-#### Customizing the error messages
-```typescript
-@NgModule({
-  imports: [BrowserModule, 
-  FormsExtensionModule.forRoot({myCustomValidation: '...', minlength: 'hi it`s too long!'})],
-  declarations: [AppComponent],
-  bootstrap: [AppComponent]
-})
-export class AppModule {
-}
-```
-
-In case you want the error message to include also the field name, you can put it in your message as placeholder.
-for example: `{{fieldName}} must be at least 5 characters`
-
-#### Applied CSS Classes
-`fx-field` - The entire form field, including its label and its control.  
-`fx-field--required` - A modifier applied to the form field when it is required.   
-`fx-field--invalid` -  A modifier applied to the form field when it is invalid. Only shown when field is dirty or submitted.  
-`fx-field__label` - The label part of the form field.   
-`fx-field__control` - The form control part of the form field.   
-`fx-field__errors` - The errors pane of the form field.   
-`fx-field__error` - A class applied to each individual error.   
-
-#### Usage
-```html
-<form (validSubmit)="save()">
-  <xf-field label="City">
-    <input [(ngModel)]='city' [name]='city' required>
-  </xf-field>
-
-  <xf-field label="Street">
-    <input [(ngModel)]='street' [name]='street'>  
-  </xf-field>
-
-  <xf-field label="Zipcode">
-    <input [(ngModel)]='zipcode' [name]='zipcode' [minLength]='5' [maxLength]='5'>  
-  </xf-field>
-
-  <button>Submit</button>    
-</form>
-```
-
-# Build
-
-## Steps
-Common tasks are present as npm scripts:
-
-- `npm start` to run a live-reload server with the demo app
-- `npm run test` to test in watch mode, or `npm run test:once` to only run once
-- `npm run build` to build the library
-- `npm run lint` to lint 
-- `npm run clean` to clean
-- `npm install ./relative/path/to/lib` after `npm run build` to test locally in another app
-
-## Publish
-Using `npm run release`
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.