diff --git a/.browserslistrc b/.browserslistrc index e228fa62..4f9ac269 100644 --- a/.browserslistrc +++ b/.browserslistrc @@ -14,4 +14,3 @@ last 2 Edge major versions last 2 Safari major versions last 2 iOS major versions Firefox ESR -IE 11 # Angular supports IE 11 only as an opt-in. To opt-out, add the 'not' prefix on this line. diff --git a/.editorconfig b/.editorconfig index 22e0018f..0a592d43 100644 --- a/.editorconfig +++ b/.editorconfig @@ -9,6 +9,9 @@ indent_size = 2 insert_final_newline = true trim_trailing_whitespace = true +[*.ts] +quote_type = single + [*.md] max_line_length = off trim_trailing_whitespace = false diff --git a/.gitignore b/.gitignore index b9052a77..8f01f050 100644 --- a/.gitignore +++ b/.gitignore @@ -1,22 +1,25 @@ # See http://help.github.com/ignore-files/ for more about ignoring files. -# compiled output +# Compiled output /dist /tmp /out-tsc # Only exists if Bazel was run /bazel-out -# dependencies +# Node /node_modules +npm-debug.log +yarn-error.log package-lock.json +yarn.lock # profiling files chrome-profiler-events*.json speed-measure-plugin*.json # IDEs and editors -/.idea +.idea/ .project .classpath .c9/ @@ -24,7 +27,7 @@ speed-measure-plugin*.json .settings/ *.sublime-workspace -# IDE - VSCode +# Visual Studio Code .vscode/* !.vscode/settings.json !.vscode/tasks.json @@ -32,16 +35,15 @@ speed-measure-plugin*.json !.vscode/extensions.json .history/* -# misc -/.sass-cache +# Miscellaneous +/.angular/cache +.sass-cache/ /connect.lock /coverage /libpeerconnection.log -npm-debug.log -yarn-error.log testem.log /typings -# System Files +# System files .DS_Store Thumbs.db diff --git a/CHANGELOG.md b/CHANGELOG.md index b41e7c81..2df85c8c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,90 @@ ### [@coreui/angular](https://coreui.io/) changelog +##### `v2.13.0` + +- update to `Angular 13.3` + +###### dependencies update +- update `@angular/animations` to `^13.3.0` +- update `@angular/common` to `^13.3.0` +- update `@angular/compiler` to `^13.3.0` +- update `@angular/core` to `^13.3.0` +- update `@angular/forms` to `^13.3.0` +- update `@angular/localize` to `^13.3.0` +- update `@angular/platform-browser` to `^13.3.0` +- update `@angular/platform-browser-dynamic` to `^13.3.0` +- update `@angular/router` to `^13.3.0` +- update `rxjs` to `^7.5.5` +- update `@angular-devkit/build-angular` to `^13.3.0` +- update `@angular/cli` to `^13.3.0` +- update `@angular/compiler-cli` to `^13.3.0` +- update `@angular/language-service` to `^13.3.0` +- update `@types/jasmine` to `^3.10.4` +- update `@types/node` to `^16.11.26` +- update `jasmine-core` to `~4.0.1` +- update `karma-coverage` to `~2.1.1` +- update `ng-packagr` to `^13.3.0` +- update `typescript` to `~4.6.2` +- update `node` to `^14.15.0 || >=16.10.0` + +##### `v2.12.0` + +- update to `Angular 12.2` +- refactor(library): typings, api surface +- refactor(app): minor fixes + +###### dependencies update +- update `@angular/animations` to `^12.2.16` +- update `@angular/common` to `^12.2.16` +- update `@angular/compiler` to `^12.2.16` +- update `@angular/core` to `^12.2.16` +- update `@angular/forms` to `^12.2.16` +- update `@angular/localize` to `^12.2.16` +- update `@angular/platform-browser` to `^12.2.16` +- update `@angular/platform-browser-dynamic` to `^12.2.16` +- update `@angular/router` to `^12.2.16` +- update `zone.js` to `~0.11.4` +- update `@angular-devkit/build-angular` to `^12.2.16` +- update `@angular/cli` to `^12.2.16` +- update `@angular/compiler-cli` to `^12.2.16` +- update `@angular/language-service` to `^12.2.16` +- update `@types/jasminewd2` to `^2.0.10` +- update `jasmine-spec-reporter` to `~7.0.0` +- update `karma` to `^6.3.17` +- update `ng-packagr` to `^12.2.7` +- update `typescript` to `~4.3.5` + +##### `v2.11.3` + +- ##### `update to Angular 11.2.14` + +###### dependencies update +- update `@angular/animations` to `^11.2.14` +- update `@angular/common` to `^11.2.14` +- update `@angular/compiler` to `^11.2.14` +- update `@angular/core` to `^11.2.14` +- update `@angular/forms` to `^11.2.14` +- update `@angular/localize` to `^11.2.14` +- update `@angular/platform-browser` to `^11.2.14` +- update `@angular/platform-browser-dynamic` to `^11.2.14` +- update `@angular/router` to `^11.2.14` +- update `rxjs` to `^6.6.7` +- update `tslib` to `^2.3.1` +- update `zone.js` to `^0.11.5` +- update `@angular-devkit/build-angular` to `^0.1102.18` +- update `@angular/cli` to `^11.2.18` +- update `@angular/compiler-cli` to `^11.2.14` +- update `@angular/language-service` to `^11.2.14` +- update `@types/jasmine` to `^3.6.11` +- update `@types/node` to `^14.18.12` +- update `codelyzer` to `^6.0.2` +- update `jasmine-core` to `~3.10.1` +- update `karma-chrome-launcher` to `~3.1.1` +- update `karma-jasmine-html-reporter` to `^1.7.0` +- update `ngx-perfect-scrollbar` to `^10.1.1` +- update `shelljs` to `^0.8.5` +- update `typescript` to `~4.0.8` + ##### `v2.11.2` - ##### `update to Angular 11.2` diff --git a/README.md b/README.md index f9631017..f995290b 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,27 @@ # [@coreui/angular](https://coreui.io/angular) -[![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] -[![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] -![angular](https://img.shields.io/badge/angular-^11.2.0-lightgrey.svg?style=flat-square&logo=angular) -[![npm-coreui-angular-next][npm-coreui-angular-badge-next]][npm-coreui-angular] +![angular](https://img.shields.io/badge/angular-^13.3.0-lightgrey.svg?style=flat-square&logo=angular) +[![npm package][npm-coreui-angular-badge-v2]][npm-coreui-angular] +[![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] +[![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] [![@coreui coreui](https://img.shields.io/badge/@coreui%20-coreui-lightgrey.svg?style=flat-square)](https://github.com/coreui/coreui) +[![npm package][npm-coreui-badge-v2]][npm-coreui] [![npm package][npm-coreui-badge]][npm-coreui] -[![NPM downloads][npm-coreui-download]][npm-coreui] +[![NPM downloads][npm-coreui-download]][npm-coreui] + [npm-coreui-angular]: https://www.npmjs.com/package/@coreui/angular -[npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red +[npm-coreui-angular-badge-v2]: https://img.shields.io/npm/v/@coreui/angular/v2-lts?style=flat-square&color=red +[npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red [npm-coreui-angular-badge-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square&color=red [npm-coreui-angular-download]: https://img.shields.io/npm/dm/@coreui/angular.svg?style=flat-square [npm-coreui-angular-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square [npm-coreui]: https://www.npmjs.com/package/@coreui/coreui -[npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui.png?style=flat-square +[npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui/latest?style=flat-square +[npm-coreui-badge-v2]: https://img.shields.io/npm/v/@coreui/coreui/v2-lts?style=flat-square [npm-coreui-download]: https://img.shields.io/npm/dm/@coreui/coreui.svg?style=flat-square -# CoreUI for Angular 11 - Free WebApp UI Kit built on top of Bootstrap 4 [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=CoreUI%20-%20Free%20Bootstrap%204%20Admin%20Template%20&url=https://coreui.io&hashtags=,admin,template,dashboard,panel,free,angular,react,vue) +# CoreUI for Angular 13 - Free WebApp UI Kit built on top of Bootstrap 4 [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=CoreUI%20-%20Free%20Bootstrap%204%20Admin%20Template%20&url=https://coreui.io&hashtags=,admin,template,dashboard,panel,free,angular,react,vue) Please help us on [Product Hunt](https://www.producthunt.com/posts/coreui-open-source-bootstrap-4-admin-template-with-angular-2-react-js-vue-js-support) and [Designer News](https://www.designernews.co/stories/81127). Thanks in advance! @@ -46,17 +50,12 @@ CoreUI is an Open Source UI Kit built on top of Bootstrap 4. CoreUI is the faste * [CoreUI Free Angular Admin Template](https://github.com/coreui/coreui-free-angular-admin-template) * 💪 [CoreUI Pro Angular Admin Template](https://coreui.io/pro/angular/) -## Admin Templates built on top of CoreUI Pro - -| CoreUI Pro | Prime | Root | Alba | Leaf | -| --- | --- | --- | --- | --- | -| [![CoreUI Pro Admin Template](https://coreui.io/assets/img/example-coureui.jpg)](https://coreui.io/pro/angular/)| [![Prime Admin Template](https://coreui.io/assets/img/responsive-prime.png)](https://coreui.io/admin-templates/angular/prime/?support=1)| [![Root Admin Template](https://coreui.io/assets/img/responsive-root.png)](https://coreui.io/admin-templates/angular/root/?support=1)| [![Alba Admin Template](https://coreui.io/assets/img/responsive-alba.png)](https://coreui.io/admin-templates/angular/alba/?support=1)| [![Leaf Admin Template](https://coreui.io/assets/img/responsive-leaf.png)](https://coreui.io/admin-templates/angular/leaf/?support=1) #### Prerequisites Before you begin, make sure your development environment includes `Node.js®` and an `npm` package manager. ###### Node.js -Angular 11 requires `Node.js` version 10.13 or later. +Angular 13 requires `Node.js` version 14.15 or later. - To check your version, run `node -v` in a terminal/console window. - To get `Node.js`, go to [nodejs.org](https://nodejs.org/). @@ -67,7 +66,7 @@ Install the Angular CLI globally using a terminal/console window. npm install -g @angular/cli ``` -##### Update to Angular 11 +##### Update to Angular 13 see: [https://update.angular.io](https://update.angular.io) ## CoreUI Installation @@ -110,7 +109,7 @@ Within the download you'll find the following directories and files, logically g coreui/ ├── build/ ├── dist/ -├── scripts/ +├── projects/ └── src/ ``` @@ -150,11 +149,11 @@ Get updates on CoreUI's development and chat with the project maintainers and co ## Copyright and license -copyright 2017-2021 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-angular/blob/master/LICENSE). -There is only one limitation you can't can’t re-distribute the CoreUI as stock. You can’t do this if you modify the CoreUI. In past we faced some problems with persons who tried to sell CoreUI based templates. +copyright 2017-2022 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-angular/blob/master/LICENSE). +There is only one limitation - you can’t re-distribute the CoreUI as stock. You can’t do this if you modify the CoreUI. In the past we faced some problems with persons who tried to sell CoreUI based templates. ## Support CoreUI Development CoreUI is an MIT licensed open source project and completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing. You can support development by donating on [PayPal](https://www.paypal.me/holeczek), buying [CoreUI Pro Version](https://coreui.io/pro) or buying one of our [premium admin templates](https://genesisui.com/?support=1). -As of now I am exploring the possibility of working on CoreUI fulltime - if you are a business that is building core products using CoreUI, I am also open to conversations regarding custom sponsorship / consulting arrangements. Get in touch on [Twitter](https://twitter.com/lukaszholeczek). +As of now I am exploring the possibility of working on CoreUI full-time - if you are a business that is building core products using CoreUI, I am also open to conversations regarding custom sponsorship / consulting arrangements. Get in touch on [Twitter](https://twitter.com/lukaszholeczek). diff --git a/angular.json b/angular.json index a13abe29..930f9931 100644 --- a/angular.json +++ b/angular.json @@ -1,23 +1,34 @@ { "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "cli": { + "analytics": false + }, "version": 1, "newProjectRoot": "projects", "projects": { "coreui": { + "projectType": "application", + "schematics": { + "@schematics/angular:component": { + "style": "scss" + }, + "@schematics/angular:application": { + "strict": true + } + }, "root": "", "sourceRoot": "src", - "projectType": "application", "prefix": "app", - "schematics": {}, "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { - "outputPath": "dist/@coreui", + "outputPath": "dist/coreui/demo", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.app.json", + "inlineStyleLanguage": "scss", "assets": [ "src/favicon.ico", "src/assets" @@ -31,9 +42,15 @@ "configurations": { "production": { "budgets": [ + { + "type": "initial", + "maximumWarning": "500kb", + "maximumError": "1mb" + }, { "type": "anyComponentStyle", - "maximumWarning": "6kb" + "maximumWarning": "2kb", + "maximumError": "6kb" } ], "fileReplacements": [ @@ -42,27 +59,30 @@ "with": "src/environments/environment.prod.ts" } ], - "optimization": true, - "outputHashing": "all", - "sourceMap": false, - "namedChunks": false, - "aot": true, - "extractLicenses": true, - "vendorChunk": false, - "buildOptimizer": true + "outputHashing": "all" + }, + "development": { + "buildOptimizer": false, + "optimization": false, + "vendorChunk": true, + "extractLicenses": false, + "sourceMap": true, + "namedChunks": true } - } + }, + "defaultConfiguration": "production" }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", - "options": { - "browserTarget": "coreui:build" - }, "configurations": { "production": { "browserTarget": "coreui:build:production" + }, + "development": { + "browserTarget": "coreui:build:development" } - } + }, + "defaultConfiguration": "development" }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", @@ -77,6 +97,7 @@ "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", + "inlineStyleLanguage": "scss", "styles": [ "src/scss/style.scss" ], @@ -86,18 +107,6 @@ "src/assets" ] } - }, - "lint": { - "builder": "@angular-devkit/build-angular:tslint", - "options": { - "tsConfig": [ - "src/tsconfig.app.json", - "src/tsconfig.spec.json" - ], - "exclude": [ - "**/node_modules/**" - ] - } } } }, @@ -111,15 +120,6 @@ "protractorConfig": "e2e/protractor.conf.js", "devServerTarget": "coreui:serve" } - }, - "lint": { - "builder": "@angular-devkit/build-angular:tslint", - "options": { - "tsConfig": "e2e/tsconfig.e2e.json", - "exclude": [ - "**/node_modules/**" - ] - } } } }, @@ -132,15 +132,17 @@ "build": { "builder": "@angular-devkit/build-angular:ng-packagr", "options": { - "tsConfig": "projects/coreui/angular/tsconfig.lib.json", "project": "projects/coreui/angular/ng-package.json" }, "configurations": { "production": { - "project": "projects/coreui/angular/ng-package.prod.json", "tsConfig": "projects/coreui/angular/tsconfig.lib.prod.json" + }, + "development": { + "tsConfig": "projects/coreui/angular/tsconfig.lib.json" } - } + }, + "defaultConfiguration": "production" }, "test": { "builder": "@angular-devkit/build-angular:karma", @@ -149,30 +151,9 @@ "tsConfig": "projects/coreui/angular/tsconfig.spec.json", "karmaConfig": "projects/coreui/angular/karma.conf.js" } - }, - "lint": { - "builder": "@angular-devkit/build-angular:tslint", - "options": { - "tsConfig": [ - "projects/coreui/angular/tsconfig.lib.json", - "projects/coreui/angular/tsconfig.spec.json" - ], - "exclude": [ - "**/node_modules/**" - ] - } } } } }, - "cli": { - "analytics": false - }, - "defaultProject": "coreui", - "schematics": { - "@schematics/angular:component": { - "style": "scss" - } - } - + "defaultProject": "coreui" } diff --git a/e2e/src/app.po.ts b/e2e/src/app.po.ts index 487aaf7f..369acc17 100644 --- a/e2e/src/app.po.ts +++ b/e2e/src/app.po.ts @@ -16,7 +16,7 @@ export class AppDashboard { getBody() { return element(by.xpath('/html/body')); } - getByCss(selector) { + getByCss(selector: string) { return element.all(by.css(selector)); } diff --git a/package.json b/package.json index b1570e43..7184da6b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@coreui/angular-dev", - "version": "2.11.2", + "version": "2.13.0", "license": "MIT", "author": { "name": "Łukasz Holeczek", @@ -16,63 +16,60 @@ ], "scripts": { "ng": "ng", - "postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points", "build-lib:dev": "ng build @coreui/angular --watch", - "build-lib:prod": "ng build @coreui/angular --prod", + "build-lib:prod": "ng build @coreui/angular --configuration production", "test-lib:dev": "ng test @coreui/angular", "test-lib:prod": "ng test @coreui/angular --karmaConfig=projects/coreui/angular/karma.conf.github.js", - "prestart": "npm run postinstall", "start": "ng serve", "test": "ng test", "lint": "ng lint", - "pree2e": "npm run postinstall", "e2e": "ng e2e", - "publish": "cd dist/@coreui/angular/ && npm publish --tag next --dry-run", + "prepublish-lib": "ng test @coreui/angular --watch=false && ng e2e && ng build @coreui/angular --configuration production", + "publish-lib": "cd dist/@coreui/angular/ && npm publish --tag v2-lts --dry-run", "link": "cd dist/@coreui/angular/ && npm link", "release-version": "node build/change-version.js" }, "private": true, "dependencies": { - "@angular/animations": "^11.2.2", - "@angular/common": "^11.2.2", - "@angular/compiler": "^11.2.2", - "@angular/core": "^11.2.2", - "@angular/forms": "^11.2.2", - "@angular/localize": "^11.2.2", - "@angular/platform-browser": "^11.2.2", - "@angular/platform-browser-dynamic": "^11.2.2", - "@angular/router": "^11.2.2", - "rxjs": "^6.6.3", - "tslib": "^2.1.0", - "zone.js": "^0.11.4" + "@angular/animations": "^13.3.0", + "@angular/common": "^13.3.0", + "@angular/compiler": "^13.3.0", + "@angular/core": "^13.3.0", + "@angular/forms": "^13.3.0", + "@angular/localize": "^13.3.0", + "@angular/platform-browser": "^13.3.0", + "@angular/platform-browser-dynamic": "^13.3.0", + "@angular/router": "^13.3.0", + "rxjs": "^7.5.5", + "tslib": "^2.3.1", + "zone.js": "~0.11.4" }, "devDependencies": { - "@angular-devkit/build-angular": "^0.1102.1", - "@angular/cli": "^11.2.1", - "@angular/compiler-cli": "^11.2.2", - "@angular/language-service": "^11.2.2", + "@angular-devkit/build-angular": "^13.3.0", + "@angular/cli": "^13.3.0", + "@angular/compiler-cli": "^13.3.0", + "@angular/language-service": "^13.3.0", "@coreui/coreui": "^2.1.16", - "@types/jasmine": "^3.6.4", - "@types/node": "^14.14.31", - "codelyzer": "^6.0.1", - "jasmine-core": "~3.6.0", - "jasmine-spec-reporter": "~5.0.2", - "karma": "^5.2.3", - "karma-chrome-launcher": "~3.1.0", - "karma-coverage": "~2.0.3", + "@types/jasmine": "^3.10.4", + "@types/jasminewd2": "^2.0.10", + "@types/node": "^16.11.26", + "jasmine-core": "~4.0.1", + "jasmine-spec-reporter": "~7.0.0", + "karma": "^6.3.17", + "karma-chrome-launcher": "~3.1.1", + "karma-coverage": "~2.1.1", "karma-jasmine": "~4.0.1", - "karma-jasmine-html-reporter": "^1.5.4", - "ng-packagr": "^11.2.4", - "ngx-perfect-scrollbar": "^10.1.0", + "karma-jasmine-html-reporter": "^1.7.0", + "ng-packagr": "^13.3.0", + "ngx-perfect-scrollbar": "^10.1.1", "protractor": "~7.0.0", - "shelljs": "^0.8.4", + "shelljs": "^0.8.5", "simple-line-icons": "^2.5.5", "ts-node": "^9.1.1", - "tslint": "~6.1.3", - "typescript": "~4.0.5" + "typescript": "~4.6.2" }, "engines": { - "node": ">= 10.13", - "npm": ">= 6" + "node": "^14.15.0 || >=16.10.0", + "npm": ">= 8" } } diff --git a/projects/coreui/angular/.browserslistrc b/projects/coreui/angular/.browserslistrc new file mode 100644 index 00000000..4f9ac269 --- /dev/null +++ b/projects/coreui/angular/.browserslistrc @@ -0,0 +1,16 @@ +# 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 diff --git a/projects/coreui/angular/README.md b/projects/coreui/angular/README.md index 9f731e5c..1d61e8df 100644 --- a/projects/coreui/angular/README.md +++ b/projects/coreui/angular/README.md @@ -1,21 +1,24 @@ # [@coreui/angular](https://coreui.io/angular) -[![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] -[![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] -![angular](https://img.shields.io/badge/angular-^11.2.0-lightgrey.svg?style=flat-square&logo=angular) -[![npm-coreui-angular-next][npm-coreui-angular-badge-next]][npm-coreui-angular] +![angular](https://img.shields.io/badge/angular-^13.3.0-lightgrey.svg?style=flat-square&logo=angular) +[![npm package][npm-coreui-angular-badge-v2]][npm-coreui-angular] +[![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] +[![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] [![@coreui coreui](https://img.shields.io/badge/@coreui%20-coreui-lightgrey.svg?style=flat-square)](https://github.com/coreui/coreui) +[![npm package][npm-coreui-badge-v2]][npm-coreui] [![npm package][npm-coreui-badge]][npm-coreui] [![NPM downloads][npm-coreui-download]][npm-coreui] [npm-coreui-angular]: https://www.npmjs.com/package/@coreui/angular -[npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red +[npm-coreui-angular-badge-v2]: https://img.shields.io/npm/v/@coreui/angular/v2-lts?style=flat-square&color=red +[npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red [npm-coreui-angular-badge-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square&color=red [npm-coreui-angular-download]: https://img.shields.io/npm/dm/@coreui/angular.svg?style=flat-square [npm-coreui-angular-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square [npm-coreui]: https://www.npmjs.com/package/@coreui/coreui -[npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui.png?style=flat-square +[npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui/latest?style=flat-square +[npm-coreui-badge-v2]: https://img.shields.io/npm/v/@coreui/coreui/v2-lts?style=flat-square [npm-coreui-download]: https://img.shields.io/npm/dm/@coreui/coreui.svg?style=flat-square > [@coreui/angular](https://coreui.io/angular) v2 library project @@ -26,7 +29,7 @@ Before you begin, make sure your development environment includes `Node.js®` and an `npm` package manager. ###### Node.js -Angular 11 requires `Node.js` version 10.13 or later. +Angular 13 requires `Node.js` version 14.15 or later. - To check your version, run `node -v` in a terminal/console window. - To get `Node.js`, go to [nodejs.org](https://nodejs.org/). @@ -34,10 +37,10 @@ Angular 11 requires `Node.js` version 10.13 or later. ###### Angular CLI Install the Angular CLI globally using a terminal/console window. ```bash -npm install -g @angular/cli +npm install -g @angular/cli@13 ``` -##### Update to Angular 11 +##### Update to Angular 13 see: [https://update.angular.io](https://update.angular.io) ## CoreUI Installation diff --git a/projects/coreui/angular/ng-package.json b/projects/coreui/angular/ng-package.json index 38650a81..1a456e6d 100644 --- a/projects/coreui/angular/ng-package.json +++ b/projects/coreui/angular/ng-package.json @@ -1,8 +1,8 @@ { "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", "dest": "../../../dist/@coreui/angular", - "deleteDestPath": true, + "deleteDestPath": true, "lib": { "entryFile": "src/public-api.ts" } -} \ No newline at end of file +} diff --git a/projects/coreui/angular/package.json b/projects/coreui/angular/package.json index 6491e212..f5cc208a 100644 --- a/projects/coreui/angular/package.json +++ b/projects/coreui/angular/package.json @@ -1,7 +1,7 @@ { "name": "@coreui/angular", - "version": "2.11.2", - "description": "CoreUI Angular 11 Bootstrap 4 components", + "version": "2.13.0", + "description": "CoreUI Angular 13 Bootstrap 4 components", "license": "MIT", "homepage": "https://coreui.io/angular", "author": { @@ -17,12 +17,12 @@ } ], "dependencies": { - "tslib": "^2.0.0" + "tslib": "^2.3.0" }, "peerDependencies": { - "@angular/common": "^11.0.0", - "@angular/core": "^11.0.0", - "@angular/router": "^11.0.0" + "@angular/common": "^13.0.0", + "@angular/core": "^13.0.0", + "@angular/router": "^13.0.0" }, "repository": { "type": "git", diff --git a/projects/coreui/angular/src/lib/aside/app-aside.component.ts b/projects/coreui/angular/src/lib/aside/app-aside.component.ts index d0dce92c..1822290d 100644 --- a/projects/coreui/angular/src/lib/aside/app-aside.component.ts +++ b/projects/coreui/angular/src/lib/aside/app-aside.component.ts @@ -9,8 +9,8 @@ import { asideMenuCssClasses } from '../shared'; }) export class AppAsideComponent implements OnInit, OnDestroy { @Input() display: any; - @Input() fixed: boolean; - @Input() offCanvas: boolean; + @Input() fixed?: boolean; + @Input() offCanvas?: boolean; private readonly fixedClass = 'aside-menu-fixed'; @@ -31,13 +31,13 @@ export class AppAsideComponent implements OnInit, OnDestroy { this.renderer.removeClass(this.document.body, this.fixedClass); } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, this.fixedClass); } } - isOffCanvas(offCanvas: boolean = this.offCanvas): void { + isOffCanvas(offCanvas = this.offCanvas): void { if (offCanvas) { this.renderer.addClass(this.document.body, 'aside-menu-off-canvas'); } diff --git a/projects/coreui/angular/src/lib/aside/app-aside.module.ts b/projects/coreui/angular/src/lib/aside/app-aside.module.ts index d6846f6e..ff1554c3 100644 --- a/projects/coreui/angular/src/lib/aside/app-aside.module.ts +++ b/projects/coreui/angular/src/lib/aside/app-aside.module.ts @@ -10,8 +10,7 @@ import { AppAsideComponent } from './app-aside.component'; LayoutModule ], exports: [ - AppAsideComponent, - LayoutModule + AppAsideComponent ], declarations: [ AppAsideComponent diff --git a/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts b/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts index 0cab482e..771f968a 100644 --- a/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts +++ b/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts @@ -3,6 +3,7 @@ import {DOCUMENT} from '@angular/common'; import {AppBreadcrumbService} from './app-breadcrumb.service'; import {Replace} from '../shared'; +import { Observable } from 'rxjs'; @Component({ selector: 'app-breadcrumb', @@ -18,8 +19,8 @@ import {Replace} from '../shared'; ` }) export class AppBreadcrumbComponent implements OnInit, OnDestroy { - @Input() fixed: boolean; - public breadcrumbs; + @Input() fixed?: boolean; + public breadcrumbs?: Observable; private readonly fixedClass = 'breadcrumb-fixed'; constructor( @@ -39,7 +40,7 @@ export class AppBreadcrumbComponent implements OnInit, OnDestroy { this.renderer.removeClass(this.document.body, this.fixedClass); } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, this.fixedClass); } diff --git a/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts b/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts index e3ab1dbe..191a7e4a 100644 --- a/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts +++ b/projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts @@ -20,8 +20,8 @@ export class AppBreadcrumbService { this.breadcrumbs = this.breadcrumbSubject.asObservable(); this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event) => { - const breadcrumbs = []; - let currentRoute = this.route.root; + const breadcrumbs: any[] = []; + let currentRoute: ActivatedRoute | null = this.route.root; let url = ''; do { const childrenRoutes = currentRoute.children; diff --git a/projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts b/projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts index 1e37344a..04a96ac6 100644 --- a/projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts +++ b/projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts @@ -2,6 +2,7 @@ import {Component, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2} from import {DOCUMENT} from '@angular/common'; import {AppBreadcrumbService} from './app-breadcrumb.service'; +import { Observable } from 'rxjs'; @Component({ // tslint:disable-next-line:component-selector @@ -9,9 +10,9 @@ import {AppBreadcrumbService} from './app-breadcrumb.service'; templateUrl: './cui-breadcrumb.component.html' }) export class CuiBreadcrumbComponent implements OnInit, OnDestroy { - @Input() fixed: boolean; + @Input() fixed?: boolean; - public breadcrumbs; + public breadcrumbs?: Observable; private readonly fixedClass = 'breadcrumb-fixed'; constructor( @@ -29,7 +30,7 @@ export class CuiBreadcrumbComponent implements OnInit, OnDestroy { this.renderer.removeClass(this.document.body, this.fixedClass); } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, this.fixedClass); } diff --git a/projects/coreui/angular/src/lib/footer/app-footer.component.ts b/projects/coreui/angular/src/lib/footer/app-footer.component.ts index 191d3dd7..64e7aeb7 100644 --- a/projects/coreui/angular/src/lib/footer/app-footer.component.ts +++ b/projects/coreui/angular/src/lib/footer/app-footer.component.ts @@ -6,7 +6,7 @@ import {DOCUMENT} from '@angular/common'; template: `` }) export class AppFooterComponent implements OnInit, OnDestroy { - @Input() fixed: boolean; + @Input() fixed?: boolean; private readonly fixedClass = 'footer-fixed'; @@ -25,7 +25,7 @@ export class AppFooterComponent implements OnInit, OnDestroy { this.renderer.removeClass(this.document.body, this.fixedClass); } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, this.fixedClass); } diff --git a/projects/coreui/angular/src/lib/header/app-header.component.ts b/projects/coreui/angular/src/lib/header/app-header.component.ts index 35a6c706..5104af8c 100644 --- a/projects/coreui/angular/src/lib/header/app-header.component.ts +++ b/projects/coreui/angular/src/lib/header/app-header.component.ts @@ -7,27 +7,27 @@ import { DOCUMENT } from '@angular/common'; }) export class AppHeaderComponent implements OnInit, OnDestroy { - @Input() fixed: boolean; + @Input() fixed?: boolean; @Input() navbarBrand: any; @Input() navbarBrandFull: any; @Input() navbarBrandMinimized: any; @Input() navbarBrandText: any = {icon: '🅲', text: '🅲 CoreUI'}; - @Input() navbarBrandHref: ''; // deprecated, use navbarBrandRouterLink instead + @Input() navbarBrandHref = ''; // deprecated, use navbarBrandRouterLink instead @Input() navbarBrandRouterLink: any[] | string = ''; - @Input() sidebarToggler: string | boolean; - @Input() mobileSidebarToggler: boolean; + @Input() sidebarToggler: string | boolean = 'lg'; + @Input() mobileSidebarToggler = true; - @Input() asideMenuToggler: string | boolean; - @Input() mobileAsideMenuToggler: boolean; + @Input() asideMenuToggler: string | boolean = 'lg'; + @Input() mobileAsideMenuToggler = true; private readonly fixedClass = 'header-fixed'; @HostBinding('class.app-header') appHeaderClass = true; @HostBinding('class.navbar') navbarClass = true; - navbarBrandImg: boolean; + navbarBrandImg!: boolean; private readonly breakpoints = ['xl', 'lg', 'md', 'sm', 'xs']; sidebarTogglerClass = 'd-none d-md-block'; @@ -44,23 +44,23 @@ export class AppHeaderComponent implements OnInit, OnDestroy { this.isFixed(this.fixed); this.navbarBrandImg = Boolean(this.navbarBrand || this.navbarBrandFull || this.navbarBrandMinimized); this.navbarBrandRouterLink = this.navbarBrandRouterLink[0] ? this.navbarBrandRouterLink : this.navbarBrandHref; - this.sidebarTogglerClass = this.setToggerBreakpointClass(this.sidebarToggler as string); - this.sidebarTogglerMobileClass = this.setToggerMobileBreakpointClass(this.sidebarToggler as string); - this.asideTogglerClass = this.setToggerBreakpointClass(this.asideMenuToggler as string); - this.asideTogglerMobileClass = this.setToggerMobileBreakpointClass(this.asideMenuToggler as string); + this.sidebarTogglerClass = this.setTogglerBreakpointClass(this.sidebarToggler as string); + this.sidebarTogglerMobileClass = this.setTogglerMobileBreakpointClass(this.sidebarToggler as string); + this.asideTogglerClass = this.setTogglerBreakpointClass(this.asideMenuToggler as string); + this.asideTogglerMobileClass = this.setTogglerMobileBreakpointClass(this.asideMenuToggler as string); } ngOnDestroy(): void { this.renderer.removeClass(this.document.body, this.fixedClass); } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, this.fixedClass); } } - setToggerBreakpointClass(breakpoint = 'md') { + setTogglerBreakpointClass(breakpoint = 'md') { let togglerClass = 'd-none d-md-block'; if (this.breakpoints.includes(breakpoint)) { const breakpointIndex = this.breakpoints.indexOf(breakpoint); @@ -69,7 +69,7 @@ export class AppHeaderComponent implements OnInit, OnDestroy { return togglerClass; } - setToggerMobileBreakpointClass(breakpoint = 'lg') { + setTogglerMobileBreakpointClass(breakpoint = 'lg') { let togglerClass = 'd-lg-none'; if (this.breakpoints.includes(breakpoint)) { togglerClass = `d-${breakpoint}-none`; diff --git a/projects/coreui/angular/src/lib/header/app-header.module.ts b/projects/coreui/angular/src/lib/header/app-header.module.ts index f1511a31..3dfb30f9 100644 --- a/projects/coreui/angular/src/lib/header/app-header.module.ts +++ b/projects/coreui/angular/src/lib/header/app-header.module.ts @@ -13,7 +13,6 @@ import { AppHeaderComponent } from './app-header.component'; ], exports: [ AppHeaderComponent, - LayoutModule ], declarations: [ AppHeaderComponent diff --git a/projects/coreui/angular/src/lib/shared/index.ts b/projects/coreui/angular/src/lib/shared/index.ts index a6ae18c6..4aaf8f92 100644 --- a/projects/coreui/angular/src/lib/shared/index.ts +++ b/projects/coreui/angular/src/lib/shared/index.ts @@ -1,3 +1 @@ -export * from './classes'; -export * from './layout/index'; -export * from './replace'; +export * from './public_api'; diff --git a/projects/coreui/angular/src/lib/shared/layout/layout.directive.ts b/projects/coreui/angular/src/lib/shared/layout/layout.directive.ts index 71d59697..63399583 100644 --- a/projects/coreui/angular/src/lib/shared/layout/layout.directive.ts +++ b/projects/coreui/angular/src/lib/shared/layout/layout.directive.ts @@ -12,8 +12,8 @@ import { ClassToggler } from '../toggle-classes'; providers: [ClassToggler] }) export class SidebarToggleDirective implements OnInit { - @Input('appSidebarToggler') breakpoint: string; - public bp; + @Input('appSidebarToggler') breakpoint: string | boolean = false; + public bp!: string | boolean; constructor(private classToggler: ClassToggler) {} ngOnInit(): void { this.bp = this.breakpoint; @@ -117,8 +117,8 @@ export class BrandMinimizeDirective { providers: [ClassToggler] }) export class AsideToggleDirective implements OnInit { - @Input('appAsideMenuToggler') breakpoint: string; - public bp; + @Input('appAsideMenuToggler') breakpoint: string | boolean = false; + public bp!: string | boolean; constructor(private classToggler: ClassToggler) {} ngOnInit(): void { this.bp = this.breakpoint; @@ -135,7 +135,7 @@ export class AsideToggleDirective implements OnInit { selector: '[appHtmlAttr]' }) export class HtmlAttributesDirective implements OnInit { - @Input() appHtmlAttr: {[key: string]: string }; + @Input() appHtmlAttr?: {[key: string]: string } = {}; constructor( private renderer: Renderer2, @@ -155,20 +155,22 @@ export class HtmlAttributesDirective implements OnInit { } } - private setStyle(styles) { + private setStyle(styles: any) { for (const style in styles) { - this.renderer.setStyle(this.el.nativeElement, style, styles[style] ); + if (style) { + this.renderer.setStyle(this.el.nativeElement, style, styles[style]); + } } } - private addClass(classes) { + private addClass(classes: string | any[]) { const classArray = (Array.isArray(classes) ? classes : classes.split(' ')); classArray.filter((element) => element.length > 0).forEach(element => { this.renderer.addClass(this.el.nativeElement, element ); }); } - private setAttrib(key, value) { + private setAttrib(key: string, value: string | null) { value !== null ? this.renderer.setAttribute(this.el.nativeElement, key, value ) : this.renderer.removeAttribute(this.el.nativeElement, key); diff --git a/projects/coreui/angular/src/lib/shared/public_api.ts b/projects/coreui/angular/src/lib/shared/public_api.ts new file mode 100644 index 00000000..a2bc9c3f --- /dev/null +++ b/projects/coreui/angular/src/lib/shared/public_api.ts @@ -0,0 +1,12 @@ +export { + AsideToggleDirective, + BrandMinimizeDirective, + MobileSidebarToggleDirective, + SidebarMinimizeDirective, + SidebarToggleDirective, + SidebarOffCanvasCloseDirective, + HtmlAttributesDirective +} from './layout/layout.directive'; +export { LayoutModule } from './layout/layout.module'; +export * from './classes'; +export * from './replace'; diff --git a/projects/coreui/angular/src/lib/shared/replace.ts b/projects/coreui/angular/src/lib/shared/replace.ts index a4db951a..a9dc1f3a 100644 --- a/projects/coreui/angular/src/lib/shared/replace.ts +++ b/projects/coreui/angular/src/lib/shared/replace.ts @@ -1,5 +1,6 @@ export function Replace(el: any): any { const nativeElement: HTMLElement = el.nativeElement; + // @ts-ignore const parentElement: HTMLElement = nativeElement.parentElement; // move all children out of the element while (nativeElement.firstChild) { diff --git a/projects/coreui/angular/src/lib/shared/toggle-classes.ts b/projects/coreui/angular/src/lib/shared/toggle-classes.ts index b0aae207..d9cfe54e 100644 --- a/projects/coreui/angular/src/lib/shared/toggle-classes.ts +++ b/projects/coreui/angular/src/lib/shared/toggle-classes.ts @@ -1,12 +1,12 @@ import {Inject, Injectable, Renderer2} from '@angular/core'; import {DOCUMENT} from '@angular/common'; -const RemoveClasses = (NewClassNames) => { +const RemoveClasses = (NewClassNames: string[]) => { const MatchClasses = NewClassNames.map((Class) => document.body.classList.contains(Class)); return MatchClasses.indexOf(true) !== -1; }; -export const ToggleClasses = (Toggle, ClassNames) => { +export const ToggleClasses = (Toggle: string, ClassNames: string[]) => { const Level = ClassNames.indexOf(Toggle); const NewClassNames = ClassNames.slice(0, Level + 1); @@ -25,12 +25,12 @@ export class ClassToggler { private renderer: Renderer2, ) {} - removeClasses(NewClassNames) { + removeClasses(NewClassNames: string[]) { const MatchClasses = NewClassNames.map((Class) => this.document.body.classList.contains(Class)); return MatchClasses.indexOf(true) !== -1; } - toggleClasses(Toggle, ClassNames) { + toggleClasses(Toggle: string, ClassNames: string[]) { const Level = ClassNames.indexOf(Toggle); const NewClassNames = ClassNames.slice(0, Level + 1); diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts index 4f123d4a..2f0549c4 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts @@ -29,7 +29,7 @@ describe('SidebarNavHelper', () => { expect(service.itemType({divider: true})).toEqual('divider'); expect(service.itemType({title: true})).toEqual('title'); expect(service.itemType({children: []})).toEqual('dropdown'); - expect(service.itemType({label: true})).toEqual('label'); + expect(service.itemType({label: { variant: 'info'}})).toEqual('label'); expect(service.itemType({})).toEqual('empty'); expect(service.itemType({ name: 'Disabled', @@ -46,7 +46,7 @@ describe('SidebarNavHelper', () => { }); it('item hasBadge', () => { - expect(service.hasBadge({badge: {}})).toBeTruthy(); + expect(service.hasBadge({badge: { text: 'badge', variant: 'info'}})).toBeTruthy(); expect(service.hasBadge({})).toBeFalsy(); }); it('item hasIcon', () => { diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts index 02e7d963..849cab90 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts @@ -1,6 +1,8 @@ import { Injectable } from '@angular/core'; +import { RouterTestingModule } from '@angular/router/testing'; import { INavData } from './app-sidebar-nav'; +import { Router } from '@angular/router'; @Injectable() export abstract class SidebarNavService { @@ -13,7 +15,7 @@ export abstract class SidebarNavService { @Injectable() export class SidebarNavHelper { - public itemType(item) { + public itemType(item: INavData) { if (item.divider) { return 'divider'; } else if (item.title) { @@ -24,24 +26,24 @@ export class SidebarNavHelper { return 'label'; } else if (!Object.keys(item).length) { return 'empty'; - } else { - return 'link'; } + return 'link'; } - public isActive(router, item) { + public isActive(router: any, item: INavData) { return router.isActive(item.url, false); } - public hasBadge = (item) => Boolean(item.badge); - public hasIcon = (item) => Boolean(item.icon); + public hasBadge = (item: INavData) => Boolean(item.badge); + public hasIcon = (item: INavData) => Boolean(item.icon); - public getIconClass(item) { + public getIconClass(item: INavData) { const classes = { 'nav-icon': true }; if (this.hasIcon(item)) { const icon = item.icon; + // @ts-ignore classes[icon] = this.hasIcon(item); } return classes; diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.ts index 6c3b9a8c..bfc90dc4 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.ts @@ -1,3 +1,5 @@ +import { IsActiveMatchOptions } from '@angular/router'; + export interface INavAttributes { [propName: string]: any; } @@ -26,7 +28,7 @@ export interface INavLinkProps { skipLocationChange?: boolean; replaceUrl?: boolean; state?: {[k: string]: any}; - routerLinkActiveOptions?: {exact: boolean}; + routerLinkActiveOptions?: {exact: boolean} | IsActiveMatchOptions; routerLinkActive?: string | string[]; } diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.ts index 86a73440..f3dfecba 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.ts @@ -6,7 +6,7 @@ import { Pipe, PipeTransform } from '@angular/core'; export class AppSidebarNavBadgePipe implements PipeTransform { transform(item: any, args?: any): any { - const classes = { + const classes: any = { badge: true }; const variant = `badge-${item.badge.variant}`; diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-divider.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-divider.component.ts index ebc961fc..2408bdea 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-divider.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-divider.component.ts @@ -6,7 +6,7 @@ import { INavData } from '../app-sidebar-nav'; template: `` }) export class AppSidebarNavDividerComponent implements OnInit { - @Input() item: INavData; + @Input() item?: INavData; constructor() {} diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-dropdown.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-dropdown.component.ts index 93f20f97..3be7798b 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-dropdown.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-dropdown.component.ts @@ -1,33 +1,33 @@ -import {Component, Input} from '@angular/core'; - -import {SidebarNavHelper} from '../app-sidebar-nav.service'; -import { INavData } from '../app-sidebar-nav'; - -@Component({ - selector: 'app-sidebar-nav-dropdown, cui-sidebar-nav-dropdown', - template: ` - - - {{item.name}} - {{ item.badge.text }} - - - - `, - styles: [ - '.nav-dropdown-toggle { cursor: pointer; }', - '.nav-dropdown-items { display: block; }' - ], - providers: [ SidebarNavHelper ] -}) -export class AppSidebarNavDropdownComponent { - @Input() item: INavData; - - constructor( - public helper: SidebarNavHelper - ) { } -} +// import {Component, Input} from '@angular/core'; +// +// import {SidebarNavHelper} from '../app-sidebar-nav.service'; +// import { INavData } from '../app-sidebar-nav'; +// +// @Component({ +// selector: 'app-sidebar-nav-dropdown, cui-sidebar-nav-dropdown', +// template: ` +// +// +// {{item.name}} +// {{ item.badge.text }} +// +// +// +// `, +// styles: [ +// '.nav-dropdown-toggle { cursor: pointer; }', +// '.nav-dropdown-items { display: block; }' +// ], +// providers: [ SidebarNavHelper ] +// }) +// export class AppSidebarNavDropdownComponent { +// @Input() item: INavData; +// +// constructor( +// public helper: SidebarNavHelper +// ) { } +// } diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.ts index 529a60f3..9ba1181e 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.ts @@ -6,7 +6,7 @@ import { Pipe, PipeTransform } from '@angular/core'; export class AppSidebarNavIconPipe implements PipeTransform { transform(item: any, args?: any): any { - const classes = { + const classes: any = { 'nav-icon': true }; const icon = item.icon; diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-items.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-items.component.ts index cc90af67..1cfc9302 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-items.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-items.component.ts @@ -53,7 +53,7 @@ import {INavData} from '../app-sidebar-nav'; }) export class AppSidebarNavItemsComponent { - protected _items: INavData[]; + protected _items: INavData[] = []; @Input() set items(items: INavData[]) { @@ -76,3 +76,33 @@ export class AppSidebarNavItemsComponent { } } } + +@Component({ + selector: 'app-sidebar-nav-dropdown, cui-sidebar-nav-dropdown', + template: ` + + + {{item.name}} + {{ item.badge?.text }} + + + + `, + styles: [ + '.nav-dropdown-toggle { cursor: pointer; }', + '.nav-dropdown-items { display: block; }' + ], + providers: [ SidebarNavHelper ] +}) +export class AppSidebarNavDropdownComponent { + @Input() item: INavData = {}; + + constructor( + public helper: SidebarNavHelper + ) { } +} + diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.html b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.html index c124188c..64c8c365 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.html +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.html @@ -3,5 +3,5 @@ [appHtmlAttr]="item.attributes"> {{item.name}} - {{ item.badge.text }} + {{ item.badge?.text }} diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.ts index febffc36..9c56ce67 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.ts @@ -7,7 +7,7 @@ import { INavData } from '../app-sidebar-nav'; templateUrl: './app-sidebar-nav-label.component.html' }) export class AppSidebarNavLabelComponent implements OnInit { - @Input() item: INavData; + @Input() item: INavData = {}; private classes = { 'nav-label': true, @@ -25,13 +25,16 @@ export class AppSidebarNavLabelComponent implements OnInit { getItemClass() { const itemClass = this.item.class; + // @ts-ignore this.classes[itemClass] = !!itemClass; return this.classes; } getLabelIconClass() { - const variant = `text-${this.item.label.variant}`; - this.iconClasses[variant] = !!this.item.label.variant; - const labelClass = this.item.label.class; + const variant = `text-${this.item.label?.variant}`; + // @ts-ignore + this.iconClasses[variant] = !!this.item.label?.variant; + const labelClass = this.item.label?.class; + // @ts-ignore this.iconClasses[labelClass] = !!labelClass; return this.iconClasses; } diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.html b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.html index 63095712..67acfc03 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.html +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.html @@ -20,13 +20,13 @@ [queryParams]="item.linkProps?.queryParams" [fragment]="item.linkProps?.fragment" [queryParamsHandling]="item.linkProps?.queryParamsHandling" - [preserveFragment]="item.linkProps?.preserveFragment" - [skipLocationChange]="item.linkProps?.skipLocationChange" - [replaceUrl]="item.linkProps?.replaceUrl" + [preserveFragment]="!!item.linkProps?.preserveFragment" + [skipLocationChange]="!!item.linkProps?.skipLocationChange" + [replaceUrl]="!!item.linkProps?.replaceUrl" [state]="item.linkProps?.state" [routerLink]="item.url" [routerLinkActive]="item.linkProps?.routerLinkActive || 'active'" - [routerLinkActiveOptions]="item.linkProps?.routerLinkActiveOptions?.exact ? item.linkProps?.routerLinkActiveOptions : {exact: false}" + [routerLinkActiveOptions]="item.linkProps?.routerLinkActiveOptions ?? {exact: false}" [class.active]="linkActive && !item.linkProps?.routerLinkActiveOptions" (click)="linkClicked()" > diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.ts index f3be7d1d..cb39ba82 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.ts @@ -11,14 +11,14 @@ import {INavData} from '../app-sidebar-nav'; template: ` - {{item.name}} - {{ item.badge.text }} + {{item?.name}} + {{ item?.badge?.text }} `, providers: [ SidebarNavHelper ] }) export class AppSidebarNavLinkContentComponent implements OnInit, OnDestroy { - @Input() item: INavData; + @Input() item: INavData = {}; constructor( public helper: SidebarNavHelper @@ -35,7 +35,7 @@ export class AppSidebarNavLinkContentComponent implements OnInit, OnDestroy { }) export class AppSidebarNavLinkComponent implements OnInit, OnDestroy { - protected _Item: INavData; + protected _Item!: INavData; @Input() set item(item: INavData) { @@ -47,13 +47,13 @@ export class AppSidebarNavLinkComponent implements OnInit, OnDestroy { @Output() linkClick = new EventEmitter(); - public linkType: string; - public href: string; - public linkActive: boolean; - private url: string; + public linkType!: string; + public href!: string; + public linkActive!: boolean; + private url!: string; private navigationEndObservable: Observable; - private navSubscription: Subscription; + private navSubscription!: Subscription; constructor( public router: Router, @@ -66,6 +66,7 @@ export class AppSidebarNavLinkComponent implements OnInit, OnDestroy { } ngOnInit() { + // @ts-ignore this.url = typeof this.item.url === 'string' ? this.item.url : this.router.serializeUrl(this.router.createUrlTree(this.item.url)) ; this.linkType = this.getLinkType(); this.href = this.isDisabled() ? '' : (this.item.href || this.url); diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.pipe.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.pipe.ts index 45fb7c9b..69533f41 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.pipe.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.pipe.ts @@ -7,7 +7,7 @@ export class AppSidebarNavLinkPipe implements PipeTransform { transform(item: any): any { - const classes = { 'nav-link': true }; + const classes: any = { 'nav-link': true }; const disabled = item.attributes && item.attributes.disabled; classes['disabled'] = disabled; diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.ts index 2895e032..52ce8bee 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.ts @@ -1,28 +1,29 @@ import {Component, ElementRef, Input, OnInit, Renderer2} from '@angular/core'; -import { INavData } from '../app-sidebar-nav'; +import { INavAttributes, INavData } from '../app-sidebar-nav'; @Component({ selector: 'app-sidebar-nav-title, cui-sidebar-nav-title', template: '', }) export class AppSidebarNavTitleComponent implements OnInit { - @Input() item: INavData; + @Input() item: INavData = {}; constructor( private el: ElementRef, private renderer: Renderer2, - ) {} + ) { + } ngOnInit() { const nativeElement: HTMLElement = this.el.nativeElement; - const name = this.renderer.createText(this.item.name); + const name = this.renderer.createText(this.item.name as string); - if ( this.item.class ) { + if (this.item.class) { const classes = this.item.class; this.renderer.addClass(nativeElement, classes); } - if ( this.item.wrapper ) { + if (this.item.wrapper) { const wrapper = this.renderer.createElement(this.item.wrapper.element); this.addAttribs(this.item.wrapper.attributes, wrapper); this.renderer.appendChild(wrapper, name); @@ -32,7 +33,7 @@ export class AppSidebarNavTitleComponent implements OnInit { } } - private addAttribs(attribs, element) { + private addAttribs(attribs: INavAttributes, element: any) { if (attribs) { for (const attr in attribs) { if (attr === 'style' && typeof(attribs[attr]) === 'object' ) { @@ -46,20 +47,20 @@ export class AppSidebarNavTitleComponent implements OnInit { } } - private setStyle(styles, el) { + private setStyle(styles: { [x: string]: any; }, el: any) { for (const style in styles) { this.renderer.setStyle(el, style, styles[style] ); } } - private addClass(classes, el) { + private addClass(classes: string | string[], el: any) { const classArray = (Array.isArray(classes) ? classes : classes.split(' ')); classArray.filter((element) => element.length > 0).forEach(element => { this.renderer.addClass(el, element ); }); } - private setAttrib(key, value, el) { + private setAttrib(key: string, value: string, el: any) { this.renderer.setAttribute(el, key, value ); } } diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar.component.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar.component.ts index 5661725c..73dd37bd 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar.component.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar.component.ts @@ -11,13 +11,13 @@ import { AppSidebarService } from './app-sidebar.service'; }) export class AppSidebarComponent implements OnInit, OnDestroy { - private subscriptionEvents: Subscription; + private subscriptionEvents!: Subscription; private _minimized = false; - @Input() compact: boolean; + @Input() compact?: boolean; @Input() display: any; - @Input() fixed: boolean; - @Input() offCanvas: boolean; + @Input() fixed?: boolean; + @Input() offCanvas?: boolean; @Input() get minimized() { @@ -67,13 +67,13 @@ export class AppSidebarComponent implements OnInit, OnDestroy { this._updateMinimized(false); } - isCompact(compact: boolean = this.compact): void { + isCompact(compact = this.compact): void { if (compact) { this.renderer.addClass(this.document.body, 'sidebar-compact'); } } - isFixed(fixed: boolean = this.fixed): void { + isFixed(fixed = this.fixed): void { if (fixed) { this.renderer.addClass(this.document.body, 'sidebar-fixed'); } @@ -83,7 +83,7 @@ export class AppSidebarComponent implements OnInit, OnDestroy { this.minimized = !this._minimized; } - isOffCanvas(offCanvas: boolean = this.offCanvas): void { + isOffCanvas(offCanvas = this.offCanvas): void { if (offCanvas) { this.renderer.addClass(this.document.body, 'sidebar-off-canvas'); } diff --git a/projects/coreui/angular/src/lib/sidebar/app-sidebar.module.ts b/projects/coreui/angular/src/lib/sidebar/app-sidebar.module.ts index 56fcf3bd..328cb08f 100644 --- a/projects/coreui/angular/src/lib/sidebar/app-sidebar.module.ts +++ b/projects/coreui/angular/src/lib/sidebar/app-sidebar.module.ts @@ -15,8 +15,8 @@ import { AppSidebarService } from './app-sidebar.service'; import { NavDropdownDirective, NavDropdownToggleDirective } from './app-sidebar-nav.directive'; import { AppSidebarNavComponent } from './app-sidebar-nav.component'; import { AppSidebarNavDividerComponent } from './app-sidebar-nav/app-sidebar-nav-divider.component'; -import { AppSidebarNavDropdownComponent } from './app-sidebar-nav/app-sidebar-nav-dropdown.component'; -import { AppSidebarNavItemsComponent } from './app-sidebar-nav/app-sidebar-nav-items.component'; +// import { AppSidebarNavDropdownComponent } from './app-sidebar-nav/app-sidebar-nav-dropdown.component'; +import { AppSidebarNavDropdownComponent, AppSidebarNavItemsComponent } from './app-sidebar-nav/app-sidebar-nav-items.component'; import { AppSidebarNavLinkComponent, AppSidebarNavLinkContentComponent } from './app-sidebar-nav/app-sidebar-nav-link.component'; import { AppSidebarNavTitleComponent } from './app-sidebar-nav/app-sidebar-nav-title.component'; import { SidebarNavHelper } from './app-sidebar-nav.service'; @@ -38,17 +38,16 @@ import { AppSidebarNavItemClassPipe } from './app-sidebar-nav/app-sidebar-nav-it AppSidebarHeaderComponent, AppSidebarMinimizerComponent, AppSidebarComponent, - AppSidebarNavItemsComponent, + // AppSidebarNavItemsComponent, AppSidebarNavComponent, - AppSidebarNavDividerComponent, - AppSidebarNavDropdownComponent, - AppSidebarNavLabelComponent, - AppSidebarNavLinkComponent, - AppSidebarNavLinkContentComponent, - AppSidebarNavTitleComponent, - NavDropdownDirective, - NavDropdownToggleDirective, - LayoutModule + // AppSidebarNavDividerComponent, + // AppSidebarNavDropdownComponent, + // AppSidebarNavLabelComponent, + // AppSidebarNavLinkComponent, + // AppSidebarNavLinkContentComponent, + // AppSidebarNavTitleComponent, + // NavDropdownDirective, + // NavDropdownToggleDirective, ], declarations: [ AppSidebarFooterComponent, diff --git a/projects/coreui/angular/src/lib/sidebar/public_api.ts b/projects/coreui/angular/src/lib/sidebar/public_api.ts index 01995f57..24008127 100644 --- a/projects/coreui/angular/src/lib/sidebar/public_api.ts +++ b/projects/coreui/angular/src/lib/sidebar/public_api.ts @@ -4,3 +4,14 @@ export { AppSidebarNavComponent } from './app-sidebar-nav.component'; export { AppSidebarMinimizerComponent } from './app-sidebar-minimizer.component'; export { SidebarNavHelper } from './app-sidebar-nav.service'; export { AppSidebarModule } from './app-sidebar.module'; + +export { AppSidebarFooterComponent } from './app-sidebar-footer.component'; +export { AppSidebarFormComponent } from './app-sidebar-form.component'; +export { AppSidebarHeaderComponent } from './app-sidebar-header.component'; +// export { NavDropdownDirective, NavDropdownToggleDirective } from './app-sidebar-nav.directive'; +// export { AppSidebarNavDividerComponent } from './app-sidebar-nav/app-sidebar-nav-divider.component'; +// export { AppSidebarNavDropdownComponent } from './app-sidebar-nav/app-sidebar-nav-dropdown.component'; +// export { AppSidebarNavItemsComponent } from './app-sidebar-nav/app-sidebar-nav-items.component'; +// export { AppSidebarNavLinkComponent, AppSidebarNavLinkContentComponent } from './app-sidebar-nav/app-sidebar-nav-link.component'; +// export { AppSidebarNavTitleComponent } from './app-sidebar-nav/app-sidebar-nav-title.component'; +// export { AppSidebarNavLabelComponent } from './app-sidebar-nav/app-sidebar-nav-label.component'; diff --git a/projects/coreui/angular/src/test.ts b/projects/coreui/angular/src/test.ts index 2a6d9952..2c2c0120 100644 --- a/projects/coreui/angular/src/test.ts +++ b/projects/coreui/angular/src/test.ts @@ -1,7 +1,7 @@ // This file is required by karma.conf.js and loads recursively all the .spec and framework files -import 'zone.js/dist/zone'; -import 'zone.js/dist/zone-testing'; +import 'zone.js'; +import 'zone.js/testing'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, @@ -15,7 +15,9 @@ declare const require: any; // First, initialize the Angular testing environment. getTestBed().initTestEnvironment( BrowserDynamicTestingModule, - platformBrowserDynamicTesting() + platformBrowserDynamicTesting(), { + teardown: { destroyAfterEach: false } +} ); // Then we find all the tests. const context = require.context('./', true, /\.spec\.ts$/); diff --git a/projects/coreui/angular/tsconfig.lib.json b/projects/coreui/angular/tsconfig.lib.json index 2c3b8f46..427f1574 100644 --- a/projects/coreui/angular/tsconfig.lib.json +++ b/projects/coreui/angular/tsconfig.lib.json @@ -3,22 +3,13 @@ "extends": "../../../tsconfig.json", "compilerOptions": { "outDir": "../../../out-tsc/lib", - "declarationMap": true, - "target": "es2015", "declaration": true, + "declarationMap": true, "inlineSources": true, "types": [], - "lib": [ - "dom", - "es2018" - ] }, "angularCompilerOptions": { - "enableIvy": false, "flatModuleId": "@coreui/angular", - "skipTemplateCodegen": true, - "strictMetadataEmit": true, - "enableResourceInlining": true }, "exclude": [ "src/test.ts", diff --git a/projects/coreui/angular/tsconfig.lib.prod.json b/projects/coreui/angular/tsconfig.lib.prod.json index 5615c27d..06de549e 100644 --- a/projects/coreui/angular/tsconfig.lib.prod.json +++ b/projects/coreui/angular/tsconfig.lib.prod.json @@ -5,6 +5,6 @@ "declarationMap": false }, "angularCompilerOptions": { - "enableIvy": false + "compilationMode": "partial" } } diff --git a/projects/coreui/angular/tsconfig.spec.json b/projects/coreui/angular/tsconfig.spec.json index 4acf9413..b2ef1bad 100644 --- a/projects/coreui/angular/tsconfig.spec.json +++ b/projects/coreui/angular/tsconfig.spec.json @@ -3,8 +3,7 @@ "compilerOptions": { "outDir": "../../../out-tsc/spec", "types": [ - "jasmine", - "node" + "jasmine" ] }, "files": [ diff --git a/projects/coreui/angular/tslint.json b/projects/coreui/angular/tslint.json deleted file mode 100644 index db274f1e..00000000 --- a/projects/coreui/angular/tslint.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "extends": "../../../tslint.json", - "rules": { - "directive-selector": [ - true, - "attribute", - "app", - "camelCase" - ], - "component-selector": [ - true, - "element", - "app", - "kebab-case" - ], - "forin": false - } -} diff --git a/src/app/_nav.ts b/src/app/_nav.ts index 13c4d5cf..104eb074 100644 --- a/src/app/_nav.ts +++ b/src/app/_nav.ts @@ -1,4 +1,4 @@ -import { INavData } from '../../dist/@coreui/angular/lib/sidebar/public_api'; +import { INavData } from '../../projects/coreui/angular/src/public-api'; export const navItems: INavData[] = [ { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 1210d5e5..328e2c66 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -26,7 +26,8 @@ import { AppHeaderModule, AppFooterModule, AppSidebarModule, -} from '../../dist/@coreui/angular'; +} from '../../projects/coreui/angular/src/public-api'; +// } from '../../dist/@coreui/angular'; // Import routing module import { AppRoutingModule } from './app.routing'; diff --git a/src/app/containers/default-layout/default-layout.component.html b/src/app/containers/default-layout/default-layout.component.html index d8997e3c..19291dd4 100644 --- a/src/app/containers/default-layout/default-layout.component.html +++ b/src/app/containers/default-layout/default-layout.component.html @@ -27,6 +27,6 @@ - CoreUI © 2021 creativeLabs. + CoreUI © 2022 creativeLabs. Powered by CoreUI 2 for Angular diff --git a/src/app/containers/default-layout/default-layout.component.ts b/src/app/containers/default-layout/default-layout.component.ts index 308db353..5ec7c117 100644 --- a/src/app/containers/default-layout/default-layout.component.ts +++ b/src/app/containers/default-layout/default-layout.component.ts @@ -10,7 +10,7 @@ export class DefaultLayoutComponent { minimized = false; public navItems = [...navItems]; - toggleMinimize(e) { + toggleMinimize(e: boolean) { this.minimized = e; } } diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 012182ef..72cd6397 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -12,4 +12,4 @@ export const environment = { * import the following file, but please comment it out in production mode * because it will have performance impact when throw error */ -// import 'zone.js/dist/zone-error'; // Included with Angular CLI. +// import 'zone.js/plugins/zone-error'; // Included with Angular CLI. diff --git a/src/index.html b/src/index.html index 81cb4371..dc884c34 100644 --- a/src/index.html +++ b/src/index.html @@ -1,9 +1,9 @@ diff --git a/src/polyfills.ts b/src/polyfills.ts index 83679398..31fea1a3 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -20,24 +20,8 @@ import '@angular/localize/init'; */ /*************************************************************************************************** -* BROWSER POLYFILLS -*/ - -/** IE11 requires the following for NgClass support on SVG elements */ -// import 'classlist.js'; // Run `npm install --save classlist.js`. - -/** IE11 requires all of the following polyfills. */ -import 'core-js'; - -/** IE11 requires the following for the Reflect API. */ -import 'core-js/es/reflect'; - -/** - * Web Animations `@angular/platform-browser/animations` - * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. - * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). + * BROWSER POLYFILLS */ -// import 'web-animations-js'; // Run `npm install --save web-animations-js`. /** * By default, zone.js will patch all possible macroTask and DomEvents @@ -66,11 +50,10 @@ import 'core-js/es/reflect'; /*************************************************************************************************** * Zone JS is required by default for Angular itself. */ -import 'zone.js/dist/zone'; // Included with Angular CLI. +import 'zone.js'; // Included with Angular CLI. /*************************************************************************************************** * APPLICATION IMPORTS */ (window as any).global = window; - diff --git a/src/test.ts b/src/test.ts index 16317897..6b03dbe8 100644 --- a/src/test.ts +++ b/src/test.ts @@ -1,6 +1,6 @@ // This file is required by karma.conf.js and loads recursively all the .spec and framework files -import 'zone.js/dist/zone-testing'; +import 'zone.js/testing'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, @@ -12,7 +12,9 @@ declare const require: any; // First, initialize the Angular testing environment. getTestBed().initTestEnvironment( BrowserDynamicTestingModule, - platformBrowserDynamicTesting() + platformBrowserDynamicTesting(), { + teardown: { destroyAfterEach: false } +} ); // Then we find all the tests. const context = require.context('./', true, /\.spec\.ts$/); diff --git a/src/tsconfig.app.json b/src/tsconfig.app.json index ed20f626..36fc5283 100644 --- a/src/tsconfig.app.json +++ b/src/tsconfig.app.json @@ -1,10 +1,9 @@ +/* To learn more about this file see: https://angular.io/config/tsconfig. */ { "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", "baseUrl": "./", - "module": "esnext", - "target": "es2015", "types": [], "paths": { "@angular/*": [ @@ -12,9 +11,6 @@ ] } }, - "angularCompilerOptions": { - "enableIvy": true - }, "files": [ "main.ts", "polyfills.ts" diff --git a/src/tsconfig.spec.json b/src/tsconfig.spec.json index 1a18e6d0..f95870cd 100644 --- a/src/tsconfig.spec.json +++ b/src/tsconfig.spec.json @@ -1,12 +1,11 @@ +/* To learn more about this file see: https://angular.io/config/tsconfig. */ { "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/spec", "baseUrl": "./", - "module": "commonjs", "types": [ - "jasmine", - "node" + "jasmine" ] }, "files": [ diff --git a/tsconfig.json b/tsconfig.json index 51a28c6a..b59274a0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,21 +1,28 @@ +/* To learn more about this file see: https://angular.io/config/tsconfig. */ { "compileOnSave": false, "compilerOptions": { "baseUrl": "./", - "outDir": "./dist", + "outDir": "./dist/out-tsc", + "forceConsistentCasingInFileNames": true, + "strict": true, + "noImplicitOverride": true, + "noPropertyAccessFromIndexSignature": false, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, "sourceMap": true, - "declaration": true, + "declaration": false, "downlevelIteration": true, "experimentalDecorators": true, - "module": "esnext", "moduleResolution": "node", "importHelpers": true, - "target": "es2015", + "target": "es2017", + "module": "es2020", "typeRoots": [ "node_modules/@types" ], "lib": [ - "es2018", + "es2020", "dom" ], "paths": { @@ -25,8 +32,9 @@ } }, "angularCompilerOptions": { - "enableIvy": false, - "fullTemplateTypeCheck": true, - "strictInjectionParameters": true + "enableI18nLegacyMessageIdFormat": false, + "strictInjectionParameters": true, + "strictInputAccessModifiers": true, + "strictTemplates": true } } diff --git a/tslint.json b/tslint.json deleted file mode 100644 index d768a652..00000000 --- a/tslint.json +++ /dev/null @@ -1,139 +0,0 @@ -{ - "extends": "tslint:recommended", - "rulesDirectory": [ - "codelyzer" - ], - "rules": { - "align": { - "options": [ - "parameters", - "statements" - ] - }, - "array-type": false, - "arrow-parens": false, - "arrow-return-shorthand": true, - "deprecation": { - "severity": "warning" - }, - "import-blacklist": [ - true, - "rxjs/Rx" - ], - "curly": true, - "interface-name": false, - "max-classes-per-file": false, - "eofline": true, - "max-line-length": [ - true, - 140 - ], - "import-spacing": true, - "indent": { - "options": [ - "spaces" - ] - }, - "member-access": false, - "member-ordering": [ - true, - { - "order": [ - "static-field", - "instance-field", - "static-method", - "instance-method" - ] - } - ], - "no-consecutive-blank-lines": false, - "no-console": [ - true, - "debug", - "info", - "time", - "timeEnd", - "trace" - ], - "no-empty": false, - "no-inferrable-types": [ - true, - "ignore-params" - ], - "no-non-null-assertion": true, - "no-redundant-jsdoc": true, - "no-string-literal": false, - "no-switch-case-fall-through": true, - "no-var-requires": false, - "object-literal-key-quotes": [ - true, - "as-needed" - ], - "object-literal-sort-keys": false, - "ordered-imports": false, - "prefer-const": true, - "quotemark": [ - true, - "single" - ], - "trailing-comma": false, - "component-class-suffix": true, - "contextual-lifecycle": true, - "directive-class-suffix": true, - "no-conflicting-lifecycle": true, - "variable-name": false, - "no-host-metadata-property": true, - "no-input-rename": true, - "no-inputs-metadata-property": true, - "no-output-native": true, - "no-output-on-prefix": true, - "semicolon": { - "options": [ - "always" - ] - }, - "space-before-function-paren": { - "options": { - "anonymous": "never", - "asyncArrow": "always", - "constructor": "never", - "method": "never", - "named": "never" - } - }, - "no-output-rename": true, - "no-outputs-metadata-property": true, - "template-banana-in-box": true, - "typedef-whitespace": { - "options": [ - { - "call-signature": "nospace", - "index-signature": "nospace", - "parameter": "nospace", - "property-declaration": "nospace", - "variable-declaration": "nospace" - }, - { - "call-signature": "onespace", - "index-signature": "onespace", - "parameter": "onespace", - "property-declaration": "onespace", - "variable-declaration": "onespace" - } - ] - }, - "template-no-negated-async": true, - "use-lifecycle-interface": true, - "use-pipe-transform-interface": true, - "whitespace": { - "options": [ - "check-branch", - "check-decl", - "check-operator", - "check-separator", - "check-type", - "check-typecast" - ] - } - } -}