From 16fab3783a06cebb9b018b0f24004f43cd462658 Mon Sep 17 00:00:00 2001 From: Lucas Amorim Date: Fri, 12 Jul 2019 15:45:59 -0300 Subject: [PATCH 1/5] =?UTF-8?q?atualiza=C3=A7=C3=A3o=20para=20o=20angular?= =?UTF-8?q?=208?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .angular-cli.json | 60 ------------ karma.conf.js | 10 +- package.json | 36 +++---- src/app/app.component.html | 21 ++--- src/app/app.component.ts | 16 ++++ .../directives/ctr-input.directive.ts | 5 +- .../directives/ctr-list.directive.ts | 7 +- .../directives/ctr-row.directive.ts | 9 +- .../edge-completer.component.ts | 2 +- .../edge-completer/edge-completer.module.ts | 5 +- .../shared/completer-base-data.ts | 2 +- .../shared/completer-data-factory.ts | 9 -- .../edge-completer/shared/completer-data.ts | 2 +- .../shared/completer-service.ts | 13 +-- src/app/edge-completer/shared/local-data.ts | 2 +- src/app/edge-completer/shared/remote-data.ts | 94 ------------------- src/polyfills.ts | 45 --------- src/tsconfig.spec.json | 39 ++++---- tsconfig.json | 7 +- tslint.json | 1 - 20 files changed, 88 insertions(+), 297 deletions(-) delete mode 100644 .angular-cli.json delete mode 100644 src/app/edge-completer/shared/remote-data.ts diff --git a/.angular-cli.json b/.angular-cli.json deleted file mode 100644 index a100235..0000000 --- a/.angular-cli.json +++ /dev/null @@ -1,60 +0,0 @@ -{ - "$schema": "./node_modules/@angular/cli/lib/config/schema.json", - "project": { - "name": "edge-completer" - }, - "apps": [ - { - "root": "src", - "outDir": "dist", - "assets": [ - "assets", - "favicon.ico" - ], - "index": "index.html", - "main": "main.ts", - "polyfills": "polyfills.ts", - "test": "test.ts", - "tsconfig": "tsconfig.app.json", - "testTsconfig": "tsconfig.spec.json", - "prefix": "app", - "styles": [ - "styles.css" - ], - "scripts": [], - "environmentSource": "environments/environment.ts", - "environments": { - "dev": "environments/environment.ts", - "prod": "environments/environment.prod.ts" - } - } - ], - "e2e": { - "protractor": { - "config": "./protractor.conf.js" - } - }, - "lint": [ - { - "project": "src/tsconfig.app.json", - "exclude": "**/node_modules/**" - }, - { - "project": "src/tsconfig.spec.json", - "exclude": "**/node_modules/**" - }, - { - "project": "e2e/tsconfig.e2e.json", - "exclude": "**/node_modules/**" - } - ], - "test": { - "karma": { - "config": "./karma.conf.js" - } - }, - "defaults": { - "styleExt": "css", - "component": {} - } -} diff --git a/karma.conf.js b/karma.conf.js index af139fa..0840f6c 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -4,24 +4,22 @@ module.exports = function (config) { config.set({ basePath: '', - frameworks: ['jasmine', '@angular/cli'], + frameworks: ['jasmine', '@angular-devkit/build-angular'], plugins: [ require('karma-jasmine'), require('karma-chrome-launcher'), require('karma-jasmine-html-reporter'), require('karma-coverage-istanbul-reporter'), - require('@angular/cli/plugins/karma') + require('@angular-devkit/build-angular/plugins/karma') ], client:{ clearContext: false // leave Jasmine Spec Runner output visible in browser }, coverageIstanbulReporter: { - reports: [ 'html', 'lcovonly' ], + dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ], fixWebpackSourcePaths: true }, - angularCli: { - environment: 'dev' - }, + reporters: ['progress', 'kjhtml'], port: 9876, colors: true, diff --git a/package.json b/package.json index 5eae38d..82644f1 100644 --- a/package.json +++ b/package.json @@ -14,27 +14,29 @@ }, "private": false, "dependencies": { - "@angular/animations": "^5.2.0", - "@angular/common": "^5.2.0", - "@angular/compiler": "^5.2.0", - "@angular/core": "^5.2.0", - "@angular/forms": "^5.2.0", - "@angular/http": "^5.2.0", - "@angular/platform-browser": "^5.2.0", - "@angular/platform-browser-dynamic": "^5.2.0", - "@angular/router": "^5.2.0", + "@angular/animations": "^8.1.1", + "@angular/common": "^8.1.1", + "@angular/compiler": "^8.1.1", + "@angular/core": "^8.1.1", + "@angular/forms": "^8.1.1", + "@angular/http": "^7.2.15", + "@angular/platform-browser": "^8.1.1", + "@angular/platform-browser-dynamic": "^8.1.1", + "@angular/router": "^8.1.1", "core-js": "^2.4.1", - "rxjs": "^5.5.6", - "zone.js": "^0.8.19" + "rxjs": "^6.5.2", + "tslib": "^1.9.0", + "zone.js": "^0.9.1" }, "devDependencies": { - "@angular/cli": "1.6.7", - "@angular/compiler-cli": "^5.2.0", - "@angular/language-service": "^5.2.0", + "@angular-devkit/build-angular": "~0.13.0", + "@angular/cli": "^8.1.1", + "@angular/compiler-cli": "^8.1.1", + "@angular/language-service": "^8.1.1", "@types/jasmine": "~2.8.3", "@types/jasminewd2": "~2.0.2", "@types/node": "~6.0.60", - "codelyzer": "^4.0.1", + "codelyzer": "^5.1.0", "jasmine-core": "~2.8.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~2.0.0", @@ -42,10 +44,10 @@ "karma-coverage-istanbul-reporter": "^1.2.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", - "ng-packagr": "^2.0.0", + "ng-packagr": "^5.3.0", "protractor": "~5.1.2", "ts-node": "~4.1.0", "tslint": "~5.9.1", - "typescript": "~2.5.3" + "typescript": "~3.4.5" } } diff --git a/src/app/app.component.html b/src/app/app.component.html index fb5a245..d2d7c57 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,22 +1,13 @@

- Welcome to {{ title }}! + Edge-completer demo

- Angular Logo
-

Here are some links to help you start:

- - + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 7b0f672..2a52009 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,4 +1,7 @@ import { Component } from '@angular/core'; +import {CompleterItem} from './edge-completer/shared/completer-item'; +import {CompleterData} from './edge-completer/shared/completer-data'; +import {CompleterService} from './edge-completer/shared/completer-service'; @Component({ selector: 'app-root', @@ -7,4 +10,17 @@ import { Component } from '@angular/core'; }) export class AppComponent { title = 'app'; + + searchData = [{key: 'Item 1', value: 'valor do item 1'}, {key: 'Item 2', value: 'valor do item 2'}]; + + dataService: CompleterData; + + constructor(private completerService: CompleterService) { + this.dataService = completerService.local(this.searchData, 'key', 'key'); + } + + onDropdownChange($event: CompleterItem) { + if ($event) + alert('VocĂȘ selecionou ' + $event.originalObject.key); + } } diff --git a/src/app/edge-completer/directives/ctr-input.directive.ts b/src/app/edge-completer/directives/ctr-input.directive.ts index 61c2a7a..1bd776c 100644 --- a/src/app/edge-completer/directives/ctr-input.directive.ts +++ b/src/app/edge-completer/directives/ctr-input.directive.ts @@ -1,11 +1,10 @@ import { Directive, ElementRef, EventEmitter, Host, HostListener, Input, Output } from '@angular/core'; -import { Subscription } from 'rxjs/Subscription'; +import { Subscription , Observable } from 'rxjs'; import { NgModel } from '@angular/forms'; import { CtrCompleterDirective } from './ctr-completer.directive'; import { CompleterItem } from '../shared/completer-item'; import { isNil } from '../shared/globals'; -import { Observable } from 'rxjs/Observable'; -import 'rxjs/add/observable/timer'; + diff --git a/src/app/edge-completer/directives/ctr-list.directive.ts b/src/app/edge-completer/directives/ctr-list.directive.ts index 24a79c0..7e86178 100644 --- a/src/app/edge-completer/directives/ctr-list.directive.ts +++ b/src/app/edge-completer/directives/ctr-list.directive.ts @@ -2,14 +2,13 @@ import { ChangeDetectorRef, Directive, EmbeddedViewRef, Host, Input, OnInit, TemplateRef, ViewContainerRef } from '@angular/core'; -import { Observable } from 'rxjs/Observable'; -import 'rxjs/add/observable/timer'; +import { Observable , Subscription } from 'rxjs'; + import { CompleterItem } from '../shared/completer-item'; import { CLEAR_TIMEOUT, isNil, MIN_SEARCH_LENGTH, PAUSE } from '../shared/globals'; import { CompleterList, CtrCompleterDirective } from './ctr-completer.directive'; -import { Subscription } from 'rxjs/Subscription'; import { CompleterData } from '../shared/completer-data'; -import 'rxjs/add/operator/catch'; + export class CtrListContext { constructor( diff --git a/src/app/edge-completer/directives/ctr-row.directive.ts b/src/app/edge-completer/directives/ctr-row.directive.ts index 6acdab9..fcf18cb 100644 --- a/src/app/edge-completer/directives/ctr-row.directive.ts +++ b/src/app/edge-completer/directives/ctr-row.directive.ts @@ -1,4 +1,4 @@ -import { Directive, ElementRef, Host, HostListener, Input, OnDestroy, Renderer } from '@angular/core'; +import {Directive, ElementRef, Host, HostListener, Input, OnDestroy, Renderer2} from '@angular/core'; import { CtrlDropdownDirective, CtrRowElement, CtrRowItem } from './ctr-dropdown.directive'; import { CompleterItem } from '../shared/completer-item'; @@ -11,7 +11,7 @@ export class CtrRowDirective implements CtrRowElement, OnDestroy { private _rowIndex: number; private _item: CompleterItem; - constructor(private el: ElementRef, private renderer: Renderer, @Host() private dropdown: CtrlDropdownDirective) { } + constructor(private el: ElementRef, private renderer: Renderer2, @Host() private dropdown: CtrlDropdownDirective) { } public ngOnDestroy() { if (this._rowIndex) { @@ -41,7 +41,10 @@ export class CtrRowDirective implements CtrRowElement, OnDestroy { public setHighlighted(selected: boolean) { this.selected = selected; - this.renderer.setElementClass(this.el.nativeElement, 'completer-selected-row', this.selected); + if (this.selected) + this.renderer.addClass(this.el.nativeElement, 'completer-selected-row'); + else + this.renderer.removeClass(this.el.nativeElement, 'completer-selected-row'); } public getNativeElement() { diff --git a/src/app/edge-completer/edge-completer.component.ts b/src/app/edge-completer/edge-completer.component.ts index 0649da4..ad76d8f 100644 --- a/src/app/edge-completer/edge-completer.component.ts +++ b/src/app/edge-completer/edge-completer.component.ts @@ -199,7 +199,7 @@ export class EdgeCompleterComponent implements OnInit, ControlValueAccessor, Aft if (source instanceof Array) { this.dataService = this.completerService.local(source); } else if (typeof (source) === 'string') { - this.dataService = this.completerService.remote(source); + throw new Error('Must be an array to be a datasource'); } else { this.dataService = source; } diff --git a/src/app/edge-completer/edge-completer.module.ts b/src/app/edge-completer/edge-completer.module.ts index 1c26687..98d2b7f 100644 --- a/src/app/edge-completer/edge-completer.module.ts +++ b/src/app/edge-completer/edge-completer.module.ts @@ -11,7 +11,7 @@ import { EdgeCompleterListItemComponent } from './edge-completer-list-item/edge- import { FormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; import { CompleterService } from './shared/completer-service'; -import { LocalDataFactoryProvider, RemoteDataFactoryProvider } from './shared/completer-data-factory'; +import { LocalDataFactoryProvider } from './shared/completer-data-factory'; @NgModule({ imports: [ @@ -31,8 +31,7 @@ import { LocalDataFactoryProvider, RemoteDataFactoryProvider } from './shared/co ], providers: [ CompleterService, - LocalDataFactoryProvider, - RemoteDataFactoryProvider + LocalDataFactoryProvider ], exports: [ EdgeCompleterComponent, diff --git a/src/app/edge-completer/shared/completer-base-data.ts b/src/app/edge-completer/shared/completer-base-data.ts index 846ab0a..3f16d58 100644 --- a/src/app/edge-completer/shared/completer-base-data.ts +++ b/src/app/edge-completer/shared/completer-base-data.ts @@ -2,7 +2,7 @@ import { CompleterData } from './completer-data'; import { CompleterItem } from './completer-item'; -import { Subject } from 'rxjs/Subject'; +import { Subject } from 'rxjs'; import { isNil } from './globals'; export abstract class CompleterBaseData extends Subject implements CompleterData { diff --git a/src/app/edge-completer/shared/completer-data-factory.ts b/src/app/edge-completer/shared/completer-data-factory.ts index 113c246..f7c4a74 100644 --- a/src/app/edge-completer/shared/completer-data-factory.ts +++ b/src/app/edge-completer/shared/completer-data-factory.ts @@ -1,6 +1,4 @@ import { LocalData } from './local-data'; -import { Http } from '@angular/http'; -import { RemoteData } from './remote-data'; export function localDataFactory () { return () => { @@ -8,11 +6,4 @@ export function localDataFactory () { }; } -export function remoteDataFactory (http: Http) { - return () => { - return new RemoteData(http); - }; -} - export let LocalDataFactoryProvider = {provide: LocalData, useFactory: localDataFactory}; -export let RemoteDataFactoryProvider = {provide: RemoteData, useFactory: remoteDataFactory, deps: [Http]}; diff --git a/src/app/edge-completer/shared/completer-data.ts b/src/app/edge-completer/shared/completer-data.ts index 9d813bc..12980e4 100644 --- a/src/app/edge-completer/shared/completer-data.ts +++ b/src/app/edge-completer/shared/completer-data.ts @@ -1,5 +1,5 @@ import { CompleterItem } from './completer-item'; -import { Observable } from 'rxjs/Observable'; +import { Observable } from 'rxjs'; import { EventEmitter } from '@angular/core'; export interface CompleterData extends Observable { diff --git a/src/app/edge-completer/shared/completer-service.ts b/src/app/edge-completer/shared/completer-service.ts index 3f812b1..8acfaec 100644 --- a/src/app/edge-completer/shared/completer-service.ts +++ b/src/app/edge-completer/shared/completer-service.ts @@ -2,14 +2,12 @@ import { Inject, Injectable } from '@angular/core'; import { LocalData } from './local-data'; -import { RemoteData } from './remote-data'; -import { Observable } from 'rxjs/Observable'; +import { Observable } from 'rxjs'; @Injectable() export class CompleterService { constructor( @Inject(LocalData) private localDataFactory: any, // Using any instead of () => LocalData because on AoT errors - @Inject(RemoteData) private remoteDataFactory: any // Using any instead of () => LocalData because on AoT errors ) { } public local(data: any[] | Observable, searchFields: string | null = '', titleField: string | null = ''): LocalData { @@ -20,13 +18,4 @@ export class CompleterService { .searchFields(searchFields) .titleField(titleField); } - - public remote(url: string | null, searchFields: string | null = '', titleField: string | null = ''): RemoteData { - - let remoteData = this.remoteDataFactory(); - return remoteData - .remoteUrl(url) - .searchFields(searchFields) - .titleField(titleField); - } } diff --git a/src/app/edge-completer/shared/local-data.ts b/src/app/edge-completer/shared/local-data.ts index c4c1461..cd34060 100644 --- a/src/app/edge-completer/shared/local-data.ts +++ b/src/app/edge-completer/shared/local-data.ts @@ -2,7 +2,7 @@ import { EventEmitter, Injectable } from '@angular/core'; import { CompleterBaseData } from './completer-base-data'; -import { Observable } from 'rxjs/Observable'; +import { Observable } from 'rxjs'; import { CompleterItem } from './completer-item'; @Injectable() diff --git a/src/app/edge-completer/shared/remote-data.ts b/src/app/edge-completer/shared/remote-data.ts deleted file mode 100644 index c9b0f70..0000000 --- a/src/app/edge-completer/shared/remote-data.ts +++ /dev/null @@ -1,94 +0,0 @@ - - -import { CompleterBaseData } from './completer-base-data'; -import { EventEmitter } from '@angular/core'; -import { Subscription } from 'rxjs/Subscription'; -import 'rxjs/add/operator/map'; -import { Headers, Http, RequestOptions, Response } from '@angular/http'; -import { CompleterItem } from './completer-item'; - -export class RemoteData extends CompleterBaseData { - public dataSourceChange: EventEmitter = new EventEmitter(); - - private _remoteUrl: string; - private remoteSearch: Subscription; - private _urlFormater: ((term: string) => string) | null = null; - private _dataField: string | null = null; - private _headers: Headers; - private _requestOptions: RequestOptions; - - - constructor(private http: Http) { - super(); - } - - public remoteUrl(remoteUrl: string) { - this._remoteUrl = remoteUrl; - this.dataSourceChange.emit(); - - return this; - } - - public urlFormater(urlFormater: (term: string) => string) { - this._urlFormater = urlFormater; - } - - public dataField(dataField: string) { - this._dataField = dataField; - } - - /** - * @deprecated Please use the requestOptions to pass headers with the search request - */ - public headers(headers: Headers) { - this._headers = headers; - } - - public requestOptions(requestOptions: RequestOptions) { - this._requestOptions = requestOptions; - } - - public search(term: string): void { - this.cancel(); - // let params = {}; - let url = ''; - if (this._urlFormater) { - url = this._urlFormater(term); - } else { - url = this._remoteUrl + encodeURIComponent(term); - } - - /* - * If requestOptions are provided, they will override anything set in headers. - * - * If no requestOptions are provided, a new RequestOptions object will be instantiated, - * and either the provided headers or a new Headers() object will be sent. - */ - if (!this._requestOptions) { - this._requestOptions = new RequestOptions(); - this._requestOptions.headers = this._headers || new Headers(); - } - - this.remoteSearch = this.http.get(url, this._requestOptions.merge()) - .map((res: Response) => res.json()) - .map((data: any) => { - const matches = this.extractValue(data, this._dataField); - return this.extractMatches(matches, term); - }) - .catch(() => []) - .subscribe((matches: any[]) => { - const results = this.processResults(matches); - this.next(results); - }); - } - - public cancel() { - if (this.remoteSearch) { - this.remoteSearch.unsubscribe(); - } - } - - public convertToItem(data: any): CompleterItem | null { - return super.convertToItem(data); - } -} diff --git a/src/polyfills.ts b/src/polyfills.ts index d68672f..8e763c5 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -1,49 +1,4 @@ -/** - * This file includes polyfills needed by Angular and is loaded before the app. - * You can add your own extra polyfills to this file. - * - * This file is divided into 2 sections: - * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. - * 2. Application imports. Files imported after ZoneJS that should be loaded before your main - * file. - * - * The current setup is for so-called "evergreen" browsers; the last versions of browsers that - * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), - * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. - * - * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html - */ - -/*************************************************************************************************** - * BROWSER POLYFILLS - */ - -/** IE9, IE10 and IE11 requires all of the following polyfills. **/ -// import 'core-js/es6/symbol'; -// import 'core-js/es6/object'; -// import 'core-js/es6/function'; -// import 'core-js/es6/parse-int'; -// import 'core-js/es6/parse-float'; -// import 'core-js/es6/number'; -// import 'core-js/es6/math'; -// import 'core-js/es6/string'; -// import 'core-js/es6/date'; -// import 'core-js/es6/array'; -// import 'core-js/es6/regexp'; -// import 'core-js/es6/map'; -// import 'core-js/es6/weak-map'; -// import 'core-js/es6/set'; - -/** IE10 and IE11 requires the following for NgClass support on SVG elements */ -// import 'classlist.js'; // Run `npm install --save classlist.js`. - -/** IE10 and IE11 requires the following for the Reflect API. */ -// import 'core-js/es6/reflect'; - -/** Evergreen browsers require these. **/ -// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove. -import 'core-js/es7/reflect'; /** diff --git a/src/tsconfig.spec.json b/src/tsconfig.spec.json index ac22a29..6e51cae 100644 --- a/src/tsconfig.spec.json +++ b/src/tsconfig.spec.json @@ -1,19 +1,20 @@ -{ - "extends": "../tsconfig.json", - "compilerOptions": { - "outDir": "../out-tsc/spec", - "baseUrl": "./", - "module": "commonjs", - "types": [ - "jasmine", - "node" - ] - }, - "files": [ - "test.ts" - ], - "include": [ - "**/*.spec.ts", - "**/*.d.ts" - ] -} +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/spec", + "baseUrl": "./", + "module": "commonjs", + "types": [ + "jasmine", + "node" + ] + }, + "files": [ + "test.ts", "polyfills.ts" + + ], + "include": [ + "**/*.spec.ts", + "**/*.d.ts" + ] +} diff --git a/tsconfig.json b/tsconfig.json index a6c016b..8cd9a30 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,7 @@ { "compileOnSave": false, "compilerOptions": { + "importHelpers": true, "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, @@ -14,6 +15,8 @@ "lib": [ "es2017", "dom" - ] + ], + "module": "es2015", + "baseUrl": "./" } -} +} \ No newline at end of file diff --git a/tslint.json b/tslint.json index c6715a6..1d05771 100644 --- a/tslint.json +++ b/tslint.json @@ -18,7 +18,6 @@ "forin": true, "import-blacklist": [ true, - "rxjs", "rxjs/Rx" ], "import-spacing": true, From 9389060665e1bf0e59317a6cb25bc3aa16d983e5 Mon Sep 17 00:00:00 2001 From: Lucas Amorim Date: Fri, 12 Jul 2019 15:46:32 -0300 Subject: [PATCH 2/5] =?UTF-8?q?atualiza=C3=A7=C3=A3o=20para=20o=20angular?= =?UTF-8?q?=208?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- angular.json | 132 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 132 insertions(+) create mode 100644 angular.json diff --git a/angular.json b/angular.json new file mode 100644 index 0000000..1692755 --- /dev/null +++ b/angular.json @@ -0,0 +1,132 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "edge-completer": { + "root": "", + "sourceRoot": "src", + "projectType": "application", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist", + "index": "src/index.html", + "main": "src/main.ts", + "tsConfig": "src/tsconfig.app.json", + "polyfills": "src/polyfills.ts", + "assets": [ + "src/assets", + "src/favicon.ico" + ], + "styles": [ + "src/styles.css" + ], + "scripts": [] + }, + "configurations": { + "production": { + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "edge-completer:build" + }, + "configurations": { + "production": { + "browserTarget": "edge-completer:build:production" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "edge-completer:build" + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "main": "src/test.ts", + "karmaConfig": "./karma.conf.js", + "polyfills": "src/polyfills.ts", + "tsConfig": "src/tsconfig.spec.json", + "scripts": [], + "styles": [ + "src/styles.css" + ], + "assets": [ + "src/assets", + "src/favicon.ico" + ] + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "src/tsconfig.app.json", + "src/tsconfig.spec.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } + }, + "edge-completer-e2e": { + "root": "e2e", + "sourceRoot": "e2e", + "projectType": "application", + "architect": { + "e2e": { + "builder": "@angular-devkit/build-angular:protractor", + "options": { + "protractorConfig": "./protractor.conf.js", + "devServerTarget": "edge-completer:serve" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "e2e/tsconfig.e2e.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } + } + }, + "defaultProject": "edge-completer", + "schematics": { + "@schematics/angular:component": { + "prefix": "app", + "styleext": "css" + }, + "@schematics/angular:directive": { + "prefix": "app" + } + } +} \ No newline at end of file From f8125a35c3cdd2fb8ec8b30117d662361fb55300 Mon Sep 17 00:00:00 2001 From: Lucas Amorim Date: Fri, 12 Jul 2019 16:01:14 -0300 Subject: [PATCH 3/5] =?UTF-8?q?atualiza=C3=A7=C3=A3o=20para=20o=20angular?= =?UTF-8?q?=208?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- .../directives/ctr-input.directive.ts | 4 ++-- .../edge-completer/directives/ctr-list.directive.ts | 13 +++++++------ src/app/edge-completer/edge-completer.component.ts | 4 ++-- src/app/edge-completer/shared/local-data.ts | 5 +++-- 5 files changed, 15 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index 82644f1..1a1ef30 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ "zone.js": "^0.9.1" }, "devDependencies": { - "@angular-devkit/build-angular": "~0.13.0", + "@angular-devkit/build-angular": "^0.801.1", "@angular/cli": "^8.1.1", "@angular/compiler-cli": "^8.1.1", "@angular/language-service": "^8.1.1", diff --git a/src/app/edge-completer/directives/ctr-input.directive.ts b/src/app/edge-completer/directives/ctr-input.directive.ts index 1bd776c..f2daef2 100644 --- a/src/app/edge-completer/directives/ctr-input.directive.ts +++ b/src/app/edge-completer/directives/ctr-input.directive.ts @@ -4,7 +4,7 @@ import { NgModel } from '@angular/forms'; import { CtrCompleterDirective } from './ctr-completer.directive'; import { CompleterItem } from '../shared/completer-item'; import { isNil } from '../shared/globals'; - +import { timer } from 'rxjs'; @@ -170,7 +170,7 @@ export class CtrInputDirective { } if (this.completer.isOpen) { - this.blurTimer = Observable.timer(200).subscribe(() => this.doBlur()); + this.blurTimer = timer(200).subscribe(() => this.doBlur()); } } diff --git a/src/app/edge-completer/directives/ctr-list.directive.ts b/src/app/edge-completer/directives/ctr-list.directive.ts index 7e86178..bd5d2b9 100644 --- a/src/app/edge-completer/directives/ctr-list.directive.ts +++ b/src/app/edge-completer/directives/ctr-list.directive.ts @@ -2,12 +2,13 @@ import { ChangeDetectorRef, Directive, EmbeddedViewRef, Host, Input, OnInit, TemplateRef, ViewContainerRef } from '@angular/core'; -import { Observable , Subscription } from 'rxjs'; +import { Observable , Subscription, timer, of } from 'rxjs'; import { CompleterItem } from '../shared/completer-item'; import { CLEAR_TIMEOUT, isNil, MIN_SEARCH_LENGTH, PAUSE } from '../shared/globals'; import { CompleterList, CtrCompleterDirective } from './ctr-completer.directive'; import { CompleterData } from '../shared/completer-data'; +import {catchError} from 'rxjs/operators'; export class CtrListContext { @@ -95,7 +96,7 @@ export class CtrListDirective implements OnInit, CompleterList { if (this.clearTimer) { this.clearTimer.unsubscribe(); } - this.searchTimer = Observable.timer(this.ctrListPause).subscribe(() => { + this.searchTimer = timer(this.ctrListPause).subscribe(() => { this.searchTimerComplete(term); }); } else if (!isNil(term) && term.length < this.ctrListMinSearchLength) { @@ -108,7 +109,7 @@ export class CtrListDirective implements OnInit, CompleterList { if (this.searchTimer) { this.searchTimer.unsubscribe(); } - this.clearTimer = Observable.timer(CLEAR_TIMEOUT).subscribe(() => { + this.clearTimer = timer(CLEAR_TIMEOUT).subscribe(() => { this._clear(); }); } @@ -187,11 +188,11 @@ export class CtrListDirective implements OnInit, CompleterList { private dataServiceSubscribe() { if (this._dataService) { this._dataService - .catch(err => { + .pipe(catchError(err => { console.error(err); console.error('Unexpected error in dataService: errors should be handled by the dataService Observable'); - return []; - }) + return of([]); + })) .subscribe(results => { this.ctx.searchInitialized = true; this.ctx.searching = false; diff --git a/src/app/edge-completer/edge-completer.component.ts b/src/app/edge-completer/edge-completer.component.ts index ad76d8f..ab29307 100644 --- a/src/app/edge-completer/edge-completer.component.ts +++ b/src/app/edge-completer/edge-completer.component.ts @@ -112,10 +112,10 @@ export class EdgeCompleterComponent implements OnInit, ControlValueAccessor, Aft public keydown: EventEmitter = new EventEmitter(); - @ViewChild(CtrCompleterDirective) + @ViewChild(CtrCompleterDirective, {static: true}) public completer: CtrCompleterDirective; - @ViewChild('ctrInput') + @ViewChild('ctrInput', {static: false}) public ctrInput: ElementRef; diff --git a/src/app/edge-completer/shared/local-data.ts b/src/app/edge-completer/shared/local-data.ts index cd34060..d1cb3b3 100644 --- a/src/app/edge-completer/shared/local-data.ts +++ b/src/app/edge-completer/shared/local-data.ts @@ -2,8 +2,9 @@ import { EventEmitter, Injectable } from '@angular/core'; import { CompleterBaseData } from './completer-base-data'; -import { Observable } from 'rxjs'; +import { Observable, of } from 'rxjs'; import { CompleterItem } from './completer-item'; +import {catchError} from 'rxjs/operators'; @Injectable() export class LocalData extends CompleterBaseData { @@ -21,7 +22,7 @@ export class LocalData extends CompleterBaseData { if (data instanceof Observable) { const data$ = >data; data$ - .catch(() => []) + .pipe(catchError(() => of([]))) .subscribe((res) => { this._data = res; if (this.savedTerm) { From 9fa4de58de9797b08dcd43a6811221690cf6f78a Mon Sep 17 00:00:00 2001 From: Lucas Amorim Date: Fri, 19 Jul 2019 12:39:57 -0300 Subject: [PATCH 4/5] =?UTF-8?q?atualiza=C3=A7=C3=A3o=20para=20o=20angular?= =?UTF-8?q?=208?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ng-package.json | 3 ++- package.json | 3 +-- src/app/edge-completer/directives/ctr-list.directive.ts | 8 +++++--- src/app/edge-completer/edge-completer.component.html | 1 + src/app/edge-completer/edge-completer.component.ts | 5 ++++- 5 files changed, 13 insertions(+), 7 deletions(-) diff --git a/ng-package.json b/ng-package.json index 46c4e08..56987c1 100644 --- a/ng-package.json +++ b/ng-package.json @@ -2,5 +2,6 @@ "$schema": "./node_modules/ng-packagr/ng-package.schema.json", "lib": { "entryFile": "public_api.ts" - } + }, + "whitelistedNonPeerDependencies": ["."] } diff --git a/package.json b/package.json index 1a1ef30..3776016 100644 --- a/package.json +++ b/package.json @@ -10,11 +10,10 @@ "lint": "ng lint", "e2e": "ng e2e", "packagr": "ng-packagr -p ng-package.json && cp -R src/assets dist/assets", - "packagr-win": "ng-packagr -p ng-package.json && xcopy /E src\\assets dist\\assets\\ && cd dist && rmdir /Q /S node_modules && npm pack" + "packagr-win": "ng-packagr -p ng-package.json && xcopy /E src\\assets dist\\assets\\ && cd dist && npm pack" }, "private": false, "dependencies": { - "@angular/animations": "^8.1.1", "@angular/common": "^8.1.1", "@angular/compiler": "^8.1.1", "@angular/core": "^8.1.1", diff --git a/src/app/edge-completer/directives/ctr-list.directive.ts b/src/app/edge-completer/directives/ctr-list.directive.ts index bd5d2b9..e8fe5b7 100644 --- a/src/app/edge-completer/directives/ctr-list.directive.ts +++ b/src/app/edge-completer/directives/ctr-list.directive.ts @@ -35,6 +35,9 @@ export class CtrListDirective implements OnInit, CompleterList { @Input() public ctrListDisplaySearching = true; + @Input() + public ctrListCd: ChangeDetectorRef; + private _dataService: CompleterData; // private results: CompleterItem[] = []; private term: string | null = null; @@ -48,8 +51,7 @@ export class CtrListDirective implements OnInit, CompleterList { constructor( @Host() private completer: CtrCompleterDirective, private templateRef: TemplateRef, - private viewContainer: ViewContainerRef, - private cd: ChangeDetectorRef) { } + private viewContainer: ViewContainerRef) { } public ngOnInit() { this.completer.registerList(this); @@ -163,7 +165,7 @@ export class CtrListDirective implements OnInit, CompleterList { this.viewRef!.context.searchInitialized = this.ctx.searchInitialized; this.viewRef.detectChanges(); } - this.cd.markForCheck(); + this.ctrListCd.markForCheck(); } private getBestMatchIndex() { diff --git a/src/app/edge-completer/edge-completer.component.html b/src/app/edge-completer/edge-completer.component.html index be7548a..591ef54 100644 --- a/src/app/edge-completer/edge-completer.component.html +++ b/src/app/edge-completer/edge-completer.component.html @@ -10,6 +10,7 @@