├── .browserslistrc ├── .editorconfig ├── .github └── workflows │ ├── daily-project-check.yml │ └── project-check.yml ├── .gitignore ├── CHANGELOG.md ├── CLI.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── ISSUE_TEMPLATE.md ├── README.md ├── angular.json ├── build └── change-version.js ├── e2e ├── protractor.conf.js ├── src │ ├── app.e2e-spec.ts │ └── app.po.ts └── tsconfig.e2e.json ├── package.json ├── projects └── coreui │ └── angular │ ├── README.md │ ├── karma.conf.github.js │ ├── karma.conf.js │ ├── ng-package.json │ ├── ng-package.prod.json │ ├── package.json │ ├── src │ ├── lib │ │ ├── aside │ │ │ ├── app-aside.component.spec.ts │ │ │ ├── app-aside.component.ts │ │ │ ├── app-aside.module.ts │ │ │ ├── index.ts │ │ │ └── public_api.ts │ │ ├── breadcrumb │ │ │ ├── app-breadcrumb.component.ts │ │ │ ├── app-breadcrumb.module.ts │ │ │ ├── app-breadcrumb.service.spec.ts │ │ │ ├── app-breadcrumb.service.ts │ │ │ ├── cui-breadcrumb.component.html │ │ │ ├── cui-breadcrumb.component.spec.ts │ │ │ ├── cui-breadcrumb.component.ts │ │ │ ├── index.ts │ │ │ └── public_api.ts │ │ ├── coreui.module--.ts-- │ │ ├── footer │ │ │ ├── app-footer.component.spec.ts │ │ │ ├── app-footer.component.ts │ │ │ ├── app-footer.module.ts │ │ │ ├── index.ts │ │ │ └── public_api.ts │ │ ├── header │ │ │ ├── app-header.component.html │ │ │ ├── app-header.component.spec.ts │ │ │ ├── app-header.component.ts │ │ │ ├── app-header.md │ │ │ ├── app-header.module.ts │ │ │ ├── index.ts │ │ │ └── public_api.ts │ │ ├── shared │ │ │ ├── classes.ts │ │ │ ├── index.ts │ │ │ ├── layout │ │ │ │ ├── index.ts │ │ │ │ ├── layout.directive.ts │ │ │ │ └── layout.module.ts │ │ │ ├── replace.ts │ │ │ └── toggle-classes.ts │ │ └── sidebar │ │ │ ├── app-sidebar-footer.component.ts │ │ │ ├── app-sidebar-form.component.ts │ │ │ ├── app-sidebar-header.component.ts │ │ │ ├── app-sidebar-minimizer.component.ts │ │ │ ├── app-sidebar-nav.component.html │ │ │ ├── app-sidebar-nav.component.spec.ts │ │ │ ├── app-sidebar-nav.component.ts │ │ │ ├── app-sidebar-nav.directive.ts │ │ │ ├── app-sidebar-nav.service.spec.ts │ │ │ ├── app-sidebar-nav.service.ts │ │ │ ├── app-sidebar-nav.ts │ │ │ ├── app-sidebar-nav │ │ │ ├── app-sidebar-nav-badge.pipe.spec.ts │ │ │ ├── app-sidebar-nav-badge.pipe.ts │ │ │ ├── app-sidebar-nav-divider.component.ts │ │ │ ├── app-sidebar-nav-dropdown.component.ts │ │ │ ├── app-sidebar-nav-icon.pipe.spec.ts │ │ │ ├── app-sidebar-nav-icon.pipe.ts │ │ │ ├── app-sidebar-nav-item-class.pipe.spec.ts │ │ │ ├── app-sidebar-nav-item-class.pipe.ts │ │ │ ├── app-sidebar-nav-items.component.ts │ │ │ ├── app-sidebar-nav-label.component.html │ │ │ ├── app-sidebar-nav-label.component.spec.ts │ │ │ ├── app-sidebar-nav-label.component.ts │ │ │ ├── app-sidebar-nav-link.component.html │ │ │ ├── app-sidebar-nav-link.component.spec.ts │ │ │ ├── app-sidebar-nav-link.component.ts │ │ │ ├── app-sidebar-nav-link.pipe.ts │ │ │ ├── app-sidebar-nav-title.component.spec.ts │ │ │ └── app-sidebar-nav-title.component.ts │ │ │ ├── app-sidebar.component.spec.ts │ │ │ ├── app-sidebar.component.ts │ │ │ ├── app-sidebar.module.ts │ │ │ ├── app-sidebar.service.spec.ts │ │ │ ├── app-sidebar.service.ts │ │ │ ├── index.ts │ │ │ └── public_api.ts │ ├── public-api.ts │ └── test.ts │ ├── tsconfig.lib.json │ ├── tsconfig.lib.prod.json │ ├── tsconfig.spec.json │ └── tslint.json ├── src ├── app │ ├── _nav.ts │ ├── app.component.css │ ├── app.component.spec.ts │ ├── app.component.ts │ ├── app.module.ts │ ├── app.routing.ts │ ├── containers │ │ ├── default-layout │ │ │ ├── default-layout.component.html │ │ │ ├── default-layout.component.ts │ │ │ └── index.ts │ │ └── index.ts │ └── views │ │ └── dashboard │ │ ├── dashboard-routing.module.ts │ │ ├── dashboard.component.html │ │ ├── dashboard.component.ts │ │ └── dashboard.module.ts ├── assets │ ├── .gitkeep │ ├── favicon.ico │ └── img │ │ ├── avatars │ │ ├── 1.jpg │ │ ├── 2.jpg │ │ ├── 3.jpg │ │ ├── 4.jpg │ │ ├── 5.jpg │ │ ├── 6.jpg │ │ ├── 7.jpg │ │ └── 8.jpg │ │ └── brand │ │ ├── logo.svg │ │ └── sygnet.svg ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── index.html ├── karma.conf.js ├── main.ts ├── polyfills.ts ├── scss │ ├── _custom.scss │ ├── _variables.scss │ ├── style.scss │ └── vendors │ │ ├── _variables.scss │ │ └── chart.js │ │ └── chart.scss ├── test.ts ├── tsconfig.app.json ├── tsconfig.spec.json └── typings.d.ts ├── tsconfig.json └── tslint.json /.browserslistrc: -------------------------------------------------------------------------------- 1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below. 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | 5 | # For the full list of supported browsers by the Angular framework, please see: 6 | # https://angular.io/guide/browser-support 7 | 8 | # You can see what browsers were selected by your queries by running: 9 | # npx browserslist 10 | 11 | last 1 Chrome version 12 | last 1 Firefox version 13 | last 2 Edge major versions 14 | last 2 Safari major versions 15 | last 2 iOS major versions 16 | Firefox ESR 17 | IE 11 # Angular supports IE 11 only as an opt-in. To opt-out, add the 'not' prefix on this line. 18 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | end_of_line = lf 7 | indent_style = space 8 | indent_size = 2 9 | insert_final_newline = true 10 | trim_trailing_whitespace = true 11 | 12 | [*.md] 13 | max_line_length = off 14 | trim_trailing_whitespace = false 15 | -------------------------------------------------------------------------------- /.github/workflows/daily-project-check.yml: -------------------------------------------------------------------------------- 1 | name: Daily project check 2 | 3 | on: 4 | schedule: 5 | # build runs every weekday at 3AM UTC 6 | - cron: '0 3 * * 1-5' 7 | 8 | jobs: 9 | build: 10 | 11 | runs-on: ubuntu-latest 12 | 13 | strategy: 14 | matrix: 15 | node-version: [14.x] 16 | os: [ubuntu-latest, windows-latest, macOS-latest] 17 | 18 | steps: 19 | - uses: actions/checkout@v1 20 | - name: Use Node.js ${{ matrix.node-version }} 21 | uses: actions/setup-node@v1 22 | with: 23 | node-version: ${{ matrix.node-version }} 24 | - name: project check 25 | run: | 26 | npm i 27 | npm run build-lib:prod 28 | npm run test-lib:prod 29 | npm run lint 30 | env: 31 | CI: true 32 | 33 | e2e-chrome: 34 | 35 | runs-on: windows-latest 36 | 37 | steps: 38 | - uses: actions/checkout@v1 39 | - name: Use Node.js 14 40 | uses: actions/setup-node@v1 41 | with: 42 | node-version: 14 43 | - name: e2e chrome test 44 | run: | 45 | choco install googlechrome 46 | npm i 47 | npm run e2e 48 | env: 49 | BROWSER: chrome 50 | -------------------------------------------------------------------------------- /.github/workflows/project-check.yml: -------------------------------------------------------------------------------- 1 | name: Project check 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | pull_request: 8 | branches: 9 | - master 10 | 11 | jobs: 12 | build: 13 | 14 | runs-on: ubuntu-latest 15 | 16 | strategy: 17 | matrix: 18 | node-version: [14.x] 19 | os: [ubuntu-latest, windows-latest, macOS-latest] 20 | 21 | steps: 22 | - uses: actions/checkout@v1 23 | - name: Use Node.js ${{ matrix.node-version }} 24 | uses: actions/setup-node@v1 25 | with: 26 | node-version: ${{ matrix.node-version }} 27 | - name: project check 28 | run: | 29 | npm i 30 | npm run build-lib:prod 31 | npm run test-lib:prod 32 | npm run lint 33 | env: 34 | CI: true 35 | 36 | e2e-chrome: 37 | 38 | runs-on: windows-latest 39 | 40 | steps: 41 | - uses: actions/checkout@v1 42 | - name: Use Node.js 14 43 | uses: actions/setup-node@v1 44 | with: 45 | node-version: 14 46 | - name: e2e chrome test 47 | run: | 48 | choco install googlechrome 49 | npm i 50 | npm run build-lib:prod 51 | npm run e2e 52 | env: 53 | BROWSER: chrome 54 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | package-lock.json 13 | 14 | # profiling files 15 | chrome-profiler-events*.json 16 | speed-measure-plugin*.json 17 | 18 | # IDEs and editors 19 | /.idea 20 | .project 21 | .classpath 22 | .c9/ 23 | *.launch 24 | .settings/ 25 | *.sublime-workspace 26 | 27 | # IDE - VSCode 28 | .vscode/* 29 | !.vscode/settings.json 30 | !.vscode/tasks.json 31 | !.vscode/launch.json 32 | !.vscode/extensions.json 33 | .history/* 34 | 35 | # misc 36 | /.sass-cache 37 | /connect.lock 38 | /coverage 39 | /libpeerconnection.log 40 | npm-debug.log 41 | yarn-error.log 42 | testem.log 43 | /typings 44 | 45 | # System Files 46 | .DS_Store 47 | Thumbs.db 48 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | ### [@coreui/angular](https://coreui.io/) changelog 2 | 3 | ##### `v2.11.2` 4 | 5 | - ##### `update to Angular 11.2` 6 | 7 | ###### dependencies update 8 | - update `@angular/animations` to `^11.2.2` 9 | - update `@angular/common` to `^11.2.2` 10 | - update `@angular/compiler` to `^11.2.2` 11 | - update `@angular/core` to `^11.2.2` 12 | - update `@angular/forms` to `^11.2.2` 13 | - update `@angular/localize` to `^11.2.2` 14 | - update `@angular/platform-browser` to `^11.2.2` 15 | - update `@angular/platform-browser-dynamic` to `^11.2.2` 16 | - update `@angular/router` to `^11.2.2` 17 | - update `tslib` to `^2.1.0` 18 | - update `zone.js` to `^0.11.4` 19 | - update `@angular-devkit/build-angular` to `^0.1102.1` 20 | - update `@angular/cli` to `^11.2.1` 21 | - update `@angular/compiler-cli` to `^11.2.2` 22 | - update `@angular/language-service` to `^11.2.2` 23 | - update `@types/jasmine` to `^3.6.4` 24 | - update `@types/node` to `^14.14.31` 25 | - update `codelyzer` to `^6.0.1` 26 | - update `jasmine-spec-reporter` to `~5.0.2` 27 | - update `karma-jasmine` to `~4.0.1` 28 | - update `karma-jasmine-html-reporter` to `^1.5.4` 29 | - update `ng-packagr` to `^11.2.4` 30 | - update `tslint` to `~6.1.3` 31 | 32 | 33 | ##### `v2.11.1` 34 | 35 | - ##### `update to Angular 11.1` 36 | 37 | ###### dependencies update 38 | - update `@angular/animations` to `^11.1.0` 39 | - update `@angular/common` to `^11.1.0` 40 | - update `@angular/compiler` to `^11.1.0` 41 | - update `@angular/core` to `^11.1.0` 42 | - update `@angular/forms` to `^11.1.0` 43 | - update `@angular/localize` to `^11.1.0` 44 | - update `@angular/platform-browser` to `^11.1.0` 45 | - update `@angular/platform-browser-dynamic` to `^11.1.0` 46 | - update `@angular/router` to `^11.1.0` 47 | - update `@angular-devkit/build-angular` to `^0.1101.1` 48 | - update `@angular/cli` to `^11.1.1` 49 | - update `@angular/compiler-cli` to `^11.1.0` 50 | - update `@angular/language-service` to `^11.1.0` 51 | - update `@types/jasmine` to `^3.6.3` 52 | - update `@types/node` to `^14.14.22` 53 | - update `ng-packagr` to `^11.1.2` 54 | 55 | 56 | ##### `v2.11.0` 57 | 58 | - chore: update to `Angular 11` and `TypeScript 4` 59 | - [https://update.angular.io/](https://update.angular.io/?v=10.2-11.0) 60 | - [https://v11.angular.io/guide/updating-to-version-11](https://angular.io/guide/updating-to-version-11) 61 | - [TypeScript: Documentation - TypeScript 4.0](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-0.html) 62 | - remove deprecated support for IE 9, 10, and IE mobile 63 | 64 | ###### dependencies update 65 | - update `@angular/animations` to `^11.0.9` 66 | - update `@angular/common` to `^11.0.9` 67 | - update `@angular/compiler` to `^11.0.9` 68 | - update `@angular/core` to `^11.0.9` 69 | - update `@angular/forms` to `^11.0.9` 70 | - update `@angular/localize` to `^11.0.9` 71 | - update `@angular/platform-browser` to `^11.0.9` 72 | - update `@angular/platform-browser-dynamic` to `^11.0.9` 73 | - update `@angular/router` to `^11.0.9` 74 | - update `zone.js` to `^0.11.3` 75 | - update `@angular-devkit/build-angular` to `^0.1100.7` 76 | - update `@angular/cli` to `^11.0.7` 77 | - update `@angular/compiler-cli` to `^11.0.9` 78 | - update `@angular/language-service` to `^11.0.9` 79 | - update `@types/jasmine` to `~3.6.0` 80 | - update `codelyzer` to `^6.0.0` 81 | - update `jasmine-core` to `~3.6.0` 82 | - update `karma` to `^5.2.3` 83 | - update `karma-coverage` to `~2.0.3` 84 | - update `ng-packagr` to `^11.0.3` 85 | - update `ts-node` to `^9.1.1` 86 | - update `typescript` to `~4.0.5` 87 | 88 | 89 | ##### `v2.10.0` 90 | 91 | - chore: update to `Angular 10` and `TypeScript 3.9` 92 | - [https://update.angular.io/](https://update.angular.io/?v=9.1-10.2) 93 | - [https://v10.angular.io/guide/updating-to-version-10](https://v10.angular.io/guide/updating-to-version-10) 94 | - [TypeScript: Documentation - TypeScript 3.9](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-9.html) 95 | 96 | 97 | - test: deprecate `async()` in favour of `waitForAsync()` 98 | 99 | ###### dependencies update 100 | - update `@angular/animations` to `^10.2.4` 101 | - update `@angular/common` to `^10.2.4` 102 | - update `@angular/compiler` to `^10.2.4` 103 | - update `@angular/core` to `^10.2.4` 104 | - update `@angular/forms` to `^10.2.4` 105 | - update `@angular/localize` to `^10.2.4` 106 | - update `@angular/platform-browser` to `^10.2.4` 107 | - update `@angular/platform-browser-dynamic` to `^10.2.4` 108 | - update `@angular/router` to `^10.2.4` 109 | - update `tslib` to `^2.0.0` 110 | - update `@angular-devkit/build-angular` to `^0.1002.1` 111 | - update `@angular-devkit/build-ng-packagr` to `^0.1002.1` 112 | - update `@angular/cli` to `^10.2.1` 113 | - update `@angular/compiler-cli` to `^10.2.4` 114 | - update `@angular/language-service` to `^10.2.4` 115 | - update `codelyzer` to `^6.0.1` 116 | - update `jasmine-spec-reporter` to `~5.0.0` 117 | - update `karma` to `~5.0.0` 118 | - update `karma-chrome-launcher` to `~3.1.0` 119 | - update `karma-coverage-istanbul-reporter` to `~3.0.2` 120 | - update `karma-jasmine` to `~4.0.0` 121 | - update `karma-jasmine-html-reporter` to `^1.5.0` 122 | - update `ng-packagr` to `^10.1.0` 123 | - update `ngx-perfect-scrollbar` to `^10.1.0` 124 | - update `protractor` to `~7.0.0` 125 | - update `tslint` to `~6.1.0` 126 | - update `typescript` to `~3.9.7` 127 | 128 | ##### `v2.9.6` 129 | - fix: use type INavData instead of any 130 | - chore(.github): add project checks workflows 131 | - test: minor updates e2e, unit 132 | 133 | ###### dependencies update 134 | - update `@angular/animations` to `^9.1.13` 135 | - update `@angular/common` to `^9.1.13` 136 | - update `@angular/compiler` to `^9.1.13` 137 | - update `@angular/core` to `^9.1.13` 138 | - update `@angular/forms` to `^9.1.13` 139 | - update `@angular/localize` to `^9.1.13` 140 | - update `@angular/platform-browser` to `^9.1.13` 141 | - update `@angular/platform-browser-dynamic` to `^9.1.13` 142 | - update `@angular/router` to `^9.1.13` 143 | - update `rxjs` to `^6.6.3` 144 | - update `tslib` to `^1.14.1` 145 | - update `@angular-devkit/build-angular` to `^0.901.13` 146 | - update `@angular-devkit/build-ng-packagr` to `^0.901.13` 147 | - update `@angular/cli` to `^9.1.13` 148 | - update `@angular/compiler-cli` to `^9.1.13` 149 | - update `@angular/language-service` to `^9.1.13` 150 | - update `@types/jasmine` to `^3.6.2` 151 | - update `@types/node` to `^14.14.20` 152 | - update `karma` to `^5.2.3` 153 | - update `simple-line-icons` to `^2.5.5` 154 | --- 155 | - update `stylus@0.54.8` with `npm --depth 2 update stylus` 156 | 157 | ##### `v2.9.4` 158 | - fix: routerLinkActiveOptions not passed to SidebarNavLink - thanks @CloudStrife28492 fixes #107 159 | 160 | ##### `v2.9.3` 161 | - fix: add missing AppSidebarNavComponent/AppSidebarMinimizer to public api - thanks @coyoteecd fixes #110 162 | 163 | ###### dependencies update 164 | - update `@angular/animations` to `^9.1.12` 165 | - update `@angular/common` to `^9.1.12` 166 | - update `@angular/compiler` to `^9.1.12` 167 | - update `@angular/core` to `^9.1.12` 168 | - update `@angular/forms` to `^9.1.12` 169 | - update `@angular/localize` to `^9.1.12` 170 | - update `@angular/platform-browser` to `^9.1.12` 171 | - update `@angular/platform-browser-dynamic` to `^9.1.12` 172 | - update `@angular/router` to `^9.1.12` 173 | - update `rxjs` to `^6.6.0` 174 | - update `tslib` to `^1.13.0` 175 | - update `@angular-devkit/build-angular` to `^0.901.11` 176 | - update `@angular-devkit/build-ng-packagr` to `^0.901.11` 177 | - update `@angular/cli` to `^9.1.11` 178 | - update `@angular/compiler-cli` to `^9.1.12` 179 | - update `@angular/language-service` to `^9.1.12` 180 | - update `@types/jasmine` to `^3.5.11` 181 | - update `@types/node` to `^13.13.14` 182 | - update `jasmine-spec-reporter` to `^5.0.2` 183 | - update `karma` to `^5.1.0` 184 | - update `karma-jasmine` to `^3.3.1` 185 | - update `karma-jasmine-html-reporter` to `^1.5.4` 186 | - update `ng-packagr` to `^9.1.5` 187 | - update `protractor` to `^7.0.0` 188 | - update `shelljs` to `^0.8.4` 189 | - update `ts-node` to `^8.10.2` 190 | - update `tslint` to `^6.1.2` 191 | 192 | ##### `v2.9.2` 193 | - chore: update to `Angular 9.1.1` 194 | - chore: remove build artifacts from git 195 | 196 | ###### dependencies update 197 | - update `@angular/animations` to `^9.1.1` 198 | - update `@angular/common` to `^9.1.1` 199 | - update `@angular/compiler` to `^9.1.1` 200 | - update `@angular/core` to `^9.1.1` 201 | - update `@angular/forms` to `^9.1.1` 202 | - update `@angular/localize` to `^9.1.1` 203 | - update `@angular/platform-browser` to `^9.1.1` 204 | - update `@angular/platform-browser-dynamic` to `^9.1.1` 205 | - update `@angular/router` to `^9.1.1` 206 | - update `rxjs` to `^6.5.5` 207 | - update `zone.js` to `^0.10.3` 208 | - update `@angular-devkit/build-angular` to `~0.901.1` 209 | - update `@angular-devkit/build-ng-packagr` to `~0.901.1` 210 | - update `@angular/cli` to `^9.1.1` 211 | - update `@angular/compiler-cli` to `^9.1.1` 212 | - update `@angular/language-service` to `^9.1.1` 213 | - update `@types/jasmine` to `^3.5.10` 214 | - update `@types/jasminewd2` to `~2.0.8` 215 | - update `@types/node` to `^13.11.1` 216 | - update `codelyzer` to `^5.2.2` 217 | - update `jasmine-spec-reporter` to `^5.0.1` 218 | - update `karma` to `^5.0.1` 219 | - update `karma-chrome-launcher` to `^3.1.0` 220 | - update `karma-coverage-istanbul-reporter` to `^2.1.1` 221 | - update `karma-jasmine` to `^3.1.1` 222 | - update `karma-jasmine-html-reporter` to `^1.5.3` 223 | - update `ng-packagr` to `^9.1.0` 224 | - update `protractor` to `^5.4.3` 225 | - update `ts-node` to `^8.8.2` 226 | - update `tslint` to `^6.1.1` 227 | - update `typescript` to `~3.6.5` 228 | 229 | ##### `v2.9.1` 230 | - fix: downgrade TypeScript to ~3.6.4 - thanks @jrocha closes #103 231 | 232 | ###### dependencies update 233 | - update `typescript` to `~3.6.4` 234 | - update `@angular/animations` to `~9.0.5` 235 | - update `@angular/common` to `~9.0.5` 236 | - update `@angular/compiler` to `~9.0.5` 237 | - update `@angular/core` to `~9.0.5` 238 | - update `@angular/forms` to `~9.0.5` 239 | - update `@angular/localize` to `^9.0.5` 240 | - update `@angular/platform-browser` to `~9.0.5` 241 | - update `@angular/platform-browser-dynamic` to `~9.0.5` 242 | - update `@angular/router` to `~9.0.5` 243 | - update `tslib` to `^1.11.1` 244 | - update `@angular-devkit/build-angular` to `~0.900.5` 245 | - update `@angular-devkit/build-ng-packagr` to `~0.900.5` 246 | - update `@angular/cli` to `~9.0.5` 247 | - update `@angular/compiler-cli` to `~9.0.5` 248 | - update `@angular/language-service` to `~9.0.5` 249 | - update `@types/jasmine` to `^3.5.7` 250 | - update `@types/node` to `^12.12.29` 251 | - update `ng-packagr` to `^9.0.2` 252 | - update `ngx-perfect-scrollbar` to `^9.0.0` 253 | 254 | ##### `v2.9.0` 255 | - chore: update to `Angular 9.0.0` 256 | - [https://update.angular.io/](https://update.angular.io/#8.0:9.0) 257 | - [https://angular.io/guide/updating-to-version-9](https://angular.io/guide/updating-to-version-9) 258 | - [https://blog.angular.io/version-9-of-angular-now-available-project-ivy-has-arrived](https://blog.angular.io/version-9-of-angular-now-available-project-ivy-has-arrived-23c97b63cfa3) 259 | 260 | - chore: update to `TypeScript 3.7` 261 | - [https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html) 262 | - [https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-6.html](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-6.html) 263 | 264 | ###### dependencies update 265 | - update `@angular/animations` to `~9.0.0` 266 | - update `@angular/common` to `~9.0.0` 267 | - update `@angular/compiler` to `~9.0.0` 268 | - update `@angular/core` to `~9.0.0` 269 | - update `@angular/forms` to `~9.0.0` 270 | - update `@angular/localize` to `^9.0.0` 271 | - update `@angular/platform-browser` to `~9.0.0` 272 | - update `@angular/platform-browser-dynamic` to `~9.0.0` 273 | - update `@angular/router` to `~9.0.0` 274 | - update `@angular-devkit/build-angular` to `~0.900.1` 275 | - update `@angular-devkit/build-ng-packagr` to `~0.900.1` 276 | - update `@angular/cli` to `~9.0.1` 277 | - update `@angular/compiler-cli` to `~9.0.0` 278 | - update `@angular/language-service` to `~9.0.0` 279 | - update `@types/node` to `^12.12.26` 280 | - update `@types/jasmine` to `~3.5.3` 281 | - update `karma-jasmine-html-reporter` to `^1.5.2` 282 | - update `ng-packagr` to `^9.0.0` 283 | - update `typescript` to `~3.7.5` 284 | 285 | ##### `v2.7.5` 286 | - chore: update to `Angular 9.0.0-rc.12` 287 | 288 | ###### dependencies update 289 | - update `@angular/animations` to `~9.0.0-rc.12` 290 | - update `@angular/common` to `~9.0.0-rc.12` 291 | - update `@angular/compiler` to `~9.0.0-rc.12` 292 | - update `@angular/core` to `~9.0.0-rc.12` 293 | - update `@angular/forms` to `~9.0.0-rc.12` 294 | - update `@angular/localize` to `^9.0.0-rc.12` 295 | - update `@angular/platform-browser` to `~9.0.0-rc.12` 296 | - update `@angular/platform-browser-dynamic` to `~9.0.0-rc.12` 297 | - update `@angular/router` to `~9.0.0-rc.12` 298 | - update `@angular-devkit/build-angular` to `~0.900.0-rc.12` 299 | - update `@angular-devkit/build-ng-packagr` to `~0.900.0-rc.12` 300 | - update `@angular/cli` to `~9.0.0-rc.12` 301 | - update `@angular/compiler-cli` to `~9.0.0-rc.12` 302 | - update `@angular/language-service` to `~9.0.0-rc.12` 303 | 304 | ##### `v2.7.4` 305 | - fix: add `SidebarNavHelper` to public-api surface - see: #67 306 | 307 | ##### `v2.7.3` 308 | - chore: update to `Angular 9.0.0-rc.9` 309 | - refactor: `@coreui/angular` components library 310 | - tests: fix and add some missing tests 311 | 312 | ###### dependencies update 313 | - update `@angular/animations` to `~9.0.0-rc.9` 314 | - update `@angular/common` to `~9.0.0-rc.9` 315 | - update `@angular/compiler` to `~9.0.0-rc.9` 316 | - update `@angular/core` to `~9.0.0-rc.9` 317 | - update `@angular/forms` to `~9.0.0-rc.9` 318 | - update `@angular/platform-browser` to `~9.0.0-rc.9` 319 | - update `@angular/platform-browser-dynamic` to `~9.0.0-rc.9` 320 | - update `@angular/router` to `~9.0.0-rc.9` 321 | - update `@angular-devkit/build-angular` to `~0.900.0-rc.9` 322 | - update `@angular-devkit/build-ng-packagr` to `~0.900.0-rc.9` 323 | - update `@angular/cli` to `~9.0.0-rc.9` 324 | - update `@angular/compiler-cli` to `~9.0.0-rc.9` 325 | - update `@angular/language-service` to `~9.0.0-rc.9` 326 | - update `@types/node` to `^12.11.1` 327 | - update `@types/jasmine` to `~3.5.0` 328 | - update `@types/jasminewd2` to `~2.0.3` 329 | - update `codelyzer` to `^5.1.2` 330 | - update `jasmine-core` to `~3.5.0` 331 | - update `jasmine-spec-reporter` to `~4.2.1` 332 | - update `karma` to `~4.3.0` 333 | - update `karma-chrome-launcher` to `~3.1.0` 334 | - update `karma-coverage-istanbul-reporter` to `~2.1.0` 335 | - update `ng-packagr` to `^9.0.0-rc.7` 336 | - update `protractor` to `~5.4.2` 337 | - update `ts-node` to `~8.3.0` 338 | - update `tslint` to `~5.18.0` 339 | 340 | ##### `v2.7.2` 341 | - fix(sidebar-nav): AppSidebarNavLabelComponent is not exported in the AppSidebarModule - thanks @zwiras #63 342 | 343 | ###### dependencies update 344 | - update `@angular/animations` to `^9.0.0-rc.7` 345 | - update `@angular/common` to `^9.0.0-rc.7` 346 | - update `@angular/compiler` to `^9.0.0-rc.7` 347 | - update `@angular/core` to `^9.0.0-rc.7` 348 | - update `@angular/forms` to `^9.0.0-rc.7` 349 | - update `@angular/platform-browser` to `^9.0.0-rc.7` 350 | - update `@angular/platform-browser-dynamic` to `^9.0.0-rc.7` 351 | - update `@angular/router` to `^9.0.0-rc.7` 352 | - update `@angular-devkit/build-angular` to `^0.900.0-rc.7` 353 | - update `@angular-devkit/build-ng-packagr` to `^0.900.0-rc.7` 354 | - update `@angular/cli` to `^9.0.0-rc.7` 355 | - update `@angular/compiler-cli` to `^9.0.0-rc.7` 356 | - update `@angular/language-service` to `^9.0.0-rc.7` 357 | - update `@types/node` to `^12.12.21` 358 | - update `codelyzer` to `^5.2.1` 359 | 360 | ##### `v2.7.1` 361 | - fix(sidebar-nav): @angular/router has no exported member QueryParamsHandling, see: 362 | - https://github.com/angular/angular/issues/30925 363 | - https://github.com/angular/angular/issues/30816 364 | 365 | ###### dependencies update 366 | - update `@angular/animations` to `^9.0.0-rc.5` 367 | - update `@angular/common` to `^9.0.0-rc.5` 368 | - update `@angular/compiler` to `^9.0.0-rc.5` 369 | - update `@angular/core` to `^9.0.0-rc.5` 370 | - update `@angular/forms` to `^9.0.0-rc.5` 371 | - update `@angular/platform-browser` to `^9.0.0-rc.5` 372 | - update `@angular/platform-browser-dynamic` to `^9.0.0-rc.5` 373 | - update `@angular/router` to `^9.0.0-rc.5` 374 | - update `core-js` to `^2.6.11` 375 | - update `@angular-devkit/build-angular` to `^0.900.0-rc.5` 376 | - update `@angular-devkit/build-ng-packagr` to `^0.900.0-rc.5` 377 | - update `@angular/cli` to `^9.0.0-rc.5` 378 | - update `@angular/compiler-cli` to `^9.0.0-rc.5` 379 | - update `@angular/language-service` to `^9.0.0-rc.5` 380 | - update `@types/jasmine` to `^3.5.0` 381 | - update `@types/node` to `^12.12.17` 382 | - update `karma-coverage-istanbul-reporter` to `^2.1.1` 383 | - update `ng-packagr` to `^9.0.0-rc.3` 384 | - update `ts-node` to `^8.5.4` 385 | - update `tslint` to `^5.20.1` 386 | 387 | ##### `v2.7.0` 388 | - chore: upgrade to Angular 9 - see also: 389 | - `https://next.angular.io/guide/updating-to-version-9` 390 | - `https://update.angular.io/#8.0:9.0` 391 | - add missing `@Injectable` decorator to `SidebarNavHelper` 392 | - add a generic type to `ModuleWithProviders` 393 | - tsconfig.lib `enableIvy: false` for library backward compatibility 394 | - tsconfig.lib `annotateForClosureCompiler: false` and remove `tsickle` dependency 395 | - move `tslib` to `dependencies` 396 | - tsconfig.app: add files[] 397 | - test: deprecate TestBed.get() use TestBed.inject() 398 | - refactor(SidebarNavItem): add INavData items type 399 | 400 | ###### dependencies update 401 | - update `@angular/animations` to `^9.0.0-rc.0` 402 | - update `@angular/common` to `^9.0.0-rc.0` 403 | - update `@angular/compiler` to `^9.0.0-rc.0` 404 | - update `@angular/core` to `^9.0.0-rc.0` 405 | - update `@angular/forms` to `^9.0.0-rc.0` 406 | - update `@angular/platform-browser` to `^9.0.0-rc.0` 407 | - update `@angular/platform-browser-dynamic` to `^9.0.0-rc.0` 408 | - update `@angular/router` to `^9.0.0-rc.0` 409 | - update `@angular-devkit/build-angular` to `~0.900.0-rc.0` 410 | - update `@angular-devkit/build-ng-packagr` to `~0.900.0-rc.0` 411 | - update `@angular/cli` to `^9.0.0-rc.0` 412 | - update `@angular/compiler-cli` to `^9.0.0-rc.0` 413 | - update `@angular/language-service` to `^9.0.0-rc.0` 414 | - update `ng-packagr` to `^9.0.0-rc.1` 415 | - update `typescript` to `~3.6.4" 416 | - update `@types/node` to `^12.11.1` 417 | - update `codelyzer` to `^5.1.2` 418 | - update `@coreui/coreui` to `^2.1.16` 419 | - update `@types/jasmine` to `^3.4.5` 420 | 421 | ##### `v2.6.3` 422 | - refactor: change renderer.addClass to HostBinding 423 | - test: add e2e test bed with some tests 424 | 425 | ###### dependencies update 426 | - update `@angular-devkit/build-angular` to `^0.803.14` 427 | - update `@angular-devkit/build-ng-packagr` to `^0.803.14` 428 | - update `@angular/cli` to `^8.3.14` 429 | - update `@angular/compiler-cli` to `^8.2.12` 430 | - update `@angular/language-service` to `^8.2.12` 431 | - update `@angular/animations` to `^8.2.12` 432 | - update `@angular/common` to `^8.2.12` 433 | - update `@angular/compiler` to `^8.2.12` 434 | - update `@angular/core` to `^8.2.12` 435 | - update `@angular/forms` to `^8.2.12` 436 | - update `@angular/platform-browser` to `^8.2.12` 437 | - update `@angular/platform-browser-dynamic` to `^8.2.12` 438 | - update `@angular/router` to `^8.2.12` 439 | - rollback `protractor` to `^5.4.2` 440 | - add `@coreui/coreui` (e2e) 441 | - add `simple-line-icons` (e2e) 442 | - add `ngx-perfect-scrollbar` (e2e) 443 | 444 | ##### `v2.6.2` 445 | - feat(Sidebar): `minimized` state @Input/@Output - thanks @Hagith #84 446 | - test(Sidebar): `minimized` state - thanks @Hagith #84 447 | - feat(SidebarService): add SidebarService with observable actions 448 | - refactor(Sidebar): inject SidebarService, subscribe and toggle action events 449 | - refactor(SidebarMinimizer): inject SidebarService, toggle action events 450 | - refactor(Sidebar): onDestroy remove minimized classes 451 | 452 | ###### dependencies update 453 | - update `@angular-devkit/build-angular` to `^0.803.13` 454 | - update `@angular-devkit/build-ng-packagr` to `^0.803.13` 455 | - update `@angular/cli` to `^8.3.13` 456 | - update `codelyzer` to `^5.2.0` 457 | - update `jasmine-core` to `^3.5.0` 458 | - update `jasmine-spec-reporter` to `^4.2.1` 459 | - update `karma` to `^4.4.1` 460 | - update `karma-chrome-launcher` to `^3.1.0` 461 | - update `karma-jasmine-html-reporter` to `^1.4.2` 462 | - update `protractor` to `^6.0.0` 463 | 464 | ##### `v2.6.1` 465 | - chore: add "cui" prefixed selector alias to all components - thanks @Hagith #80 466 | - fix(INavData): add missing `href` for explicit external links 467 | - refactor(SidebarNavLink): add `INavData` type to items, cleanup 468 | - test: add `test-lib` script & make it work - thanks @Hagith #83 469 | 470 | ###### dependencies update 471 | - update `@angular-devkit/build-angular` to `^0.803.12` 472 | - update `@angular-devkit/build-ng-packagr` to `^0.803.12` 473 | - update `@angular/cli` to `^8.3.12` 474 | - update `karma` to `^4.4.0` 475 | 476 | ##### `v2.6.0` 477 | - fix(SidebarNavLink): nav link target doesn't work through appHtmlAttr - thanks @Hagith #79 478 | - fix(SidebarNavLink): allow link parameters array 479 | - refactor(SidebarNavLink): extract disabled link type 480 | - fix(SidebarNavLink): test for item.attributes presence 481 | - refactor(SidebarNavLink): add `item.href` for explicit external links 482 | - refactor(SidebarNavLink): extract SidebarNavLinkContent component 483 | - fix(SidebarNavBadge): add missing badge.class prop 484 | - feat(SidebarNavLink): allow `routerLink` properties as `item.linkProps` 485 | - refactor(SidebarNavLink): `active` class workaround with NavigationEnd Observable 486 | - refactor(SidebarNavLink): add pipe SidebarNavLink 487 | 488 | ```typescript 489 | export interface INavLinkProps { 490 | queryParams?: {[k: string]: any}; 491 | fragment?: string; 492 | queryParamsHandling?: 'merge' | 'preserve' | ''; 493 | preserveFragment?: boolean; 494 | skipLocationChange?: boolean; 495 | replaceUrl?: boolean; 496 | state?: {[k: string]: any}; 497 | } 498 | ``` 499 | 500 | ###### dependencies update 501 | - update `@angular/animations` to `^8.2.11` 502 | - update `@angular/common` to `^8.2.11` 503 | - update `@angular/compiler` to `^8.2.11` 504 | - update `@angular/core` to `^8.2.11` 505 | - update `@angular/forms` to `^8.2.11` 506 | - update `@angular/platform-browser` to `^8.2.11` 507 | - update `@angular/platform-browser-dynamic` to `^8.2.11` 508 | - update `@angular/router` to `^8.2.11` 509 | - update `core-js` to `^2.6.10` 510 | - update `@angular-devkit/build-angular` to `^0.803.10` 511 | - update `@angular-devkit/build-ng-packagr` to `^0.803.10` 512 | - update `@angular/cli` to `^8.3.10` 513 | - update `@angular/compiler-cli` to `^8.2.11` 514 | - update `@angular/language-service` to `^8.2.11` 515 | - update `@types/jasmine` to `^3.4.4` 516 | - update `@types/jasminewd2` to `^2.0.8` 517 | - update `@types/node` to `^11.13.22` 518 | - update `codelyzer` to `^5.1.2` 519 | - update `ng-packagr` to `^5.7.0` 520 | 521 | ##### `v2.5.5` 522 | - fix: regression build issue - Please add a @NgModule annotation 523 | 524 | ##### `v2.5.4` 525 | - refactor(sidebar): move INavData interface to @coreui/angular library - thanks @Fredx87 #72 526 | - refactor(sidebar): add pipe SidebarNavItemClass #74 527 | - refactor(sidebar): use pipes in sidebar-nav-dropdown - thanks @coyoteecd #74 528 | - refactor(sidebar): use pipes in sidebar-nav-items pipe #74 529 | - refactor(sidebar): sidebar-nav-service cleanup 530 | - refactor: public_api 531 | 532 | ###### dependencies update 533 | - update `@angular/animations` to `^8.2.7` 534 | - update `@angular/common` to `^8.2.7` 535 | - update `@angular/compiler` to `^8.2.7` 536 | - update `@angular/core` to `^8.2.7` 537 | - update `@angular/forms` to `^8.2.7` 538 | - update `@angular/platform-browser` to `^8.2.7` 539 | - update `@angular/platform-browser-dynamic` to `^8.2.7` 540 | - update `@angular/router` to `^8.2.7` 541 | - update `rxjs` to `^6.5.3` 542 | - update `zone.js` to `^0.10.2` 543 | - update `@angular-devkit/build-angular` to `^0.803.5` 544 | - update `@angular-devkit/build-ng-packagr` to `^0.803.5` 545 | - update `@angular/cli` to `^8.3.5` 546 | - update `@angular/compiler-cli` to `^8.2.7` 547 | - update `@angular/language-service` to `^8.2.7` 548 | - update `@types/jasmine` to `^3.4.0` 549 | - update `@types/node` to `^11.13.20` 550 | - update `codelyzer` to `^5.1.1` 551 | - update `karma` to `^4.3.0` 552 | - update `ng-packagr` to `^5.5.1` 553 | - update `ts-node` to `^8.4.1` 554 | - update `tsickle` to `~0.37.0` 555 | - update `tslint` to `^5.20.0` 556 | 557 | ##### `v2.5.3` 558 | - fix(sidebar): performance issues with app-sidebar-nav components due to ngClass bindings - thanks @coyoteecd #74 559 | - fix(sidebar): app-sidebar-nav-label.component sets an incomplete variant style - thanks @coyoteecd closes #75 560 | 561 | ###### dependencies update 562 | - update `@angular/animations` to `^8.2.0` 563 | - update `@angular/common` to `^8.2.0` 564 | - update `@angular/compiler` to `^8.2.0` 565 | - update `@angular/core` to `^8.2.0` 566 | - update `@angular/forms` to `^8.2.0` 567 | - update `@angular/platform-browser` to `^8.2.0` 568 | - update `@angular/platform-browser-dynamic` to `^8.2.0` 569 | - update `@angular/router` to `^8.2.0` 570 | - update `zone.js` to `~0.10.0` 571 | - update `@angular-devkit/build-angular` to `^0.802.0` 572 | - update `@angular-devkit/build-ng-packagr` to `^0.802.0` 573 | - update `@angular/cli` to `^8.2.0` 574 | - update `@angular/compiler-cli` to `^8.2.0` 575 | - update `@angular/language-service` to `^8.2.0` 576 | - update `@types/jasmine` to `^3.3.16` 577 | - update `@types/node` to `^11.13.18` 578 | - update `karma` to `^4.2.0` 579 | - update `karma-coverage-istanbul-reporter` to `^2.1.0` 580 | - update `ng-packagr` to `^5.4.3` 581 | - update `tsickle` to `^0.36.0` 582 | - update `tslint` to `^5.18.0` 583 | 584 | ##### `v2.5.2` 585 | - refactor(AppHeader): add reactive toggler class based on breakpoint 586 | usage: set toggler breakpoint 587 | ```html 588 | 591 | 592 | ``` 593 | ###### dependencies update 594 | - update `@angular/animations` to `^8.0.2` 595 | - update `@angular/common` to `^8.0.2` 596 | - update `@angular/compiler` to `^8.0.2` 597 | - update `@angular/core` to `^8.0.2` 598 | - update `@angular/forms` to `^8.0.2` 599 | - update `@angular/platform-browser` to `^8.0.2` 600 | - update `@angular/platform-browser-dynamic` to `^8.0.2` 601 | - update `@angular/router` to `^8.0.2` 602 | - update `@angular-devkit/build-angular` to `^0.800.3` 603 | - update `@angular-devkit/build-ng-packagr` to `^0.800.3` 604 | - update `@angular/cli` to `^8.0.3` 605 | - update `@angular/compiler-cli` to `^8.0.2` 606 | - update `@angular/language-service` to `^8.0.2` 607 | - update `@types/node` to `^11.13.14` 608 | - update `ts-node` to `^8.3.0` 609 | - update `tslib` to `^1.10.0` 610 | 611 | ##### `v2.5.1` 612 | - fix(appHtmlAttr): cannot remove html attribute, 613 | ex: `attributes: {hidden: null}` removes attribute `hidden` 614 | 615 | ###### dependencies update 616 | - update `@angular-devkit/build-angular` to `^0.800.2` 617 | - update `@angular-devkit/build-ng-packagr` to `^0.800.2` 618 | - update `@angular/cli` to `^8.0.2` 619 | - update `ng-packagr` to `^5.3.0` 620 | 621 | ##### `v2.5.0` 622 | - chore: upgrade to Angular 8.0 - thanks @dennisameling 623 | - chore: move browserslist file 624 | - chore(tslint): cleanup unused/deprecated rules 625 | - chore(tsconfig): target update 626 | 627 | ###### dependencies update 628 | - update `@angular/animations` to `^8.0.0` 629 | - update `@angular/common` to `^8.0.0` 630 | - update `@angular/compiler` to `^8.0.0` 631 | - update `@angular/core` to `^8.0.0` 632 | - update `@angular/forms` to `^8.0.0` 633 | - update `@angular/platform-browser` to `^8.0.0` 634 | - update `@angular/platform-browser-dynamic` to `^8.0.0` 635 | - update `@angular/router` to `^8.0.0` 636 | - update `core-js` to `^2.6.9` 637 | - update `rxjs` to `^6.5.2` 638 | - update `zone.js` to `~0.9.1` 639 | - update `@angular-devkit/build-angular` to `~0.800.1` 640 | - update `@angular-devkit/build-ng-packagr` to `~0.800.1` 641 | - update `@angular/cli` to `^8.0.1` 642 | - update `@angular/compiler-cli` to `^8.0.0` 643 | - update `@angular/language-service` to `^8.0.0` 644 | - update `@types/jasmine` to `^3.3.13` 645 | - update `@types/node` to `^11.13.13` 646 | - update `codelyzer` to `^5.0.1` 647 | - update `jasmine-core` to `~3.4.0` 648 | - update `ng-packagr` to `^5.2.0` 649 | - update `tsickle` to `^0.35.0` 650 | - update `typescript` to `~3.4.5` 651 | 652 | ##### `v2.4.5` 653 | - chore(readme): npm badges 654 | - chore(readme): prerequisites 655 | - update: `@angular/animations` to `^7.2.10` 656 | - update: `@angular/common` to `^7.2.10` 657 | - update: `@angular/compiler` to `^7.2.10` 658 | - update: `@angular/core` to `^7.2.10` 659 | - update: `@angular/forms` to `^7.2.10` 660 | - update: `@angular/http` to `^7.2.10` 661 | - update: `@angular/platform-browser` to `^7.2.10` 662 | - update: `@angular/platform-browser-dynamic` to `^7.2.10` 663 | - update: `@angular/router` to `^7.2.10` 664 | - update: `@angular/compiler-cli` to `^7.2.10` 665 | - update: `@angular/language-service` to `^7.2.10` 666 | - update: `@types/jasmine` to `^3.3.12` 667 | - update: `@types/node` to `^11.11.4` 668 | 669 | ##### `v2.4.4` 670 | - fix(breadcrumb.service): wrong import from `rxjs` causes overhead in resulted bundle - fixes #22 thanks @sparun160782 @lscorcia @nazar-kuzo 671 | - update: `@angular/animations` to `^7.2.9` 672 | - update: `@angular/common` to `^7.2.9` 673 | - update: `@angular/compiler` to `^7.2.9` 674 | - update: `@angular/core` to `^7.2.9` 675 | - update: `@angular/forms` to `^7.2.9` 676 | - update: `@angular/http` to `^7.2.9` 677 | - update: `@angular/platform-browser` to `^7.2.9` 678 | - update: `@angular/platform-browser-dynamic` to `^7.2.9` 679 | - update: `@angular/router` to `^7.2.9` 680 | - update: `@angular-devkit/build-angular` to `^0.13.6` 681 | - update: `@angular-devkit/build-ng-packagr` to `^0.13.6` 682 | - update: `@angular/cli` to `^7.3.6` 683 | - update: `@angular/compiler-cli` to `^7.2.9` 684 | - update: `@angular/language-service` to `^7.2.9` 685 | - update: `@types/jasmine` to `^3.3.10` 686 | - update: `@types/node` to `^11.11.3` 687 | - update: `karma` to `^4.0.1` 688 | - update: `ts-node` to `^8.0.3` 689 | - update: `tslint` to `^5.14.0` 690 | 691 | ##### `v2.4.3` 692 | - update: `@coreui/coreui` to `^2.1.7` 693 | - update: `@angular/animations` to `^7.2.6` 694 | - update: `@angular/common` to `^7.2.6` 695 | - update: `@angular/compiler` to `^7.2.6` 696 | - update: `@angular/core` to `^7.2.6` 697 | - update: `@angular/forms` to `^7.2.6` 698 | - update: `@angular/http` to `^7.2.6` 699 | - update: `@angular/platform-browser` to `^7.2.6` 700 | - update: `@angular/platform-browser-dynamic` to `^7.2.6` 701 | - update: `@angular/router` to `^7.2.6` 702 | - update: `@angular-devkit/build-angular` to `^0.13.3` 703 | - update: `@angular-devkit/build-ng-packagr` to `^0.13.3` 704 | - update: `@angular/cli` to `^7.3.3` 705 | - update: `@angular/compiler-cli` to `^7.2.6` 706 | - update: `@angular/language-service` to `^7.2.6` 707 | 708 | ##### `v2.4.2` 709 | - feat(header): use routerLink for brand instead of href attribute #51 - thanks @Hagith 710 | 711 | ##### `v2.4.1` 712 | - fix(sidebar-nav): ie issues 713 | 714 | ##### `v2.4.0` 715 | `dist` is the same as `v2.4.0-beta.1` 716 | - update: `@angular/animations` to `^7.2.5` 717 | - update: `@angular/common` to `^7.2.5` 718 | - update: `@angular/compiler` to `^7.2.5` 719 | - update: `@angular/core` to `^7.2.5` 720 | - update: `@angular/forms` to `^7.2.5` 721 | - update: `@angular/http` to `^7.2.5` 722 | - update: `@angular/platform-browser` to `^7.2.5` 723 | - update: `@angular/platform-browser-dynamic` to `^7.2.5` 724 | - update: `@angular/router` to `^7.2.5` 725 | - update: `@angular-devkit/build-angular` to `^0.13.2` 726 | - update: `@angular-devkit/build-ng-packagr` to `^0.13.2` 727 | - update: `@angular/cli` to `^7.3.2` 728 | - update: `@angular/compiler-cli` to `^7.2.5` 729 | - update: `@angular/language-service` to `^7.2.5` 730 | - update: `@types/node` to `^11.9.4` 731 | - update: `karma` to `^4.0.0` 732 | - update: `karma-coverage-istanbul-reporter` to `^2.0.5` 733 | 734 | ##### `v2.4.0-beta.1` 735 | - fix(sidebar): navItems reassignment bug [#126](https://github.com/coreui/coreui-free-angular-admin-template/issues/126), [#42](https://github.com/coreui/coreui-free-angular-admin-template/issues/42), #12 736 | - refactor(aside): drop `Replace` 737 | - refactor(breadcrumb): drop `Replace` new component `cui-breadcrumb` (migration needed) 738 | - refactor(footer): minor changes 739 | - refactor(header): drop `Replace` 740 | - refactor(layout): cleanup 741 | - refactor(sidebar-nav): drop `Replace`, redesign 742 | - update: `@angular/animations` to `^7.2.4` 743 | - update: `@angular/common` to `^7.2.4` 744 | - update: `@angular/compiler` to `^7.2.4` 745 | - update: `@angular/core` to `^7.2.4` 746 | - update: `@angular/forms` to `^7.2.4` 747 | - update: `@angular/http` to `^7.2.4` 748 | - update: `@angular/platform-browser` to `^7.2.4` 749 | - update: `@angular/platform-browser-dynamic` to `^7.2.4` 750 | - update: `@angular/router` to `^7.2.4` 751 | - update: `core-js` to `^2.6.5` 752 | - update: `@angular-devkit/build-angular` to `^0.13.1` 753 | - update: `@angular-devkit/build-ng-packagr` to `^0.13.1` 754 | - update: `@angular/cli` to `^7.3.1` 755 | - update: `@angular/compiler-cli` to `^7.2.4` 756 | - update: `@angular/language-service` to `^7.2.4` 757 | - update: `@types/jasmine` to `^3.3.9` 758 | - update: `@types/node` to `^10.12.26` 759 | - update: `ng-packagr` to `^4.7.1` 760 | 761 | ##### `v2.3.1` 762 | - fix: faulty LayoutModule import causes: Unexpected value 'undefined' imported by the module #47 763 | - refactor(appSidebarToggler): inject `ClassToggler` instead of ToggleClasses function 764 | - fix: should not throw errors when navItems are undefined - #46 thanks @fluffynuts 765 | 766 | ##### `v2.3.0` 767 | - feat(app-header): navbarBrand img use appHtmlAttr instead of attr.* 768 | - refactor: directive appLinkAttributes -> appHtmlAttr, moved to layout 769 | - refactor(app-header): drop unused methods 770 | - refactor(sidebar-nav): directive appLinkAttributes -> appHtmlAttr 771 | - refactor(app-footer): drop Replace footer 772 | - update: `@angular-devkit/build-angular` to `^0.13.0` 773 | - update: `@angular-devkit/build-ng-packagr` to `^0.13.0` 774 | - update: `@types/node` to `^10.12.21` 775 | 776 | ##### `v2.2.5` 777 | - refactor: use Renderer2 instead of direct DOM manipulation 778 | - refactor: use DOCUMENT dependency injection 779 | - update: `@angular/animations` to `^7.2.3` 780 | - update: `@angular/common` to `^7.2.3` 781 | - update: `@angular/compiler` to `^7.2.3` 782 | - update: `@angular/core` to `^7.2.3` 783 | - update: `@angular/forms` to `^7.2.3` 784 | - update: `@angular/http` to `^7.2.3` 785 | - update: `@angular/platform-browser` to `^7.2.3` 786 | - update: `@angular/platform-browser-dynamic` to `^7.2.3` 787 | - update: `@angular/router` to `^7.2.3` 788 | - update: `core-js` to `^2.6.3` 789 | - update: `rxjs` to `^6.4.0` 790 | - update: `zone.js` to `^0.8.29` 791 | - update: `@angular-devkit/build-angular` to `^0.12.4` 792 | - update: `@angular-devkit/build-ng-packagr` to `^0.12.4` 793 | - update: `@angular/cli` to `^7.3.0` 794 | - update: `@angular/compiler-cli` to `^7.2.3` 795 | - update: `@angular/language-service` to `^7.2.3` 796 | - update: `@types/jasmine` to `^3.3.8` 797 | - update: `@types/node` to `^10.12.20` 798 | - update: `ng-packagr` to `^4.7.0` 799 | 800 | ##### `v2.2.4` 801 | - update: `typescript` to `~3.2.4` 802 | - update: `@angular/animations` to `^7.2.1` 803 | - update: `@angular/common` to `^7.2.1` 804 | - update: `@angular/compiler` to `^7.2.1` 805 | - update: `@angular/core` to `^7.2.1` 806 | - update: `@angular/forms` to `^7.2.1` 807 | - update: `@angular/http` to `^7.2.1` 808 | - update: `@angular/platform-browser` to `^7.2.1` 809 | - update: `@angular/platform-browser-dynamic` to `^7.2.1` 810 | - update: `@angular/router` to `^7.2.1` 811 | - update: `zone.js` to `^0.8.28` 812 | - update: `@angular-devkit/build-angular` to `^0.12.2` 813 | - update: `@angular-devkit/build-ng-packagr` to `^0.12.2` 814 | - update: `@angular/cli` to `^7.2.2` 815 | - update: `@angular/compiler-cli` to `^7.2.1` 816 | - update: `@angular/language-service` to `^7.2.1` 817 | - update: `@types/jasmine` to `^3.3.6` 818 | - update: `ng-packagr` to `^4.6.0` 819 | 820 | ##### `v2.2.3` 821 | - refactor(app-sidebar-nav): minor changes 822 | - update: `@coreui/coreui` to `^2.1.6` 823 | - update: `@angular/animations` to `^7.2.0` 824 | - update: `@angular/common` to `^7.2.0` 825 | - update: `@angular/compiler` to `^7.2.0` 826 | - update: `@angular/core` to `^7.2.0` 827 | - update: `@angular/forms` to `^7.2.0` 828 | - update: `@angular/http` to `^7.2.0` 829 | - update: `@angular/platform-browser` to `^7.2.0` 830 | - update: `@angular/platform-browser-dynamic` to `^7.2.0` 831 | - update: `@angular/router` to `^7.2.0` 832 | - update: `core-js` to `^2.6.2` 833 | - update: `zone.js` to `^0.8.27` 834 | - update: `@angular-devkit/build-angular` to `^0.12.1` 835 | - update: `@angular-devkit/build-ng-packagr` to `^0.12.1` 836 | - update: `@angular/cli` to `^7.2.1` 837 | - update: `@angular/compiler-cli` to `^7.2.0` 838 | - update: `@angular/language-service` to `^7.2.0` 839 | - update: `@types/jasmine` to `^3.3.5` 840 | - update: `@types/node` to `^10.12.18` 841 | 842 | ##### `v2.2.2` 843 | - refactor(app-header): new prop `navbarBrandText` = {icon: 'C', text: 'CoreUI'} render as innerHTML 844 | - refactor(app-header): new prop `navbarBrandHref` = '' 845 | - refactor(app-header): `navbarBrandImg`: Boolean 846 | - fix(app-sidebar): missing semicolon 847 | - fix(angular.json): missing css path 848 | - update: `@angular/animations` to `7.1.4` 849 | - update: `@angular/common` to `7.1.4` 850 | - update: `@angular/compiler` to `7.1.4` 851 | - update: `@angular/core` to `7.1.4` 852 | - update: `@angular/forms` to `7.1.4` 853 | - update: `@angular/http` to `7.1.4` 854 | - update: `@angular/platform-browser` to `7.1.4` 855 | - update: `@angular/platform-browser-dynamic` to `7.1.4` 856 | - update: `@angular/router` to `7.1.4` 857 | - update: `core-js` to `2.6.1` 858 | - update: `@angular-devkit/build-angular` to `0.11.3` 859 | - update: `@angular-devkit/build-ng-packagr` to `0.11.3` 860 | - update: `@angular/cli` to `7.1.3` 861 | - update: `@angular/compiler-cli` to `7.1.4` 862 | - update: `@angular/language-service` to `7.1.4` 863 | - update: `@types/jasmine` to `3.3.4` 864 | - update: `@types/node` to `10.12.17` 865 | - update: `karma` to `3.1.4` 866 | - update: `tslint` to `5.12.0` 867 | 868 | ##### `v2.2.1` 869 | - fix: remove `-fixed` class on layout components destroy 870 | - chore: commit `package-lock.json` 871 | - chore: add [README](./projects/coreui/angular/README.md) 872 | - update: `core-js` to `2.6.0` 873 | - update: `@angular-devkit/build-angular` to `0.11.1` 874 | - update: `@angular-devkit/build-ng-packagr` to `0.11.1` 875 | - update: `@angular/cli` to `7.1.1` 876 | - update: `@types/jasmine` to `3.3.1` 877 | - update: `@types/node` to `10.12.12` 878 | 879 | ##### `v2.2.0` 880 | - chore: build with Angular 7 881 | - chore: update Angular to `^7.1.0` see: https://update.angular.io/ 882 | - update: `@angular/animations` to `^7.1.1` 883 | - update: `@angular/common` to `^7.1.1` 884 | - update: `@angular/compiler` to `^7.1.1` 885 | - update: `@angular/core` to `^7.1.1` 886 | - update: `@angular/forms` to `^7.1.1` 887 | - update: `@angular/http` to `^7.1.1` 888 | - update: `@angular/platform-browser` to `^7.1.1` 889 | - update: `@angular/platform-browser-dynamic` to `^7.1.1` 890 | - update: `@angular/router` to `^7.1.1` 891 | - update: `@angular-devkit/build-angular` to `~0.11.0` 892 | - update: `@angular-devkit/build-ng-packagr` to `~0.11.0` 893 | - update: `@angular/cli` to `^7.1.0` 894 | - update: `@angular/compiler-cli` to `^7.1.1` 895 | - update: `@angular/language-service` to `^7.1.1` 896 | - update: `@types/jasmine` to `~3.3.0` 897 | - update: `karma` to `^3.1.3` 898 | - update: `karma-jasmine` to `~2.0.1` 899 | - update: `ng-packagr` to `^4.4.5` 900 | - update: `ts-node` to `~7.0.1` 901 | - update: `typescript` to `^3.1.6" 902 | 903 | ##### `v2.1.0` 904 | - feat: sidebar nav-link `attributes` - optional JS object with valid JS API naming: 905 | - valid attributes: `rel`, `target`, `hidden`, `disabled`, etc... 906 | - item example: 907 | ``` 908 | ... 909 | { 910 | name: 'Try CoreUI PRO', 911 | url: 'https://coreui.io/pro/react/', 912 | icon: 'cui-layers icons', 913 | variant: 'danger', 914 | attributes: { target: '_blank', rel: "noopener" }, 915 | }, 916 | .... 917 | ``` 918 | - update `@coreui/coreui` to `2.1.3` 919 | - update `rxjs` to `^6.3.3` 920 | - update `@angular-devkit/build-angular` to `~0.8.8` 921 | - update `@angular-devkit/build-ng-packagr` to `~0.8.8` 922 | - update `@angular/cli` to `^6.2.8` 923 | - update `@types/jasmine` to `~2.8.12` 924 | - update `@types/jasminewd2` to `~2.0.6` 925 | - update `@types/node` to `~10.12.10` 926 | - update `jasmine-core` to `~3.3.0` 927 | - update `karma-jasmine-html-reporter` to `^1.4.0` 928 | - update `ng-packagr` to `^3.0.6` 929 | - update `shelljs` to `^0.8.3` 930 | - update `ts-node` to `~6.2.0` 931 | - update `tsickle` to `^0.34.0` 932 | - update `typescript` to `~2.9.2` 933 | 934 | -------------------------------------------------------------------------------- /CLI.md: -------------------------------------------------------------------------------- 1 | # Angular 2 | 3 | This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.0-rc.9. 4 | 5 | ## Code scaffolding 6 | 7 | Run `ng generate component component-name --project angular` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project angular`. 8 | > Note: Don't forget to add `--project angular` or else it will be added to the default project in your `angular.json` file. 9 | 10 | ## Build 11 | 12 | Run `ng build angular` to build the project. The build artifacts will be stored in the `dist/` directory. 13 | 14 | ## Publishing 15 | 16 | After building your library with `ng build angular`, go to the dist folder `cd dist/angular` and run `npm publish`. 17 | 18 | ## Running unit tests 19 | 20 | Run `ng test angular` to execute the unit tests via [Karma](https://karma-runner.github.io). 21 | 22 | ## Further help 23 | 24 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). 25 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as 6 | contributors and maintainers pledge to making participation in our project and 7 | our community a harassment-free experience for everyone, regardless of age, body 8 | size, disability, ethnicity, gender identity and expression, level of experience, 9 | education, socio-economic status, nationality, personal appearance, race, 10 | religion, or sexual identity and orientation. 11 | 12 | ## Our Standards 13 | 14 | Examples of behavior that contributes to creating a positive environment 15 | include: 16 | 17 | * Using welcoming and inclusive language 18 | * Being respectful of differing viewpoints and experiences 19 | * Gracefully accepting constructive criticism 20 | * Focusing on what is best for the community 21 | * Showing empathy towards other community members 22 | 23 | Examples of unacceptable behavior by participants include: 24 | 25 | * The use of sexualized language or imagery and unwelcome sexual attention or 26 | advances 27 | * Trolling, insulting/derogatory comments, and personal or political attacks 28 | * Public or private harassment 29 | * Publishing others' private information, such as a physical or electronic 30 | address, without explicit permission 31 | * Other conduct which could reasonably be considered inappropriate in a 32 | professional setting 33 | 34 | ## Our Responsibilities 35 | 36 | Project maintainers are responsible for clarifying the standards of acceptable 37 | behavior and are expected to take appropriate and fair corrective action in 38 | response to any instances of unacceptable behavior. 39 | 40 | Project maintainers have the right and responsibility to remove, edit, or 41 | reject comments, commits, code, wiki edits, issues, and other contributions 42 | that are not aligned to this Code of Conduct, or to ban temporarily or 43 | permanently any contributor for other behaviors that they deem inappropriate, 44 | threatening, offensive, or harmful. 45 | 46 | ## Scope 47 | 48 | This Code of Conduct applies both within project spaces and in public spaces 49 | when an individual is representing the project or its community. Examples of 50 | representing a project or community include using an official project e-mail 51 | address, posting via an official social media account, or acting as an appointed 52 | representative at an online or offline event. Representation of a project may be 53 | further defined and clarified by project maintainers. 54 | 55 | ## Enforcement 56 | 57 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 58 | reported by contacting the project team at [INSERT EMAIL ADDRESS]. All 59 | complaints will be reviewed and investigated and will result in a response that 60 | is deemed necessary and appropriate to the circumstances. The project team is 61 | obligated to maintain confidentiality with regard to the reporter of an incident. 62 | Further details of specific enforcement policies may be posted separately. 63 | 64 | Project maintainers who do not follow or enforce the Code of Conduct in good 65 | faith may face temporary or permanent repercussions as determined by other 66 | members of the project's leadership. 67 | 68 | ## Attribution 69 | 70 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 71 | available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html 72 | 73 | [homepage]: https://www.contributor-covenant.org 74 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing to CoreUI for Angular 2 | 3 | Looking to contribute something to CoreUI? **Here's how you can help.** 4 | 5 | Please take a moment to review this document in order to make the contribution process easy and effective for everyone involved. 6 | 7 | Following these guidelines helps to communicate that you respect the time of the developers managing and developing this open source project. In return, they should reciprocate that respect in addressing your issue or assessing 8 | patches and features. 9 | 10 | ## Using the issue tracker 11 | 12 | The [issue tracker](https://github.com/coreui/coreui-angular/issues) is 13 | the preferred channel for [bug reports](#bug-reports), [features requests](#feature-requests) 14 | and [submitting pull requests](#pull-requests), but please respect the following 15 | restrictions: 16 | 17 | * Please **do not** use the issue tracker for personal support requests. 18 | 19 | * Please **do not** post comments consisting solely of "+1" or ":thumbsup:". 20 | Use [GitHub's "reactions" feature](https://github.com/blog/2119-add-reactions-to-pull-requests-issues-and-comments) 21 | instead. 22 | 23 | ## Bug reports 24 | 25 | A bug is a _demonstrable problem_ that is caused by the code in the repository. 26 | Good bug reports are extremely helpful, so thanks! 27 | 28 | Guidelines for bug reports: 29 | 30 | 0. **Validate and lint your code** — to ensure your problem isn't caused by a simple error in your own code. 31 | 32 | 1. **Use the GitHub issue search** — check if the issue has already been reported. 33 | 34 | 2. **Check if the issue has been fixed** — try to reproduce it using the latest `master` or development branch in the repository. 35 | 36 | 3. **Isolate the problem** — ideally create a [reduced test case](https://css-tricks.com/reduced-test-cases/) and a live example. [This JS Bin](http://jsbin.com/lefey/1/edit?html,output) is a helpful template. 37 | 38 | 39 | A good bug report shouldn't leave others needing to chase you up for more 40 | information. Please try to be as detailed as possible in your report. What is 41 | your environment? What steps will reproduce the issue? What browser(s) and OS 42 | experience the problem? Do other browsers show the bug differently? What 43 | would you expect to be the outcome? All these details will help people to fix 44 | any potential bugs. 45 | 46 | Example: 47 | 48 | > Short and descriptive example bug report title 49 | > 50 | > A summary of the issue and the browser/OS environment in which it occurs. If 51 | > suitable, include the steps required to reproduce the bug. 52 | > 53 | > 1. This is the first step 54 | > 2. This is the second step 55 | > 3. Further steps, etc. 56 | > 57 | > `` - a link to the reduced test case 58 | > 59 | > Any other information you want to share that is relevant to the issue being 60 | > reported. This might include the lines of code that you have identified as 61 | > causing the bug, and potential solutions (and your opinions on their 62 | > merits). 63 | 64 | ## Feature requests 65 | 66 | Feature requests are welcome. Before opening a feature request, please take a 67 | moment to find out whether your idea fits with the scope and aims of the 68 | project. It's up to *you* to make a strong case to convince the project's 69 | developers of the merits of this feature. Please provide as much detail 70 | and context as possible. 71 | 72 | 73 | ## Pull requests 74 | 75 | Good pull requests—patches, improvements, new features—are a fantastic 76 | help. They should remain focused in scope and avoid containing unrelated 77 | commits. 78 | 79 | **Please ask first** before embarking on any significant pull request (e.g. 80 | implementing features, refactoring code, porting to a different language), 81 | otherwise you risk spending a lot of time working on something that the 82 | project's developers might not want to merge into the project. 83 | 84 | Adhering to the following process is the best way to get your work 85 | included in the project: 86 | 87 | 1. [Fork](https://help.github.com/fork-a-repo/) the project, clone your fork, 88 | and configure the remotes: 89 | 90 | ```bash 91 | # Clone your fork of the repo into the current directory 92 | git clone https://github.com//coreui-angular.git 93 | # Navigate to the newly cloned directory 94 | cd coreui 95 | # Assign the original repo to a remote called "upstream" 96 | git remote add upstream https://github.com/coreui/coreui-angular.git 97 | ``` 98 | 99 | 2. If you cloned a while ago, get the latest changes from upstream: 100 | 101 | ```bash 102 | git checkout master 103 | git pull upstream master 104 | ``` 105 | 106 | 3. Create a new topic branch (off the main project development branch) to 107 | contain your feature, change, or fix: 108 | 109 | ```bash 110 | git checkout -b 111 | ``` 112 | 113 | 4. Commit your changes in logical chunks. Please adhere to these [git commit 114 | message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html) 115 | or your code is unlikely to be merged into the main project. Use Git's 116 | [interactive rebase](https://help.github.com/articles/interactive-rebase) 117 | feature to tidy up your commits before making them public. 118 | 119 | 5. Locally merge (or rebase) the upstream development branch into your topic branch: 120 | 121 | ```bash 122 | git pull [--rebase] upstream master 123 | ``` 124 | 125 | 6. Push your topic branch up to your fork: 126 | 127 | ```bash 128 | git push origin 129 | ``` 130 | 131 | 7. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/) 132 | with a clear title and description against the `master` branch. 133 | 134 | **IMPORTANT**: By submitting a patch, you agree to allow the project owners to 135 | license your work under the terms of the [MIT License](LICENSE). 136 | 137 | ### Semantic Git commit messages 138 | 139 | Inspired by Sparkbox's awesome article on 140 | [semantic commit messages](http://seesparkbox.com/foundry/semantic_commit_messages). 141 | Please use following commit message format. 142 | 143 | * chore (updating npm tasks etc; no production code change) -> ```git test -m 'chore: commit-message-here'``` 144 | * docs (changes to documentation) -> ```git commit -m 'docs: commit-message-here'``` 145 | * feat (new feature) -> ```git commit -m 'feat: commit-message-here'``` 146 | * fix (bug fix) -> ```git commit -m 'fix: commit-message-here'``` 147 | * refactor (refactoring production code) -> ```git commit -m 'refactor: commit-message-here'``` 148 | * style (formatting, missing semi colons, etc; no code change) -> ```git commit -m 'style: commit-message-here'``` 149 | * test (adding missing tests, refactoring tests; no production code change) -> ```git test -m 'refactor: commit-message-here'``` 150 | 151 | ## Code guidelines 152 | 153 | ### HTML 154 | 155 | [Adhere to the Code Guide.](http://codeguide.co/#html) 156 | 157 | - Use tags and elements appropriate for an HTML5 doctype (e.g., self-closing tags). 158 | - Use CDNs and HTTPS for third-party JS when possible. We don't use protocol-relative URLs in this case because they break when viewing the page locally via `file://`. 159 | - Use [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) attributes in documentation examples to promote accessibility. 160 | 161 | ### CSS 162 | 163 | [Adhere to the Code Guide.](http://codeguide.co/#css) 164 | 165 | - When feasible, default color palettes should comply with [WCAG color contrast guidelines](http://www.w3.org/TR/WCAG20/#visual-audio-contrast). 166 | - Except in rare cases, don't remove default `:focus` styles (via e.g. `outline: none;`) without providing alternative styles. See [this A11Y Project post](http://a11yproject.com/posts/never-remove-css-outlines) for more details. 167 | 168 | ### TS 169 | 170 | - 2 spaces (no tabs) 171 | - strict mode 172 | - "Attractive" 173 | - Don't use [jQuery event alias convenience methods](https://github.com/jquery/jquery/blob/master/src/event/alias.js) (such as `$().focus()`). Instead, use [`$().trigger(eventType, ...)`](http://api.jquery.com/trigger/) or [`$().on(eventType, ...)`](http://api.jquery.com/on/), depending on whether you're firing an event or listening for an event. (For example, `$().trigger('focus')` or `$().on('focus', function (event) { /* handle focus event */ })`) We do this to be compatible with custom builds of jQuery where the event aliases module has been excluded. 174 | 175 | ## License 176 | 177 | By contributing your code, you agree to license your contribution under the [MIT License](LICENSE). 178 | -------------------------------------------------------------------------------- /ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | Before opening an issue: 2 | 3 | - [Search for duplicate or closed issues](https://github.com/coreui/coreui-angular/issues?utf8=%E2%9C%93&q=is%3Aissue) 4 | - Prepare a [reduced test case](https://css-tricks.com/reduced-test-cases/) for any bugs 5 | - Read the [contributing guidelines](https://github.com/coreui/coreui-angular/blob/master/CONTRIBUTING.md) 6 | 7 | When asking general "how to" questions: 8 | 9 | - Please do not open an issue here 10 | - Instead, ask for help on [StackOverflow, IRC, or Slack](https://github.com/coreui/coreui-angular/blob/master/README.md#community) 11 | 12 | When reporting a bug, include: 13 | 14 | - Operating system and version (Windows, Mac OS X, Android, iOS, Win10 Mobile) 15 | - Browser and version (Chrome, Firefox, Safari, IE, MS Edge, Opera 15+, Android Browser) 16 | - Reduced test cases and potential fixes using [CodePen](https://codepen.io/) or [JS Bin](https://jsbin.com/) 17 | 18 | When suggesting a feature, include: 19 | 20 | - As much detail as possible for what we should add and why it's important to CoreUI 21 | - Relevant links to prior art, screenshots, or live demos whenever possible 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [@coreui/angular](https://coreui.io/angular) 2 | 3 | [![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] 4 | [![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] 5 | ![angular](https://img.shields.io/badge/angular-^11.2.0-lightgrey.svg?style=flat-square&logo=angular) 6 | [![npm-coreui-angular-next][npm-coreui-angular-badge-next]][npm-coreui-angular] 7 | [![@coreui coreui](https://img.shields.io/badge/@coreui%20-coreui-lightgrey.svg?style=flat-square)](https://github.com/coreui/coreui) 8 | [![npm package][npm-coreui-badge]][npm-coreui] 9 | [![NPM downloads][npm-coreui-download]][npm-coreui] 10 | 11 | [npm-coreui-angular]: https://www.npmjs.com/package/@coreui/angular 12 | [npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red 13 | [npm-coreui-angular-badge-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square&color=red 14 | [npm-coreui-angular-download]: https://img.shields.io/npm/dm/@coreui/angular.svg?style=flat-square 15 | [npm-coreui-angular-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square 16 | [npm-coreui]: https://www.npmjs.com/package/@coreui/coreui 17 | [npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui.png?style=flat-square 18 | [npm-coreui-download]: https://img.shields.io/npm/dm/@coreui/coreui.svg?style=flat-square 19 | 20 | # 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) 21 | 22 | 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! 23 | 24 | Curious why I decided to create CoreUI? Please read this article: [Jack of all trades, master of none. Why Bootstrap Admin Templates suck.](https://medium.com/@lukaszholeczek/jack-of-all-trades-master-of-none-5ea53ef8a1f#.7eqx1bcd8) 25 | 26 | CoreUI is an Open Source UI Kit built on top of Bootstrap 4. CoreUI is the fastest way to build modern dashboard for any platforms, browser or device. A complete Dashboard and WebApp UI Kit that allows you to quickly build eye-catching, high-quality, high-performance responsive applications using your framework of choice. 27 | 28 | ## Table of Contents 29 | 30 | * [Templates](#templates) 31 | * [Admin Templates built on top of CoreUI Pro](#admin-templates-built-on-top-of-coreui-pro) 32 | * [Prerequisites](#prerequisites) 33 | * [Installation](#coreui-installation) 34 | * [Usage](#usage) 35 | * [What's included](#whats-included) 36 | * [Documentation](#documentation) 37 | * [Contributing](#contributing) 38 | * [Versioning](#versioning) 39 | * [Creators](#creators) 40 | * [Community](#community) 41 | * [License](#license) 42 | * [Support CoreUI Development](#support-coreui-development) 43 | 44 | ## Templates 45 | 46 | * [CoreUI Free Angular Admin Template](https://github.com/coreui/coreui-free-angular-admin-template) 47 | * 💪 [CoreUI Pro Angular Admin Template](https://coreui.io/pro/angular/) 48 | 49 | ## Admin Templates built on top of CoreUI Pro 50 | 51 | | CoreUI Pro | Prime | Root | Alba | Leaf | 52 | | --- | --- | --- | --- | --- | 53 | | [![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) 54 | 55 | #### Prerequisites 56 | Before you begin, make sure your development environment includes `Node.js®` and an `npm` package manager. 57 | 58 | ###### Node.js 59 | Angular 11 requires `Node.js` version 10.13 or later. 60 | 61 | - To check your version, run `node -v` in a terminal/console window. 62 | - To get `Node.js`, go to [nodejs.org](https://nodejs.org/). 63 | 64 | ###### Angular CLI 65 | Install the Angular CLI globally using a terminal/console window. 66 | ```bash 67 | npm install -g @angular/cli 68 | ``` 69 | 70 | ##### Update to Angular 11 71 | see: [https://update.angular.io](https://update.angular.io) 72 | 73 | ## CoreUI Installation 74 | 75 | Several options are available: 76 | 77 | ### Clone repo 78 | 79 | ``` bash 80 | $ git clone https://github.com/coreui/coreui-angular.git 81 | ``` 82 | 83 | ### NPM 84 | 85 | ``` bash 86 | $ npm install @coreui/angular --save 87 | ``` 88 | 89 | ### Yarn 90 | 91 | ``` bash 92 | $ yarn add @coreui/angular 93 | ``` 94 | 95 | ## Usage 96 | 97 | ### CSS 98 | 99 | Copy-paste the stylesheet `` into your `` before all other stylesheets to load our CSS. 100 | 101 | ``` html 102 | 103 | ``` 104 | 105 | ## What's included 106 | 107 | Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this: 108 | 109 | ``` 110 | coreui/ 111 | ├── build/ 112 | ├── dist/ 113 | ├── scripts/ 114 | └── src/ 115 | ``` 116 | 117 | ## Documentation 118 | 119 | The documentation for the CoreUI Free Bootstrap Admin Template is hosted at our website [CoreUI](https://coreui.io/angular/) 120 | 121 | ## Contributing 122 | 123 | Please read through our [contributing guidelines](https://github.com/coreui/coreui-angular/blob/master/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development. 124 | 125 | Editor preferences are available in the [editor config](https://github.com/coreui/coreui-angular/blob/master/.editorconfig) for easy use in common text editors. Read more and download plugins at . 126 | 127 | ## Versioning 128 | 129 | For transparency into our release cycle and in striving to maintain backward compatibility,CoreUI Free Admin Template is maintained under [the Semantic Versioning guidelines](http://semver.org/). 130 | 131 | See [the Releases section of our project](https://github.com/coreui/coreui-angular/releases) for changelogs for each release version. 132 | 133 | ## Creators 134 | 135 | **Łukasz Holeczek** 136 | 137 | * 138 | * 139 | 140 | **Andrzej Kopański** 141 | 142 | * 143 | 144 | ## Community 145 | 146 | Get updates on CoreUI's development and chat with the project maintainers and community members. 147 | 148 | - Follow [@core_ui on Twitter](https://twitter.com/core_ui). 149 | - Read and subscribe to [CoreUI Blog](https://coreui.io/blog/). 150 | 151 | ## Copyright and license 152 | 153 | copyright 2017-2021 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-angular/blob/master/LICENSE). 154 | 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. 155 | 156 | ## Support CoreUI Development 157 | 158 | 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). 159 | 160 | 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). 161 | -------------------------------------------------------------------------------- /angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "coreui": { 7 | "root": "", 8 | "sourceRoot": "src", 9 | "projectType": "application", 10 | "prefix": "app", 11 | "schematics": {}, 12 | "architect": { 13 | "build": { 14 | "builder": "@angular-devkit/build-angular:browser", 15 | "options": { 16 | "outputPath": "dist/@coreui", 17 | "index": "src/index.html", 18 | "main": "src/main.ts", 19 | "polyfills": "src/polyfills.ts", 20 | "tsConfig": "src/tsconfig.app.json", 21 | "assets": [ 22 | "src/favicon.ico", 23 | "src/assets" 24 | ], 25 | "styles": [ 26 | "node_modules/simple-line-icons/css/simple-line-icons.css", 27 | "src/scss/style.scss" 28 | ], 29 | "scripts": [] 30 | }, 31 | "configurations": { 32 | "production": { 33 | "budgets": [ 34 | { 35 | "type": "anyComponentStyle", 36 | "maximumWarning": "6kb" 37 | } 38 | ], 39 | "fileReplacements": [ 40 | { 41 | "replace": "src/environments/environment.ts", 42 | "with": "src/environments/environment.prod.ts" 43 | } 44 | ], 45 | "optimization": true, 46 | "outputHashing": "all", 47 | "sourceMap": false, 48 | "namedChunks": false, 49 | "aot": true, 50 | "extractLicenses": true, 51 | "vendorChunk": false, 52 | "buildOptimizer": true 53 | } 54 | } 55 | }, 56 | "serve": { 57 | "builder": "@angular-devkit/build-angular:dev-server", 58 | "options": { 59 | "browserTarget": "coreui:build" 60 | }, 61 | "configurations": { 62 | "production": { 63 | "browserTarget": "coreui:build:production" 64 | } 65 | } 66 | }, 67 | "extract-i18n": { 68 | "builder": "@angular-devkit/build-angular:extract-i18n", 69 | "options": { 70 | "browserTarget": "coreui:build" 71 | } 72 | }, 73 | "test": { 74 | "builder": "@angular-devkit/build-angular:karma", 75 | "options": { 76 | "main": "src/test.ts", 77 | "polyfills": "src/polyfills.ts", 78 | "tsConfig": "src/tsconfig.spec.json", 79 | "karmaConfig": "src/karma.conf.js", 80 | "styles": [ 81 | "src/scss/style.scss" 82 | ], 83 | "scripts": [], 84 | "assets": [ 85 | "src/favicon.ico", 86 | "src/assets" 87 | ] 88 | } 89 | }, 90 | "lint": { 91 | "builder": "@angular-devkit/build-angular:tslint", 92 | "options": { 93 | "tsConfig": [ 94 | "src/tsconfig.app.json", 95 | "src/tsconfig.spec.json" 96 | ], 97 | "exclude": [ 98 | "**/node_modules/**" 99 | ] 100 | } 101 | } 102 | } 103 | }, 104 | "coreui-e2e": { 105 | "root": "e2e/", 106 | "projectType": "application", 107 | "architect": { 108 | "e2e": { 109 | "builder": "@angular-devkit/build-angular:protractor", 110 | "options": { 111 | "protractorConfig": "e2e/protractor.conf.js", 112 | "devServerTarget": "coreui:serve" 113 | } 114 | }, 115 | "lint": { 116 | "builder": "@angular-devkit/build-angular:tslint", 117 | "options": { 118 | "tsConfig": "e2e/tsconfig.e2e.json", 119 | "exclude": [ 120 | "**/node_modules/**" 121 | ] 122 | } 123 | } 124 | } 125 | }, 126 | "@coreui/angular": { 127 | "projectType": "library", 128 | "root": "projects/coreui/angular", 129 | "sourceRoot": "projects/coreui/angular/src", 130 | "prefix": "lib", 131 | "architect": { 132 | "build": { 133 | "builder": "@angular-devkit/build-angular:ng-packagr", 134 | "options": { 135 | "tsConfig": "projects/coreui/angular/tsconfig.lib.json", 136 | "project": "projects/coreui/angular/ng-package.json" 137 | }, 138 | "configurations": { 139 | "production": { 140 | "project": "projects/coreui/angular/ng-package.prod.json", 141 | "tsConfig": "projects/coreui/angular/tsconfig.lib.prod.json" 142 | } 143 | } 144 | }, 145 | "test": { 146 | "builder": "@angular-devkit/build-angular:karma", 147 | "options": { 148 | "main": "projects/coreui/angular/src/test.ts", 149 | "tsConfig": "projects/coreui/angular/tsconfig.spec.json", 150 | "karmaConfig": "projects/coreui/angular/karma.conf.js" 151 | } 152 | }, 153 | "lint": { 154 | "builder": "@angular-devkit/build-angular:tslint", 155 | "options": { 156 | "tsConfig": [ 157 | "projects/coreui/angular/tsconfig.lib.json", 158 | "projects/coreui/angular/tsconfig.spec.json" 159 | ], 160 | "exclude": [ 161 | "**/node_modules/**" 162 | ] 163 | } 164 | } 165 | } 166 | } 167 | }, 168 | "cli": { 169 | "analytics": false 170 | }, 171 | "defaultProject": "coreui", 172 | "schematics": { 173 | "@schematics/angular:component": { 174 | "style": "scss" 175 | } 176 | } 177 | 178 | } 179 | -------------------------------------------------------------------------------- /build/change-version.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | 'use strict' 4 | 5 | /*! 6 | * Script to update version number references in the project. 7 | * Copyright 2017 The Bootstrap Authors 8 | * Copyright 2017 Twitter, Inc. 9 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 10 | */ 11 | 12 | /* global Set */ 13 | 14 | const fs = require('fs') 15 | const path = require('path') 16 | const sh = require('shelljs') 17 | sh.config.fatal = true 18 | const sed = sh.sed 19 | 20 | // Blame TC39... https://github.com/benjamingr/RegExp.escape/issues/37 21 | RegExp.quote = (string) => string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&') 22 | RegExp.quoteReplacement = (string) => string.replace(/[$]/g, '$$') 23 | 24 | const DRY_RUN = false 25 | 26 | function walkAsync(directory, excludedDirectories, fileCallback, errback) { 27 | if (excludedDirectories.has(path.parse(directory).base)) { 28 | return 29 | } 30 | fs.readdir(directory, (err, names) => { 31 | if (err) { 32 | errback(err) 33 | return 34 | } 35 | names.forEach((name) => { 36 | const filepath = path.join(directory, name) 37 | fs.lstat(filepath, (err, stats) => { 38 | if (err) { 39 | process.nextTick(errback, err) 40 | return 41 | } 42 | if (stats.isSymbolicLink()) { 43 | return 44 | } 45 | else if (stats.isDirectory()) { 46 | process.nextTick(walkAsync, filepath, excludedDirectories, fileCallback, errback) 47 | } 48 | else if (stats.isFile()) { 49 | process.nextTick(fileCallback, filepath) 50 | } 51 | }) 52 | }) 53 | }) 54 | } 55 | 56 | function replaceRecursively(directory, excludedDirectories, allowedExtensions, original, replacement) { 57 | original = new RegExp(RegExp.quote(original), 'g') 58 | replacement = RegExp.quoteReplacement(replacement) 59 | const updateFile = !DRY_RUN ? (filepath) => { 60 | if (allowedExtensions.has(path.parse(filepath).ext)) { 61 | sed('-i', original, replacement, filepath) 62 | } 63 | } : (filepath) => { 64 | if (allowedExtensions.has(path.parse(filepath).ext)) { 65 | console.log(`FILE: ${filepath}`) 66 | } 67 | else { 68 | console.log(`EXCLUDED:${filepath}`) 69 | } 70 | } 71 | walkAsync(directory, excludedDirectories, updateFile, (err) => { 72 | console.error('ERROR while traversing directory!:') 73 | console.error(err) 74 | process.exit(1) 75 | }) 76 | } 77 | 78 | function main(args) { 79 | if (args.length !== 2) { 80 | console.error('USAGE: change-version old_version new_version') 81 | console.error('Got arguments:', args) 82 | process.exit(1) 83 | } 84 | const oldVersion = args[0] 85 | const newVersion = args[1] 86 | const EXCLUDED_DIRS = new Set([ 87 | '.git', 88 | 'node_modules', 89 | 'vendor' 90 | ]) 91 | const INCLUDED_EXTENSIONS = new Set([ 92 | // This extension whitelist is how we avoid modifying binary files 93 | '', 94 | '.css', 95 | '.html', 96 | '.js', 97 | '.json', 98 | '.md', 99 | '.scss', 100 | '.txt', 101 | '.yml' 102 | ]) 103 | replaceRecursively('.', EXCLUDED_DIRS, INCLUDED_EXTENSIONS, oldVersion, newVersion) 104 | } 105 | 106 | main(process.argv.slice(2)) 107 | -------------------------------------------------------------------------------- /e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // Protractor configuration file, see link for more information 2 | // https://github.com/angular/protractor/blob/master/lib/config.ts 3 | 4 | const { SpecReporter } = require('jasmine-spec-reporter'); 5 | 6 | exports.config = { 7 | allScriptsTimeout: 11000, 8 | specs: [ 9 | './src/**/*.e2e-spec.ts' 10 | ], 11 | capabilities: { 12 | 'browserName': 'chrome' 13 | }, 14 | directConnect: true, 15 | baseUrl: 'http://localhost:4201/', 16 | framework: 'jasmine', 17 | jasmineNodeOpts: { 18 | showColors: true, 19 | defaultTimeoutInterval: 30000, 20 | print: function() {} 21 | }, 22 | onPrepare() { 23 | require('ts-node').register({ 24 | project: require('path').join(__dirname, './tsconfig.e2e.json') 25 | }); 26 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 27 | } 28 | }; 29 | -------------------------------------------------------------------------------- /e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppDashboard } from './app.po'; 2 | 3 | describe('CoreUI template', () => { 4 | let page: AppDashboard; 5 | const sleep = 300; 6 | 7 | page = new AppDashboard(); 8 | const browser = page.getBrowser(); 9 | browser.driver.manage().window().setSize(600, 800); 10 | browser.sleep(sleep); 11 | page.navigateTo(); 12 | 13 | // beforeEach(() => { 14 | // page = new AppDashboard(); 15 | // page.navigateTo(); 16 | // }); 17 | 18 | it('should display CoreUI Dashboard', async () => { 19 | expect(await page.getParagraphText()).toEqual('CoreUI Dashboard'); 20 | }); 21 | 22 | it('should toggle `sidebar-minimized` body.class on `sidebar-minimizer` click', () => { 23 | browser.manage().window().maximize(); 24 | browser.sleep(1000); 25 | const body = page.getBody(); 26 | expect(body.getAttribute('class')).not.toContain('sidebar-minimized'); 27 | const button = page.getByCss('.sidebar-minimizer'); 28 | button.click(); 29 | browser.sleep(sleep); 30 | expect(body.getAttribute('class')).toContain('sidebar-minimized'); 31 | browser.sleep(sleep); 32 | button.click(); 33 | browser.sleep(sleep); 34 | expect(body.getAttribute('class')).not.toContain('sidebar-minimized'); 35 | }); 36 | 37 | it('should toggle `sidebar-show` body.class on `navbar-toggler` click', () => { 38 | browser.driver.manage().window().setSize(600, 800); 39 | browser.sleep(1000); 40 | const body = page.getBody(); 41 | expect(body.getAttribute('class')).not.toContain('sidebar-show'); 42 | const button1 = page.getByCss('.navbar-toggler.d-lg-none').first(); 43 | browser.sleep(sleep); 44 | button1.click(); 45 | browser.sleep(sleep); 46 | expect(body.getAttribute('class')).toContain('sidebar-show'); 47 | const button2 = page.getByCss('.navbar-toggler').first(); 48 | browser.sleep(sleep); 49 | button2.click(); 50 | browser.sleep(sleep); 51 | expect(body.getAttribute('class')).not.toContain('sidebar-show'); 52 | }); 53 | 54 | it('should toggle `aside-menu-lg-show` body.class on `navbar-toggler` click', () => { 55 | browser.manage().window().maximize(); 56 | browser.sleep(1000); 57 | const body = page.getBody(); 58 | expect(body.getAttribute('class')).not.toContain('aside-menu-lg-show'); 59 | const button1 = page.getByCss('.navbar-toggler.d-none.d-lg-block').last(); 60 | button1.click(); 61 | browser.sleep(sleep); 62 | expect(body.getAttribute('class')).toContain('aside-menu-lg-show'); 63 | browser.sleep(sleep); 64 | button1.click(); 65 | browser.sleep(sleep); 66 | expect(body.getAttribute('class')).not.toContain('aside-menu-lg-show'); 67 | }); 68 | }); 69 | -------------------------------------------------------------------------------- /e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppDashboard { 4 | 5 | getBrowser() { 6 | return browser; 7 | } 8 | 9 | navigateTo() { 10 | return browser.get('/'); 11 | } 12 | 13 | getParagraphText() { 14 | return element(by.xpath('/html/body/app-dashboard/div/main/div/ng-component/div/span')).getText(); 15 | } 16 | getBody() { 17 | return element(by.xpath('/html/body')); 18 | } 19 | getByCss(selector) { 20 | return element.all(by.css(selector)); 21 | } 22 | 23 | 24 | } 25 | -------------------------------------------------------------------------------- /e2e/tsconfig.e2e.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "commonjs", 6 | "target": "es2018", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@coreui/angular-dev", 3 | "version": "2.11.2", 4 | "license": "MIT", 5 | "author": { 6 | "name": "Łukasz Holeczek", 7 | "url": "http://holeczek.pl", 8 | "github": "https://github.com/mrholek", 9 | "twitter": "https://twitter.com/lukaszholeczek" 10 | }, 11 | "contributors": [ 12 | { 13 | "name": "Andrzej Kopański", 14 | "url": "https://github.com/xidedix" 15 | } 16 | ], 17 | "scripts": { 18 | "ng": "ng", 19 | "postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points", 20 | "build-lib:dev": "ng build @coreui/angular --watch", 21 | "build-lib:prod": "ng build @coreui/angular --prod", 22 | "test-lib:dev": "ng test @coreui/angular", 23 | "test-lib:prod": "ng test @coreui/angular --karmaConfig=projects/coreui/angular/karma.conf.github.js", 24 | "prestart": "npm run postinstall", 25 | "start": "ng serve", 26 | "test": "ng test", 27 | "lint": "ng lint", 28 | "pree2e": "npm run postinstall", 29 | "e2e": "ng e2e", 30 | "publish": "cd dist/@coreui/angular/ && npm publish --tag next --dry-run", 31 | "link": "cd dist/@coreui/angular/ && npm link", 32 | "release-version": "node build/change-version.js" 33 | }, 34 | "private": true, 35 | "dependencies": { 36 | "@angular/animations": "^11.2.2", 37 | "@angular/common": "^11.2.2", 38 | "@angular/compiler": "^11.2.2", 39 | "@angular/core": "^11.2.2", 40 | "@angular/forms": "^11.2.2", 41 | "@angular/localize": "^11.2.2", 42 | "@angular/platform-browser": "^11.2.2", 43 | "@angular/platform-browser-dynamic": "^11.2.2", 44 | "@angular/router": "^11.2.2", 45 | "rxjs": "^6.6.3", 46 | "tslib": "^2.1.0", 47 | "zone.js": "^0.11.4" 48 | }, 49 | "devDependencies": { 50 | "@angular-devkit/build-angular": "^0.1102.1", 51 | "@angular/cli": "^11.2.1", 52 | "@angular/compiler-cli": "^11.2.2", 53 | "@angular/language-service": "^11.2.2", 54 | "@coreui/coreui": "^2.1.16", 55 | "@types/jasmine": "^3.6.4", 56 | "@types/node": "^14.14.31", 57 | "codelyzer": "^6.0.1", 58 | "jasmine-core": "~3.6.0", 59 | "jasmine-spec-reporter": "~5.0.2", 60 | "karma": "^5.2.3", 61 | "karma-chrome-launcher": "~3.1.0", 62 | "karma-coverage": "~2.0.3", 63 | "karma-jasmine": "~4.0.1", 64 | "karma-jasmine-html-reporter": "^1.5.4", 65 | "ng-packagr": "^11.2.4", 66 | "ngx-perfect-scrollbar": "^10.1.0", 67 | "protractor": "~7.0.0", 68 | "shelljs": "^0.8.4", 69 | "simple-line-icons": "^2.5.5", 70 | "ts-node": "^9.1.1", 71 | "tslint": "~6.1.3", 72 | "typescript": "~4.0.5" 73 | }, 74 | "engines": { 75 | "node": ">= 10.13", 76 | "npm": ">= 6" 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /projects/coreui/angular/README.md: -------------------------------------------------------------------------------- 1 | # [@coreui/angular](https://coreui.io/angular) 2 | 3 | [![npm package][npm-coreui-angular-badge-latest]][npm-coreui-angular] 4 | [![NPM downloads][npm-coreui-angular-download]][npm-coreui-angular] 5 | ![angular](https://img.shields.io/badge/angular-^11.2.0-lightgrey.svg?style=flat-square&logo=angular) 6 | [![npm-coreui-angular-next][npm-coreui-angular-badge-next]][npm-coreui-angular] 7 | [![@coreui coreui](https://img.shields.io/badge/@coreui%20-coreui-lightgrey.svg?style=flat-square)](https://github.com/coreui/coreui) 8 | [![npm package][npm-coreui-badge]][npm-coreui] 9 | [![NPM downloads][npm-coreui-download]][npm-coreui] 10 | 11 | 12 | [npm-coreui-angular]: https://www.npmjs.com/package/@coreui/angular 13 | [npm-coreui-angular-badge-latest]: https://img.shields.io/npm/v/@coreui/angular/latest?style=flat-square&color=red 14 | [npm-coreui-angular-badge-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square&color=red 15 | [npm-coreui-angular-download]: https://img.shields.io/npm/dm/@coreui/angular.svg?style=flat-square 16 | [npm-coreui-angular-next]: https://img.shields.io/npm/v/@coreui/angular/next?style=flat-square 17 | [npm-coreui]: https://www.npmjs.com/package/@coreui/coreui 18 | [npm-coreui-badge]: https://img.shields.io/npm/v/@coreui/coreui.png?style=flat-square 19 | [npm-coreui-download]: https://img.shields.io/npm/dm/@coreui/coreui.svg?style=flat-square 20 | 21 | > [@coreui/angular](https://coreui.io/angular) v2 library project 22 | > for use with [CoreUI](https://coreui.io/angular/) v2 Bootstrap Admin Template 23 | 24 | 25 | #### Prerequisites 26 | Before you begin, make sure your development environment includes `Node.js®` and an `npm` package manager. 27 | 28 | ###### Node.js 29 | Angular 11 requires `Node.js` version 10.13 or later. 30 | 31 | - To check your version, run `node -v` in a terminal/console window. 32 | - To get `Node.js`, go to [nodejs.org](https://nodejs.org/). 33 | 34 | ###### Angular CLI 35 | Install the Angular CLI globally using a terminal/console window. 36 | ```bash 37 | npm install -g @angular/cli 38 | ``` 39 | 40 | ##### Update to Angular 11 41 | see: [https://update.angular.io](https://update.angular.io) 42 | 43 | ## CoreUI Installation 44 | 45 | Several options are available: 46 | 47 | ### Clone repo 48 | 49 | ``` bash 50 | $ git clone https://github.com/coreui/coreui-angular.git 51 | ``` 52 | 53 | ### NPM 54 | 55 | ``` bash 56 | $ npm install @coreui/angular --save 57 | ``` 58 | 59 | ### Yarn 60 | 61 | ``` bash 62 | $ yarn add @coreui/angular 63 | ``` 64 | 65 | ## Usage 66 | 67 | ### CSS 68 | 69 | Copy-paste the stylesheet `` into your `` before all other stylesheets to load our CSS. 70 | 71 | ``` html 72 | 73 | ``` 74 | 75 | ### Changelog 76 | 77 | See the GitHub [release history](https://github.com/coreui/coreui-angular/releases). 78 | 79 | ### Contributing 80 | 81 | See [CONTRIBUTING.md](https://github.com/coreui/coreui-angular/blob/master/CONTRIBUTING.md). 82 | -------------------------------------------------------------------------------- /projects/coreui/angular/karma.conf.github.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | jasmine: { 17 | // you can add configuration options for Jasmine here 18 | // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html 19 | // for example, you can disable the random execution with `random: false` 20 | // or set a specific seed with `seed: 4321` 21 | }, 22 | clearContext: false // leave Jasmine Spec Runner output visible in browser 23 | }, 24 | jasmineHtmlReporter: { 25 | suppressAll: true // removes the duplicated traces 26 | }, 27 | coverageReporter: { 28 | dir: require('path').join(__dirname, '../../../coverage/coreui-angular'), 29 | subdir: '.', 30 | reporters: [ 31 | { type: 'html' }, 32 | { type: 'text-summary' } 33 | ] 34 | }, 35 | reporters: ['progress', 'kjhtml'], 36 | port: 9876, 37 | colors: true, 38 | logLevel: config.LOG_INFO, 39 | autoWatch: false, 40 | singleRun: true, 41 | restartOnFileChange: false, 42 | browsers: ['ChromeHeadless'], 43 | }); 44 | }; 45 | -------------------------------------------------------------------------------- /projects/coreui/angular/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | jasmine: { 17 | // you can add configuration options for Jasmine here 18 | // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html 19 | // for example, you can disable the random execution with `random: false` 20 | // or set a specific seed with `seed: 4321` 21 | }, 22 | clearContext: false // leave Jasmine Spec Runner output visible in browser 23 | }, 24 | jasmineHtmlReporter: { 25 | suppressAll: true // removes the duplicated traces 26 | }, 27 | coverageReporter: { 28 | dir: require('path').join(__dirname, '../../../coverage/coreui-angular'), 29 | subdir: '.', 30 | reporters: [ 31 | { type: 'html' }, 32 | { type: 'text-summary' } 33 | ] 34 | }, 35 | reporters: ['progress', 'kjhtml'], 36 | port: 9876, 37 | colors: true, 38 | logLevel: config.LOG_INFO, 39 | autoWatch: true, 40 | browsers: ['Chrome'], 41 | singleRun: false, 42 | restartOnFileChange: true 43 | }); 44 | }; 45 | -------------------------------------------------------------------------------- /projects/coreui/angular/ng-package.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/@coreui/angular", 4 | "deleteDestPath": true, 5 | "lib": { 6 | "entryFile": "src/public-api.ts" 7 | } 8 | } -------------------------------------------------------------------------------- /projects/coreui/angular/ng-package.prod.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json", 3 | "dest": "../../../dist/@coreui/angular", 4 | "deleteDestPath": true, 5 | "lib": { 6 | "entryFile": "src/public-api.ts" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /projects/coreui/angular/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@coreui/angular", 3 | "version": "2.11.2", 4 | "description": "CoreUI Angular 11 Bootstrap 4 components", 5 | "license": "MIT", 6 | "homepage": "https://coreui.io/angular", 7 | "author": { 8 | "name": "Łukasz Holeczek", 9 | "url": "http://holeczek.pl", 10 | "github": "https://github.com/mrholek", 11 | "twitter": "https://twitter.com/lukaszholeczek" 12 | }, 13 | "contributors": [ 14 | { 15 | "name": "Andrzej Kopański", 16 | "url": "https://github.com/xidedix" 17 | } 18 | ], 19 | "dependencies": { 20 | "tslib": "^2.0.0" 21 | }, 22 | "peerDependencies": { 23 | "@angular/common": "^11.0.0", 24 | "@angular/core": "^11.0.0", 25 | "@angular/router": "^11.0.0" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "https://github.com/coreui/coreui-angular.git" 30 | }, 31 | "bugs": { 32 | "url": "https://github.com/coreui/coreui-angular/issues" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/aside/app-aside.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AppAsideComponent } from './app-aside.component'; 4 | 5 | describe('AppAsideComponent', () => { 6 | let component: AppAsideComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(waitForAsync(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ AppAsideComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AppAsideComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/aside/app-aside.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Input, OnInit, OnDestroy, Inject, Renderer2, HostBinding} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | import { asideMenuCssClasses } from '../shared'; 5 | 6 | @Component({ 7 | selector: 'app-aside, cui-aside', 8 | template: `` 9 | }) 10 | export class AppAsideComponent implements OnInit, OnDestroy { 11 | @Input() display: any; 12 | @Input() fixed: boolean; 13 | @Input() offCanvas: boolean; 14 | 15 | private readonly fixedClass = 'aside-menu-fixed'; 16 | 17 | @HostBinding('class.aside-menu') asideMenuClass = true; 18 | 19 | constructor( 20 | @Inject(DOCUMENT) private document: any, 21 | private renderer: Renderer2, 22 | ) { } 23 | 24 | ngOnInit(): void { 25 | this.isFixed(this.fixed); 26 | this.isOffCanvas(this.offCanvas); 27 | this.displayBreakpoint(this.display); 28 | } 29 | 30 | ngOnDestroy(): void { 31 | this.renderer.removeClass(this.document.body, this.fixedClass); 32 | } 33 | 34 | isFixed(fixed: boolean = this.fixed): void { 35 | if (fixed) { 36 | this.renderer.addClass(this.document.body, this.fixedClass); 37 | } 38 | } 39 | 40 | isOffCanvas(offCanvas: boolean = this.offCanvas): void { 41 | if (offCanvas) { 42 | this.renderer.addClass(this.document.body, 'aside-menu-off-canvas'); 43 | } 44 | } 45 | 46 | displayBreakpoint(display: any = this.display): void { 47 | if (display !== false ) { 48 | const cssClass = this.display ? `aside-menu-${this.display}-show` : asideMenuCssClasses[0]; 49 | this.renderer.addClass(this.document.body, cssClass); 50 | } 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/aside/app-aside.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule} from '@angular/common'; 2 | import { NgModule } from '@angular/core'; 3 | import { LayoutModule } from './../shared/layout/layout.module'; 4 | 5 | import { AppAsideComponent } from './app-aside.component'; 6 | 7 | @NgModule({ 8 | imports: [ 9 | CommonModule, 10 | LayoutModule 11 | ], 12 | exports: [ 13 | AppAsideComponent, 14 | LayoutModule 15 | ], 16 | declarations: [ 17 | AppAsideComponent 18 | ] 19 | }) 20 | export class AppAsideModule {} 21 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/aside/index.ts: -------------------------------------------------------------------------------- 1 | export * from './public_api'; 2 | 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/aside/public_api.ts: -------------------------------------------------------------------------------- 1 | export { AppAsideComponent } from './app-aside.component'; 2 | export { AppAsideModule } from './app-aside.module'; 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | import {AppBreadcrumbService} from './app-breadcrumb.service'; 5 | import {Replace} from '../shared'; 6 | 7 | @Component({ 8 | selector: 'app-breadcrumb', 9 | template: ` 10 | 11 |
  • 14 | {{breadcrumb.label.title}} 15 | {{breadcrumb.label.title}} 16 |
    • 17 |     18 | ` 19 | }) 20 | export class AppBreadcrumbComponent implements OnInit, OnDestroy { 21 | @Input() fixed: boolean; 22 | public breadcrumbs; 23 | private readonly fixedClass = 'breadcrumb-fixed'; 24 | 25 | constructor( 26 | @Inject(DOCUMENT) private document: any, 27 | private renderer: Renderer2, 28 | public service: AppBreadcrumbService, 29 | public el: ElementRef 30 | ) { } 31 | 32 | public ngOnInit(): void { 33 | Replace(this.el); 34 | this.isFixed(this.fixed); 35 | this.breadcrumbs = this.service.breadcrumbs; 36 | } 37 | 38 | ngOnDestroy(): void { 39 | this.renderer.removeClass(this.document.body, this.fixedClass); 40 | } 41 | 42 | isFixed(fixed: boolean = this.fixed): void { 43 | if (fixed) { 44 | this.renderer.addClass(this.document.body, this.fixedClass); 45 | } 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule} from '@angular/common'; 2 | import { NgModule, ModuleWithProviders} from '@angular/core'; 3 | import { RouterModule } from '@angular/router'; 4 | 5 | // App Breadcrumb Component 6 | import { AppBreadcrumbService } from './app-breadcrumb.service'; 7 | import { AppBreadcrumbComponent } from './app-breadcrumb.component'; 8 | import { CuiBreadcrumbComponent } from './cui-breadcrumb.component'; 9 | 10 | // @dynamic 11 | @NgModule({ 12 | imports: [ CommonModule, RouterModule ], 13 | exports: [ AppBreadcrumbComponent, CuiBreadcrumbComponent ], 14 | declarations: [ AppBreadcrumbComponent, CuiBreadcrumbComponent ] 15 | }) 16 | export class AppBreadcrumbModule { 17 | static forRoot(config?: any): ModuleWithProviders { 18 | return { 19 | ngModule: AppBreadcrumbModule, 20 | providers: [ 21 | AppBreadcrumbService 22 | ] 23 | }; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | 4 | import { AppBreadcrumbService } from './app-breadcrumb.service'; 5 | 6 | describe('AppBreadcrumbService', () => { 7 | let service: AppBreadcrumbService; 8 | 9 | beforeEach(() => { 10 | TestBed.configureTestingModule({ 11 | imports: [RouterTestingModule.withRoutes([])], 12 | }); 13 | service = TestBed.inject(AppBreadcrumbService); 14 | }); 15 | 16 | it('should be created', () => { 17 | expect(service).toBeTruthy(); 18 | }); 19 | }); 20 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/app-breadcrumb.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { Router, ActivatedRoute, NavigationEnd } from '@angular/router'; 3 | import { BehaviorSubject, Observable } from 'rxjs'; 4 | import { filter } from 'rxjs/operators'; 5 | 6 | @Injectable({ 7 | providedIn: 'root' 8 | } 9 | ) 10 | export class AppBreadcrumbService { 11 | 12 | breadcrumbs: Observable>; 13 | 14 | private breadcrumbSubject: BehaviorSubject>; 15 | 16 | constructor(private router: Router, private route: ActivatedRoute) { 17 | 18 | this.breadcrumbSubject = new BehaviorSubject(new Array()); 19 | 20 | this.breadcrumbs = this.breadcrumbSubject.asObservable(); 21 | 22 | this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event) => { 23 | const breadcrumbs = []; 24 | let currentRoute = this.route.root; 25 | let url = ''; 26 | do { 27 | const childrenRoutes = currentRoute.children; 28 | currentRoute = null; 29 | // tslint:disable-next-line:no-shadowed-variable 30 | childrenRoutes.forEach(route => { 31 | if (route.outlet === 'primary') { 32 | const routeSnapshot = route.snapshot; 33 | url += '/' + routeSnapshot.url.map(segment => segment.path).join('/'); 34 | breadcrumbs.push({ 35 | label: route.snapshot.data, 36 | url 37 | }); 38 | currentRoute = route; 39 | } 40 | }); 41 | } while (currentRoute); 42 | 43 | this.breadcrumbSubject.next(Object.assign([], breadcrumbs)); 44 | 45 | return breadcrumbs; 46 | }); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.html: -------------------------------------------------------------------------------- 1 |
      2 | 3 |
    1. 6 | {{breadcrumb.label.title}} 7 | {{breadcrumb.label.title}} 8 |
      2. 9 |       10 | 11 |
    12 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | 4 | import { CuiBreadcrumbComponent } from './cui-breadcrumb.component'; 5 | 6 | describe('CuiBreadcrumbComponent', () => { 7 | let component: CuiBreadcrumbComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(waitForAsync(() => { 11 | TestBed.configureTestingModule({ 12 | imports: [RouterTestingModule.withRoutes([])], 13 | declarations: [ CuiBreadcrumbComponent ] 14 | }) 15 | .compileComponents(); 16 | })); 17 | 18 | beforeEach(() => { 19 | fixture = TestBed.createComponent(CuiBreadcrumbComponent); 20 | component = fixture.componentInstance; 21 | fixture.detectChanges(); 22 | }); 23 | 24 | it('should create', () => { 25 | expect(component).toBeTruthy(); 26 | }); 27 | }); 28 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/cui-breadcrumb.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | import {AppBreadcrumbService} from './app-breadcrumb.service'; 5 | 6 | @Component({ 7 | // tslint:disable-next-line:component-selector 8 | selector: 'cui-breadcrumb', 9 | templateUrl: './cui-breadcrumb.component.html' 10 | }) 11 | export class CuiBreadcrumbComponent implements OnInit, OnDestroy { 12 | @Input() fixed: boolean; 13 | 14 | public breadcrumbs; 15 | private readonly fixedClass = 'breadcrumb-fixed'; 16 | 17 | constructor( 18 | @Inject(DOCUMENT) private document: any, 19 | private renderer: Renderer2, 20 | public service: AppBreadcrumbService, 21 | ) { } 22 | 23 | public ngOnInit(): void { 24 | this.isFixed(this.fixed); 25 | this.breadcrumbs = this.service.breadcrumbs; 26 | } 27 | 28 | ngOnDestroy(): void { 29 | this.renderer.removeClass(this.document.body, this.fixedClass); 30 | } 31 | 32 | isFixed(fixed: boolean = this.fixed): void { 33 | if (fixed) { 34 | this.renderer.addClass(this.document.body, this.fixedClass); 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/index.ts: -------------------------------------------------------------------------------- 1 | export * from './public_api'; 2 | 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/breadcrumb/public_api.ts: -------------------------------------------------------------------------------- 1 | export { AppBreadcrumbComponent } from './app-breadcrumb.component'; 2 | export { CuiBreadcrumbComponent } from './cui-breadcrumb.component'; 3 | export { AppBreadcrumbModule } from './app-breadcrumb.module'; 4 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/coreui.module--.ts--: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { AppAsideComponent } from './aside'; 3 | import { AppBreadcrumbComponent, CuiBreadcrumbComponent } from './breadcrumb'; 4 | import { AppFooterComponent } from './footer'; 5 | import { AppHeaderComponent } from './header'; 6 | import { AppSidebarComponent } from './sidebar'; 7 | 8 | @NgModule({ 9 | declarations: [ 10 | AppAsideComponent, 11 | AppBreadcrumbComponent, 12 | CuiBreadcrumbComponent, 13 | AppFooterComponent, 14 | AppHeaderComponent, 15 | AppSidebarComponent 16 | ], 17 | imports: [ 18 | ], 19 | exports: [ 20 | AppAsideComponent, 21 | AppBreadcrumbComponent, 22 | CuiBreadcrumbComponent, 23 | AppFooterComponent, 24 | AppHeaderComponent, 25 | AppSidebarComponent 26 | ] 27 | }) 28 | export class CoreuiModule { } 29 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/footer/app-footer.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AppFooterComponent } from './app-footer.component'; 4 | 5 | describe('AppAsideComponent', () => { 6 | let component: AppFooterComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(waitForAsync(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ AppFooterComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AppFooterComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/footer/app-footer.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, Inject, Input, OnDestroy, OnInit, Renderer2} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | @Component({ 5 | selector: 'app-footer, cui-footer', 6 | template: `` 7 | }) 8 | export class AppFooterComponent implements OnInit, OnDestroy { 9 | @Input() fixed: boolean; 10 | 11 | private readonly fixedClass = 'footer-fixed'; 12 | 13 | @HostBinding('class.app-footer') appFooterClass = true; 14 | 15 | constructor( 16 | @Inject(DOCUMENT) private document: any, 17 | private renderer: Renderer2, 18 | ) { } 19 | 20 | ngOnInit(): void { 21 | this.isFixed(this.fixed); 22 | } 23 | 24 | ngOnDestroy(): void { 25 | this.renderer.removeClass(this.document.body, this.fixedClass); 26 | } 27 | 28 | isFixed(fixed: boolean = this.fixed): void { 29 | if (fixed) { 30 | this.renderer.addClass(this.document.body, this.fixedClass); 31 | } 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/footer/app-footer.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule} from '@angular/common'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppFooterComponent } from './app-footer.component'; 5 | 6 | @NgModule({ 7 | imports: [ CommonModule ], 8 | exports: [ AppFooterComponent ], 9 | declarations: [ AppFooterComponent ] 10 | }) 11 | export class AppFooterModule {} 12 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/footer/index.ts: -------------------------------------------------------------------------------- 1 | export * from './public_api'; 2 | 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/footer/public_api.ts: -------------------------------------------------------------------------------- 1 | export { AppFooterComponent } from './app-footer.component'; 2 | export { AppFooterModule } from './app-footer.module'; 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/app-header.component.html: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | 8 | 11 | 14 | 17 | 18 | 19 |
    20 |
    21 |     22 |     23 | 24 | 27 | 28 | 29 | 30 | 33 | 34 | 35 | 38 | 39 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/app-header.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | 4 | import { AppHeaderComponent } from './app-header.component'; 5 | import { AsideToggleDirective, SidebarToggleDirective, HtmlAttributesDirective } from '../shared/layout/layout.directive'; 6 | 7 | describe('AppHeaderComponent', () => { 8 | let component: AppHeaderComponent; 9 | let fixture: ComponentFixture; 10 | 11 | beforeEach(waitForAsync(() => { 12 | TestBed.configureTestingModule({ 13 | imports: [RouterTestingModule.withRoutes([])], 14 | declarations: [ AppHeaderComponent, SidebarToggleDirective, AsideToggleDirective, HtmlAttributesDirective ] 15 | }) 16 | .compileComponents(); 17 | })); 18 | 19 | beforeEach(() => { 20 | fixture = TestBed.createComponent(AppHeaderComponent); 21 | component = fixture.componentInstance; 22 | fixture.detectChanges(); 23 | }); 24 | 25 | it('should create', () => { 26 | expect(component).toBeTruthy(); 27 | }); 28 | }); 29 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/app-header.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Input, OnInit, OnDestroy, Inject, Renderer2, HostBinding} from '@angular/core'; 2 | import { DOCUMENT } from '@angular/common'; 3 | 4 | @Component({ 5 | selector: 'app-header, cui-header', 6 | templateUrl: './app-header.component.html' 7 | }) 8 | export class AppHeaderComponent implements OnInit, OnDestroy { 9 | 10 | @Input() fixed: boolean; 11 | 12 | @Input() navbarBrand: any; 13 | @Input() navbarBrandFull: any; 14 | @Input() navbarBrandMinimized: any; 15 | @Input() navbarBrandText: any = {icon: '🅲', text: '🅲 CoreUI'}; 16 | @Input() navbarBrandHref: ''; // deprecated, use navbarBrandRouterLink instead 17 | @Input() navbarBrandRouterLink: any[] | string = ''; 18 | 19 | @Input() sidebarToggler: string | boolean; 20 | @Input() mobileSidebarToggler: boolean; 21 | 22 | @Input() asideMenuToggler: string | boolean; 23 | @Input() mobileAsideMenuToggler: boolean; 24 | 25 | private readonly fixedClass = 'header-fixed'; 26 | 27 | @HostBinding('class.app-header') appHeaderClass = true; 28 | @HostBinding('class.navbar') navbarClass = true; 29 | 30 | navbarBrandImg: boolean; 31 | 32 | private readonly breakpoints = ['xl', 'lg', 'md', 'sm', 'xs']; 33 | sidebarTogglerClass = 'd-none d-md-block'; 34 | sidebarTogglerMobileClass = 'd-lg-none'; 35 | asideTogglerClass = 'd-none d-md-block'; 36 | asideTogglerMobileClass = 'd-lg-none'; 37 | 38 | constructor( 39 | @Inject(DOCUMENT) private document: any, 40 | private renderer: Renderer2, 41 | ) { } 42 | 43 | ngOnInit(): void { 44 | this.isFixed(this.fixed); 45 | this.navbarBrandImg = Boolean(this.navbarBrand || this.navbarBrandFull || this.navbarBrandMinimized); 46 | this.navbarBrandRouterLink = this.navbarBrandRouterLink[0] ? this.navbarBrandRouterLink : this.navbarBrandHref; 47 | this.sidebarTogglerClass = this.setToggerBreakpointClass(this.sidebarToggler as string); 48 | this.sidebarTogglerMobileClass = this.setToggerMobileBreakpointClass(this.sidebarToggler as string); 49 | this.asideTogglerClass = this.setToggerBreakpointClass(this.asideMenuToggler as string); 50 | this.asideTogglerMobileClass = this.setToggerMobileBreakpointClass(this.asideMenuToggler as string); 51 | } 52 | 53 | ngOnDestroy(): void { 54 | this.renderer.removeClass(this.document.body, this.fixedClass); 55 | } 56 | 57 | isFixed(fixed: boolean = this.fixed): void { 58 | if (fixed) { 59 | this.renderer.addClass(this.document.body, this.fixedClass); 60 | } 61 | } 62 | 63 | setToggerBreakpointClass(breakpoint = 'md') { 64 | let togglerClass = 'd-none d-md-block'; 65 | if (this.breakpoints.includes(breakpoint)) { 66 | const breakpointIndex = this.breakpoints.indexOf(breakpoint); 67 | togglerClass = `d-none d-${breakpoint}-block`; 68 | } 69 | return togglerClass; 70 | } 71 | 72 | setToggerMobileBreakpointClass(breakpoint = 'lg') { 73 | let togglerClass = 'd-lg-none'; 74 | if (this.breakpoints.includes(breakpoint)) { 75 | togglerClass = `d-${breakpoint}-none`; 76 | } 77 | return togglerClass; 78 | } 79 | } 80 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/app-header.md: -------------------------------------------------------------------------------- 1 | #### CoreUI v2 `app-header` angular component 2 | 3 | prop | type | default | example 4 | --- | --- | --- | --- 5 | fixed | boolean | `false` | 6 | navbarBrand | any | | 7 | navbarBrandFull | any | | `{src: 'assets/img/brand/logo.svg', width: 89, height: 25, alt: 'CoreUI Logo'}` 8 | navbarBrandMinimized | any | | `{src: 'assets/img/brand/sygnet.svg', width: 30, height: 30, alt: 'CoreUI Logo'}` 9 | navbarBrandText | any | `{icon: '🅲', text: '🅲 CoreUI'}` | 10 | navbarBrandRouterLink | any[], string | | `['/dashboard']` 11 | sidebarToggler | string, boolean | | `'lg'` 12 | mobileSidebarToggler | boolean | 13 | asideMenuToggler | string, boolean | | `'lg'` 14 | mobileAsideMenuToggler | boolean | 15 | 16 | notes: 17 | - `[fixed] = "true"` : set `header-fixed` class 18 | - `[sidebarToggler] = "'lg'"` : toggler breakpoint for desktop/mobile view 19 | - `[sidebarToggler] = "false"` : remove toggler 20 | - `[mobileSidebarToggler] = "false"` : remove mobile toggler 21 | - `[asideMenuToggler] = "false"` : remove toggler 22 | - `[mobileAsideMenuToggler] = "false"` : remove mobile toggler 23 | 24 | to shift default ( lg, md ) desktop/mobile breakpoint in your template: 25 | 1. override `_variables.scss` 26 | ```scss 27 | // Variable overrides 28 | $breakpoint-mobile-up: md; 29 | $breakpoint-mobile-down: sm; 30 | ``` 31 | 32 | 2. set complementary changes to `default-layout.component.html` 33 | - `` 34 | - `` 35 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/app-header.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule } from '@angular/common'; 2 | import { NgModule } from '@angular/core'; 3 | import { RouterModule } from '@angular/router'; 4 | 5 | import { LayoutModule } from '../shared/layout/layout.module'; 6 | import { AppHeaderComponent } from './app-header.component'; 7 | 8 | @NgModule({ 9 | imports: [ 10 | CommonModule, 11 | RouterModule, 12 | LayoutModule 13 | ], 14 | exports: [ 15 | AppHeaderComponent, 16 | LayoutModule 17 | ], 18 | declarations: [ 19 | AppHeaderComponent 20 | ] 21 | }) 22 | export class AppHeaderModule {} 23 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/index.ts: -------------------------------------------------------------------------------- 1 | export * from './public_api'; 2 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/header/public_api.ts: -------------------------------------------------------------------------------- 1 | export { AppHeaderComponent } from './app-header.component'; 2 | export { AppHeaderModule } from './app-header.module'; 3 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/classes.ts: -------------------------------------------------------------------------------- 1 | export const sidebarCssClasses: Array = [ 2 | 'sidebar-show', 3 | 'sidebar-sm-show', 4 | 'sidebar-md-show', 5 | 'sidebar-lg-show', 6 | 'sidebar-xl-show' 7 | ]; 8 | 9 | export const asideMenuCssClasses: Array = [ 10 | 'aside-menu-show', 11 | 'aside-menu-sm-show', 12 | 'aside-menu-md-show', 13 | 'aside-menu-lg-show', 14 | 'aside-menu-xl-show' 15 | ]; 16 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/index.ts: -------------------------------------------------------------------------------- 1 | export * from './classes'; 2 | export * from './layout/index'; 3 | export * from './replace'; 4 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/layout/index.ts: -------------------------------------------------------------------------------- 1 | export * from './layout.module'; 2 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/layout/layout.directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, ElementRef, HostListener, Inject, Input, OnInit, Renderer2} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | import { asideMenuCssClasses, sidebarCssClasses } from '../classes'; 5 | import { ClassToggler } from '../toggle-classes'; 6 | 7 | /** 8 | * Allows the sidebar to be toggled via click. 9 | */ 10 | @Directive({ 11 | selector: '[appSidebarToggler]', 12 | providers: [ClassToggler] 13 | }) 14 | export class SidebarToggleDirective implements OnInit { 15 | @Input('appSidebarToggler') breakpoint: string; 16 | public bp; 17 | constructor(private classToggler: ClassToggler) {} 18 | ngOnInit(): void { 19 | this.bp = this.breakpoint; 20 | } 21 | @HostListener('click', ['$event']) 22 | toggleOpen($event: any) { 23 | $event.preventDefault(); 24 | const cssClass = this.bp ? `sidebar-${this.bp}-show` : sidebarCssClasses[0]; 25 | this.classToggler.toggleClasses(cssClass, sidebarCssClasses); 26 | } 27 | } 28 | 29 | @Directive({ 30 | selector: '[appSidebarMinimizer]' 31 | }) 32 | export class SidebarMinimizeDirective { 33 | constructor( 34 | @Inject(DOCUMENT) private document: any, 35 | private renderer: Renderer2, 36 | ) { } 37 | 38 | @HostListener('click', ['$event']) 39 | toggleOpen($event: any) { 40 | $event.preventDefault(); 41 | const body = this.document.body; 42 | body.classList.contains('sidebar-minimized') ? 43 | this.renderer.removeClass(body, 'sidebar-minimized') : 44 | this.renderer.addClass(body, 'sidebar-minimized'); 45 | } 46 | } 47 | 48 | @Directive({ 49 | selector: '[appMobileSidebarToggler]' 50 | }) 51 | export class MobileSidebarToggleDirective { 52 | constructor( 53 | @Inject(DOCUMENT) private document: any, 54 | private renderer: Renderer2, 55 | ) { } 56 | 57 | @HostListener('click', ['$event']) 58 | toggleOpen($event: any) { 59 | $event.preventDefault(); 60 | const body = this.document.body; 61 | body.classList.contains('sidebar-show') ? 62 | this.renderer.removeClass(body, 'sidebar-show') : 63 | this.renderer.addClass(body, 'sidebar-show'); 64 | } 65 | } 66 | 67 | /** 68 | * Allows the off-canvas sidebar to be closed via click. 69 | */ 70 | @Directive({ 71 | selector: '[appSidebarClose]' 72 | }) 73 | export class SidebarOffCanvasCloseDirective { 74 | constructor( 75 | @Inject(DOCUMENT) private document: any, 76 | private renderer: Renderer2, 77 | ) { } 78 | 79 | @HostListener('click', ['$event']) 80 | toggleOpen($event: any) { 81 | $event.preventDefault(); 82 | 83 | const body = this.document.body; 84 | if (body.classList.contains('sidebar-off-canvas')) { 85 | body.classList.contains('sidebar-show') ? 86 | this.renderer.removeClass(body, 'sidebar-show') : 87 | this.renderer.addClass(body, 'sidebar-show'); 88 | } 89 | } 90 | } 91 | 92 | @Directive({ 93 | selector: '[appBrandMinimizer]' 94 | }) 95 | export class BrandMinimizeDirective { 96 | constructor( 97 | @Inject(DOCUMENT) private document: any, 98 | private renderer: Renderer2, 99 | ) { } 100 | 101 | @HostListener('click', ['$event']) 102 | toggleOpen($event: any) { 103 | $event.preventDefault(); 104 | const body = this.document.body; 105 | body.classList.contains('brand-minimized') ? 106 | this.renderer.removeClass(body, 'brand-minimized') : 107 | this.renderer.addClass(body, 'brand-minimized'); 108 | } 109 | } 110 | 111 | 112 | /** 113 | * Allows the aside to be toggled via click. 114 | */ 115 | @Directive({ 116 | selector: '[appAsideMenuToggler]', 117 | providers: [ClassToggler] 118 | }) 119 | export class AsideToggleDirective implements OnInit { 120 | @Input('appAsideMenuToggler') breakpoint: string; 121 | public bp; 122 | constructor(private classToggler: ClassToggler) {} 123 | ngOnInit(): void { 124 | this.bp = this.breakpoint; 125 | } 126 | @HostListener('click', ['$event']) 127 | toggleOpen($event: any) { 128 | $event.preventDefault(); 129 | const cssClass = this.bp ? `aside-menu-${this.bp}-show` : asideMenuCssClasses[0]; 130 | this.classToggler.toggleClasses(cssClass, asideMenuCssClasses); 131 | } 132 | } 133 | 134 | @Directive({ 135 | selector: '[appHtmlAttr]' 136 | }) 137 | export class HtmlAttributesDirective implements OnInit { 138 | @Input() appHtmlAttr: {[key: string]: string }; 139 | 140 | constructor( 141 | private renderer: Renderer2, 142 | private el: ElementRef 143 | ) {} 144 | 145 | ngOnInit() { 146 | const attribs = this.appHtmlAttr; 147 | for (const attr in attribs) { 148 | if (attr === 'style' && typeof(attribs[attr]) === 'object' ) { 149 | this.setStyle(attribs[attr]); 150 | } else if (attr === 'class') { 151 | this.addClass(attribs[attr]); 152 | } else { 153 | this.setAttrib(attr, attribs[attr]); 154 | } 155 | } 156 | } 157 | 158 | private setStyle(styles) { 159 | for (const style in styles) { 160 | this.renderer.setStyle(this.el.nativeElement, style, styles[style] ); 161 | } 162 | } 163 | 164 | private addClass(classes) { 165 | const classArray = (Array.isArray(classes) ? classes : classes.split(' ')); 166 | classArray.filter((element) => element.length > 0).forEach(element => { 167 | this.renderer.addClass(this.el.nativeElement, element ); 168 | }); 169 | } 170 | 171 | private setAttrib(key, value) { 172 | value !== null ? 173 | this.renderer.setAttribute(this.el.nativeElement, key, value ) : 174 | this.renderer.removeAttribute(this.el.nativeElement, key); 175 | } 176 | } 177 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/layout/layout.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule } from '@angular/common'; 2 | import { NgModule} from '@angular/core'; 3 | import { 4 | AsideToggleDirective, 5 | BrandMinimizeDirective, 6 | MobileSidebarToggleDirective, 7 | SidebarToggleDirective, 8 | SidebarMinimizeDirective, 9 | SidebarOffCanvasCloseDirective, 10 | HtmlAttributesDirective 11 | } from './layout.directive'; 12 | import { ClassToggler } from '../toggle-classes'; 13 | 14 | @NgModule({ 15 | imports: [ 16 | CommonModule 17 | ], 18 | exports: [ 19 | AsideToggleDirective, 20 | BrandMinimizeDirective, 21 | MobileSidebarToggleDirective, 22 | SidebarToggleDirective, 23 | SidebarMinimizeDirective, 24 | SidebarOffCanvasCloseDirective, 25 | HtmlAttributesDirective 26 | ], 27 | declarations: [ 28 | AsideToggleDirective, 29 | BrandMinimizeDirective, 30 | MobileSidebarToggleDirective, 31 | SidebarToggleDirective, 32 | SidebarMinimizeDirective, 33 | SidebarOffCanvasCloseDirective, 34 | HtmlAttributesDirective 35 | ], 36 | providers: [ 37 | ClassToggler 38 | ] 39 | }) 40 | export class LayoutModule { } 41 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/replace.ts: -------------------------------------------------------------------------------- 1 | export function Replace(el: any): any { 2 | const nativeElement: HTMLElement = el.nativeElement; 3 | const parentElement: HTMLElement = nativeElement.parentElement; 4 | // move all children out of the element 5 | while (nativeElement.firstChild) { 6 | parentElement.insertBefore(nativeElement.firstChild, nativeElement); 7 | } 8 | // remove the empty element(the host) 9 | parentElement.removeChild(nativeElement); 10 | } 11 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/shared/toggle-classes.ts: -------------------------------------------------------------------------------- 1 | import {Inject, Injectable, Renderer2} from '@angular/core'; 2 | import {DOCUMENT} from '@angular/common'; 3 | 4 | const RemoveClasses = (NewClassNames) => { 5 | const MatchClasses = NewClassNames.map((Class) => document.body.classList.contains(Class)); 6 | return MatchClasses.indexOf(true) !== -1; 7 | }; 8 | 9 | export const ToggleClasses = (Toggle, ClassNames) => { 10 | const Level = ClassNames.indexOf(Toggle); 11 | const NewClassNames = ClassNames.slice(0, Level + 1); 12 | 13 | if (RemoveClasses(NewClassNames)) { 14 | NewClassNames.map((Class) => document.body.classList.remove(Class)); 15 | } else { 16 | document.body.classList.add(Toggle); 17 | } 18 | }; 19 | 20 | @Injectable() 21 | export class ClassToggler { 22 | 23 | constructor( 24 | @Inject(DOCUMENT) private document: any, 25 | private renderer: Renderer2, 26 | ) {} 27 | 28 | removeClasses(NewClassNames) { 29 | const MatchClasses = NewClassNames.map((Class) => this.document.body.classList.contains(Class)); 30 | return MatchClasses.indexOf(true) !== -1; 31 | } 32 | 33 | toggleClasses(Toggle, ClassNames) { 34 | const Level = ClassNames.indexOf(Toggle); 35 | const NewClassNames = ClassNames.slice(0, Level + 1); 36 | 37 | if (this.removeClasses(NewClassNames)) { 38 | NewClassNames.map((Class) => this.renderer.removeClass(this.document.body, Class)); 39 | } else { 40 | this.renderer.addClass(this.document.body, Toggle); 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-footer.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding} from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-sidebar-footer, cui-sidebar-footer', 5 | template: `` 6 | }) 7 | export class AppSidebarFooterComponent { 8 | 9 | @HostBinding('class.sidebar-footer') sidebarFooterClass = true; 10 | 11 | constructor() { } 12 | } 13 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-form.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding} from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-sidebar-form, cui-sidebar-form', 5 | template: `` 6 | }) 7 | export class AppSidebarFormComponent { 8 | 9 | @HostBinding('class.sidebar-form') sidebarFormClass = true; 10 | 11 | constructor() { } 12 | } 13 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-header.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding} from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-sidebar-header, cui-sidebar-header', 5 | template: `` 6 | }) 7 | export class AppSidebarHeaderComponent { 8 | 9 | @HostBinding('class.sidebar-header') sidebarHeaderClass = true; 10 | 11 | constructor() { } 12 | } 13 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-minimizer.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, HostListener, Input} from '@angular/core'; 2 | 3 | import { AppSidebarService } from './app-sidebar.service'; 4 | 5 | @Component({ 6 | selector: 'app-sidebar-minimizer, cui-sidebar-minimizer', 7 | template: `` 8 | }) 9 | export class AppSidebarMinimizerComponent { 10 | 11 | @HostBinding('attr.role') @Input() role = 'button'; 12 | @HostBinding('class.sidebar-minimizer') sidebarMinimizerClass = true; 13 | 14 | @HostListener('click', ['$event']) 15 | toggleOpen($event: any) { 16 | $event.preventDefault(); 17 | this.sidebarService.toggle({minimize: 'toggle'}); 18 | } 19 | 20 | constructor( 21 | private sidebarService: AppSidebarService 22 | ) { } 23 | } 24 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.component.html: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { NO_ERRORS_SCHEMA } from '@angular/core'; 2 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 3 | import { RouterTestingModule } from '@angular/router/testing'; 4 | 5 | import { AppSidebarNavComponent } from './app-sidebar-nav.component'; 6 | 7 | describe('AppSidebarNavComponent', () => { 8 | let component: AppSidebarNavComponent; 9 | let fixture: ComponentFixture; 10 | 11 | beforeEach(waitForAsync(() => { 12 | TestBed.configureTestingModule({ 13 | declarations: [AppSidebarNavComponent], 14 | imports: [RouterTestingModule], 15 | schemas: [NO_ERRORS_SCHEMA], 16 | }) 17 | .compileComponents(); 18 | })); 19 | 20 | beforeEach(() => { 21 | fixture = TestBed.createComponent(AppSidebarNavComponent); 22 | component = fixture.componentInstance; 23 | fixture.detectChanges(); 24 | }); 25 | 26 | it('should create', () => { 27 | expect(component).toBeTruthy(); 28 | }); 29 | }); 30 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, HostBinding, Input, OnChanges, SimpleChanges } from '@angular/core'; 2 | import { Router } from '@angular/router'; 3 | 4 | import { INavData } from './app-sidebar-nav'; 5 | 6 | @Component({ 7 | selector: 'app-sidebar-nav, cui-sidebar-nav', 8 | templateUrl: './app-sidebar-nav.component.html' 9 | }) 10 | export class AppSidebarNavComponent implements OnChanges { 11 | @Input() navItems: INavData[] = []; 12 | 13 | @HostBinding('class.sidebar-nav') sidebarNavClass = true; 14 | @HostBinding('attr.role') @Input() role = 'nav'; 15 | 16 | public navItemsArray: INavData[] = []; 17 | 18 | constructor( 19 | public router: Router, 20 | ) { } 21 | 22 | public ngOnChanges(changes: SimpleChanges): void { 23 | this.navItemsArray = Array.isArray(this.navItems) ? this.navItems.slice() : []; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, ElementRef, HostListener} from '@angular/core'; 2 | 3 | @Directive({ 4 | selector: '[appNavDropdown]' 5 | }) 6 | export class NavDropdownDirective { 7 | 8 | constructor(private el: ElementRef) { } 9 | 10 | toggle() { 11 | this.el.nativeElement.classList.toggle('open'); 12 | } 13 | } 14 | 15 | /** 16 | * Allows the dropdown to be toggled via click. 17 | */ 18 | @Directive({ 19 | selector: '[appNavDropdownToggle]' 20 | }) 21 | export class NavDropdownToggleDirective { 22 | constructor(private dropdown: NavDropdownDirective) {} 23 | 24 | @HostListener('click', ['$event']) 25 | toggleOpen($event: any) { 26 | $event.preventDefault(); 27 | this.dropdown.toggle(); 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | import {Router, Routes} from '@angular/router'; 4 | 5 | import { SidebarNavHelper } from './app-sidebar-nav.service'; 6 | 7 | describe('SidebarNavHelper', () => { 8 | let service: SidebarNavHelper; 9 | let router: RouterTestingModule; 10 | const routes: Routes = [ 11 | {path: 'dashboard', redirectTo: 'home', pathMatch: 'full'}, 12 | {path: '', redirectTo: 'dashboard', pathMatch: 'full'} 13 | ]; 14 | 15 | beforeEach(() => { 16 | TestBed.configureTestingModule({ 17 | imports: [RouterTestingModule.withRoutes(routes)], 18 | providers: [SidebarNavHelper], 19 | }); 20 | 21 | router = TestBed.inject(Router); 22 | service = TestBed.inject(SidebarNavHelper); 23 | }); 24 | 25 | it('should be created', () => { 26 | expect(service).toBeTruthy(); 27 | }); 28 | it('should return itemType', () => { 29 | expect(service.itemType({divider: true})).toEqual('divider'); 30 | expect(service.itemType({title: true})).toEqual('title'); 31 | expect(service.itemType({children: []})).toEqual('dropdown'); 32 | expect(service.itemType({label: true})).toEqual('label'); 33 | expect(service.itemType({})).toEqual('empty'); 34 | expect(service.itemType({ 35 | name: 'Disabled', 36 | url: '/dashboard', 37 | icon: 'icon-ban', 38 | attributes: { disabled: true }, 39 | } 40 | )).toEqual('link'); 41 | }); 42 | 43 | it('should be active', () => { 44 | expect(service.isActive(router, {url: ''})).toBeTrue(); 45 | expect(service.isActive(router, {url: 'dashboard'})).toBeFalse(); 46 | }); 47 | 48 | it('item hasBadge', () => { 49 | expect(service.hasBadge({badge: {}})).toBeTruthy(); 50 | expect(service.hasBadge({})).toBeFalsy(); 51 | }); 52 | it('item hasIcon', () => { 53 | expect(service.hasIcon({icon: 'icon-ban'})).toBeTruthy(); 54 | expect(service.hasIcon({})).toBeFalsy(); 55 | }); 56 | 57 | it('should return icon class object', () => { 58 | expect(service.getIconClass({icon: 'icon-ban'})).toEqual(jasmine.objectContaining({ 'nav-icon': true, 'icon-ban': true})); 59 | expect(service.getIconClass({icon: 'icon-ban'})).toEqual(jasmine.objectContaining({ 'nav-icon': true })); 60 | expect(service.getIconClass({icon: ''})).toEqual(jasmine.objectContaining({ 'nav-icon': true })); 61 | }); 62 | }); 63 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | 3 | import { INavData } from './app-sidebar-nav'; 4 | 5 | @Injectable() 6 | export abstract class SidebarNavService { 7 | /** 8 | * Returns a sidebar-nav items config NavData 9 | */ 10 | abstract getSidebarNavItemsConfig(): INavData[]; 11 | } 12 | 13 | @Injectable() 14 | export class SidebarNavHelper { 15 | 16 | public itemType(item) { 17 | if (item.divider) { 18 | return 'divider'; 19 | } else if (item.title) { 20 | return 'title'; 21 | } else if (item.children) { 22 | return 'dropdown'; 23 | } else if (item.label) { 24 | return 'label'; 25 | } else if (!Object.keys(item).length) { 26 | return 'empty'; 27 | } else { 28 | return 'link'; 29 | } 30 | } 31 | 32 | public isActive(router, item) { 33 | return router.isActive(item.url, false); 34 | } 35 | 36 | public hasBadge = (item) => Boolean(item.badge); 37 | public hasIcon = (item) => Boolean(item.icon); 38 | 39 | public getIconClass(item) { 40 | const classes = { 41 | 'nav-icon': true 42 | }; 43 | if (this.hasIcon(item)) { 44 | const icon = item.icon; 45 | classes[icon] = this.hasIcon(item); 46 | } 47 | return classes; 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav.ts: -------------------------------------------------------------------------------- 1 | export interface INavAttributes { 2 | [propName: string]: any; 3 | } 4 | 5 | export interface INavWrapper { 6 | attributes: INavAttributes; 7 | element: string; 8 | } 9 | 10 | export interface INavBadge { 11 | text: string; 12 | variant: string; 13 | class?: string; 14 | } 15 | 16 | export interface INavLabel { 17 | class?: string; 18 | variant: string; 19 | } 20 | 21 | export interface INavLinkProps { 22 | queryParams?: {[k: string]: any}; 23 | fragment?: string; 24 | queryParamsHandling?: 'merge' | 'preserve' | ''; 25 | preserveFragment?: boolean; 26 | skipLocationChange?: boolean; 27 | replaceUrl?: boolean; 28 | state?: {[k: string]: any}; 29 | routerLinkActiveOptions?: {exact: boolean}; 30 | routerLinkActive?: string | string[]; 31 | } 32 | 33 | export interface INavData { 34 | name?: string; 35 | url?: string | any[]; 36 | href?: string; 37 | icon?: string; 38 | badge?: INavBadge; 39 | title?: boolean; 40 | children?: INavData[]; 41 | variant?: string; 42 | attributes?: INavAttributes; 43 | divider?: boolean; 44 | class?: string; 45 | label?: INavLabel; 46 | wrapper?: INavWrapper; 47 | linkProps?: INavLinkProps; 48 | } 49 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { AppSidebarNavBadgePipe } from './app-sidebar-nav-badge.pipe'; 2 | 3 | describe('AppSidebarNavBadgePipe', () => { 4 | it('create an instance', () => { 5 | const pipe = new AppSidebarNavBadgePipe(); 6 | expect(pipe).toBeTruthy(); 7 | }); 8 | }); 9 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-badge.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'appSidebarNavBadge' 5 | }) 6 | export class AppSidebarNavBadgePipe implements PipeTransform { 7 | 8 | transform(item: any, args?: any): any { 9 | const classes = { 10 | badge: true 11 | }; 12 | const variant = `badge-${item.badge.variant}`; 13 | classes[variant] = !!item.badge.variant; 14 | classes[item.badge.class] = !!item.badge.class; 15 | return classes; 16 | } 17 | 18 | } 19 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-divider.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Input, OnInit} from '@angular/core'; 2 | import { INavData } from '../app-sidebar-nav'; 3 | 4 | @Component({ 5 | selector: 'app-sidebar-nav-divider, cui-sidebar-nav-divider', 6 | template: `` 7 | }) 8 | export class AppSidebarNavDividerComponent implements OnInit { 9 | @Input() item: INavData; 10 | 11 | constructor() {} 12 | 13 | ngOnInit() {} 14 | } 15 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-dropdown.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Input} from '@angular/core'; 2 | 3 | import {SidebarNavHelper} from '../app-sidebar-nav.service'; 4 | import { INavData } from '../app-sidebar-nav'; 5 | 6 | @Component({ 7 | selector: 'app-sidebar-nav-dropdown, cui-sidebar-nav-dropdown', 8 | template: ` 9 | 12 | 13 | {{item.name}} 14 | {{ item.badge.text }} 15 | 16 | 19 | 20 | `, 21 | styles: [ 22 | '.nav-dropdown-toggle { cursor: pointer; }', 23 | '.nav-dropdown-items { display: block; }' 24 | ], 25 | providers: [ SidebarNavHelper ] 26 | }) 27 | export class AppSidebarNavDropdownComponent { 28 | @Input() item: INavData; 29 | 30 | constructor( 31 | public helper: SidebarNavHelper 32 | ) { } 33 | } 34 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { AppSidebarNavIconPipe } from './app-sidebar-nav-icon.pipe'; 2 | 3 | describe('AppSidebarNavIconPipe', () => { 4 | it('create an instance', () => { 5 | const pipe = new AppSidebarNavIconPipe(); 6 | expect(pipe).toBeTruthy(); 7 | }); 8 | }); 9 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-icon.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'appSidebarNavIcon' 5 | }) 6 | export class AppSidebarNavIconPipe implements PipeTransform { 7 | 8 | transform(item: any, args?: any): any { 9 | const classes = { 10 | 'nav-icon': true 11 | }; 12 | const icon = item.icon; 13 | classes[icon] = !!item.icon; 14 | return classes; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-item-class.pipe.spec.ts: -------------------------------------------------------------------------------- 1 | import { SidebarNavHelper } from '../app-sidebar-nav.service'; 2 | import { AppSidebarNavItemClassPipe } from './app-sidebar-nav-item-class.pipe'; 3 | 4 | describe('SidebarNavItemClassPipe', () => { 5 | it('create an instance', () => { 6 | const pipe = new AppSidebarNavItemClassPipe(new SidebarNavHelper()); 7 | expect(pipe).toBeTruthy(); 8 | }); 9 | }); 10 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-item-class.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | import {SidebarNavHelper} from '../app-sidebar-nav.service'; 4 | 5 | @Pipe({ 6 | name: 'appSidebarNavItemClass' 7 | }) 8 | export class AppSidebarNavItemClassPipe implements PipeTransform { 9 | 10 | constructor( 11 | public helper: SidebarNavHelper 12 | ) {} 13 | 14 | transform(item: any, ...args: any[]): any { 15 | const itemType = this.helper.itemType(item); 16 | let itemClass; 17 | if (['divider', 'title'].includes(itemType)) { 18 | itemClass = `nav-${itemType}`; 19 | } else if (itemType === 'dropdown') { 20 | itemClass = 'nav-item nav-dropdown' ; 21 | } else { 22 | itemClass = 'nav-item'; 23 | } 24 | return item.class ? `${itemClass} ${item.class}` : itemClass; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-items.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Inject, Input, Renderer2} from '@angular/core'; 2 | import {Router} from '@angular/router'; 3 | import {DOCUMENT} from '@angular/common'; 4 | 5 | import {SidebarNavHelper} from '../app-sidebar-nav.service'; 6 | import {INavData} from '../app-sidebar-nav'; 7 | 8 | @Component({ 9 | selector: 'app-sidebar-nav-items, cui-sidebar-nav-items', 10 | template: ` 11 | 12 | 13 | 20 | 21 | 26 | 27 | 32 | 33 | 38 | 39 | 41 | 42 | 49 | 50 | 51 | 52 | ` 53 | }) 54 | export class AppSidebarNavItemsComponent { 55 | 56 | protected _items: INavData[]; 57 | 58 | @Input() 59 | set items(items: INavData[]) { 60 | this._items = [...items]; 61 | } 62 | get items(): INavData[] { 63 | return this._items; 64 | } 65 | 66 | constructor( 67 | @Inject(DOCUMENT) private document: any, 68 | private renderer: Renderer2, 69 | public router: Router, 70 | public helper: SidebarNavHelper 71 | ) {} 72 | 73 | public hideMobile() { 74 | if (this.document.body.classList.contains('sidebar-show')) { 75 | this.renderer.removeClass(this.document.body, 'sidebar-show'); 76 | } 77 | } 78 | } 79 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.html: -------------------------------------------------------------------------------- 1 | 4 | 5 | {{item.name}} 6 | {{ item.badge.text }} 7 | 8 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { NO_ERRORS_SCHEMA } from '@angular/core'; 2 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 3 | import { SidebarNavHelper } from '../app-sidebar-nav.service'; 4 | import { AppSidebarNavBadgePipe } from './app-sidebar-nav-badge.pipe'; 5 | import { AppSidebarNavLabelComponent } from './app-sidebar-nav-label.component'; 6 | 7 | describe('AppSidebarNavLabelComponent', () => { 8 | let component: AppSidebarNavLabelComponent; 9 | let fixture: ComponentFixture; 10 | 11 | beforeEach(waitForAsync(() => { 12 | TestBed.configureTestingModule({ 13 | declarations: [AppSidebarNavLabelComponent, AppSidebarNavBadgePipe], 14 | providers: [SidebarNavHelper], 15 | schemas: [NO_ERRORS_SCHEMA], 16 | }) 17 | .compileComponents(); 18 | })); 19 | 20 | beforeEach(() => { 21 | fixture = TestBed.createComponent(AppSidebarNavLabelComponent); 22 | component = fixture.componentInstance; 23 | component.item = {}; 24 | fixture.detectChanges(); 25 | }); 26 | 27 | it('should create', () => { 28 | expect(component).toBeTruthy(); 29 | }); 30 | }); 31 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-label.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, Input, OnInit} from '@angular/core'; 2 | import {SidebarNavHelper} from '../app-sidebar-nav.service'; 3 | import { INavData } from '../app-sidebar-nav'; 4 | 5 | @Component({ 6 | selector: 'app-sidebar-nav-label, cui-sidebar-nav-label', 7 | templateUrl: './app-sidebar-nav-label.component.html' 8 | }) 9 | export class AppSidebarNavLabelComponent implements OnInit { 10 | @Input() item: INavData; 11 | 12 | private classes = { 13 | 'nav-label': true, 14 | active: true 15 | }; 16 | private iconClasses = {}; 17 | 18 | constructor( 19 | public helper: SidebarNavHelper 20 | ) { } 21 | 22 | ngOnInit() { 23 | this.iconClasses = this.helper.getIconClass(this.item); 24 | } 25 | 26 | getItemClass() { 27 | const itemClass = this.item.class; 28 | this.classes[itemClass] = !!itemClass; 29 | return this.classes; 30 | } 31 | getLabelIconClass() { 32 | const variant = `text-${this.item.label.variant}`; 33 | this.iconClasses[variant] = !!this.item.label.variant; 34 | const labelClass = this.item.label.class; 35 | this.iconClasses[labelClass] = !!labelClass; 36 | return this.iconClasses; 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.html: -------------------------------------------------------------------------------- 1 | 2 | 6 | 7 | 8 | 14 | 15 | 16 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { NO_ERRORS_SCHEMA } from '@angular/core'; 2 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 3 | import { RouterTestingModule } from '@angular/router/testing'; 4 | 5 | import { AppSidebarNavBadgePipe } from './app-sidebar-nav-badge.pipe'; 6 | import { AppSidebarNavLinkComponent } from './app-sidebar-nav-link.component'; 7 | import { AppSidebarNavLinkPipe } from './app-sidebar-nav-link.pipe'; 8 | 9 | describe('AppSidebarNavLinkComponent', () => { 10 | let component: AppSidebarNavLinkComponent; 11 | let fixture: ComponentFixture; 12 | 13 | beforeEach(waitForAsync(() => { 14 | TestBed.configureTestingModule({ 15 | declarations: [ 16 | AppSidebarNavLinkComponent, 17 | AppSidebarNavLinkPipe, 18 | AppSidebarNavBadgePipe, 19 | ], 20 | imports: [RouterTestingModule], 21 | schemas: [NO_ERRORS_SCHEMA], 22 | }) 23 | .compileComponents(); 24 | })); 25 | 26 | beforeEach(() => { 27 | fixture = TestBed.createComponent(AppSidebarNavLinkComponent); 28 | component = fixture.componentInstance; 29 | component.item = { 30 | url: '', 31 | }; 32 | fixture.detectChanges(); 33 | }); 34 | 35 | it('should create', () => { 36 | expect(component).toBeTruthy(); 37 | }); 38 | }); 39 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, EventEmitter, Input, OnDestroy, OnInit, Output} from '@angular/core'; 2 | import {NavigationEnd, Router} from '@angular/router'; 3 | import {Observable, Subscription} from 'rxjs'; 4 | import {filter} from 'rxjs/operators'; 5 | 6 | import {SidebarNavHelper} from '../app-sidebar-nav.service'; 7 | import {INavData} from '../app-sidebar-nav'; 8 | 9 | @Component({ 10 | selector: 'app-sidebar-nav-link-content, cui-sidebar-nav-link-content', 11 | template: ` 12 | 13 | 14 | {{item.name}} 15 | {{ item.badge.text }} 16 | 17 | `, 18 | providers: [ SidebarNavHelper ] 19 | }) 20 | export class AppSidebarNavLinkContentComponent implements OnInit, OnDestroy { 21 | @Input() item: INavData; 22 | 23 | constructor( 24 | public helper: SidebarNavHelper 25 | ) { } 26 | 27 | ngOnInit() {} 28 | ngOnDestroy() {} 29 | } 30 | 31 | @Component({ 32 | selector: 'app-sidebar-nav-link, cui-sidebar-nav-link', 33 | templateUrl: './app-sidebar-nav-link.component.html', 34 | providers: [ SidebarNavHelper ] 35 | }) 36 | export class AppSidebarNavLinkComponent implements OnInit, OnDestroy { 37 | 38 | protected _Item: INavData; 39 | 40 | @Input() 41 | set item(item: INavData) { 42 | this._Item = JSON.parse(JSON.stringify(item)); 43 | } 44 | get item(): INavData { 45 | return this._Item; 46 | } 47 | 48 | @Output() linkClick = new EventEmitter(); 49 | 50 | public linkType: string; 51 | public href: string; 52 | public linkActive: boolean; 53 | private url: string; 54 | 55 | private navigationEndObservable: Observable; 56 | private navSubscription: Subscription; 57 | 58 | constructor( 59 | public router: Router, 60 | ) { 61 | this.navigationEndObservable = router.events.pipe( 62 | filter(event => { 63 | return event instanceof NavigationEnd; 64 | }) 65 | ) as Observable; 66 | } 67 | 68 | ngOnInit() { 69 | this.url = typeof this.item.url === 'string' ? this.item.url : this.router.serializeUrl(this.router.createUrlTree(this.item.url)) ; 70 | this.linkType = this.getLinkType(); 71 | this.href = this.isDisabled() ? '' : (this.item.href || this.url); 72 | this.linkActive = this.router.url.split(/[?#(;]/)[0] === this.href.split(/[?#(;]/)[0]; 73 | this.navSubscription = this.navigationEndObservable.subscribe(event => { 74 | const itemUrlArray = this.href.split(/[?#(;]/)[0].split('/'); 75 | const urlArray = event.urlAfterRedirects.split(/[?#(;]/)[0].split('/'); 76 | this.linkActive = itemUrlArray.every((value, index) => value === urlArray[index]); 77 | }); 78 | } 79 | 80 | ngOnDestroy(): void { 81 | this.navSubscription.unsubscribe(); 82 | } 83 | 84 | public getLinkType() { 85 | return this.isDisabled() ? 'disabled' : this.isExternalLink() ? 'external' : 'link'; 86 | } 87 | 88 | public isDisabled() { 89 | return (this.item.attributes && this.item.attributes.disabled) ? true : null; 90 | } 91 | 92 | public isExternalLink() { 93 | return !!this.item.href || this.url.substring(0, 4) === 'http'; 94 | } 95 | 96 | linkClicked() { 97 | this.linkClick.emit(); 98 | } 99 | } 100 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-link.pipe.ts: -------------------------------------------------------------------------------- 1 | import { Pipe, PipeTransform } from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'appSidebarNavLink' 5 | }) 6 | export class AppSidebarNavLinkPipe implements PipeTransform { 7 | 8 | transform(item: any): any { 9 | 10 | const classes = { 'nav-link': true }; 11 | 12 | const disabled = item.attributes && item.attributes.disabled; 13 | classes['disabled'] = disabled; 14 | classes['btn-link'] = disabled; 15 | classes[`nav-link-${item.variant}`] = !!item.variant; 16 | return classes; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { AppSidebarNavTitleComponent } from './app-sidebar-nav-title.component'; 4 | 5 | describe('AppSidebarNavTitleComponent', () => { 6 | let component: AppSidebarNavTitleComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(waitForAsync(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [AppSidebarNavTitleComponent], 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(AppSidebarNavTitleComponent); 18 | component = fixture.componentInstance; 19 | component.item = { title: true, name: 'title'}; 20 | fixture.detectChanges(); 21 | }); 22 | 23 | it('should create', () => { 24 | expect(component).toBeTruthy(); 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar-nav/app-sidebar-nav-title.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, ElementRef, Input, OnInit, Renderer2} from '@angular/core'; 2 | import { INavData } from '../app-sidebar-nav'; 3 | 4 | @Component({ 5 | selector: 'app-sidebar-nav-title, cui-sidebar-nav-title', 6 | template: '', 7 | }) 8 | export class AppSidebarNavTitleComponent implements OnInit { 9 | @Input() item: INavData; 10 | 11 | constructor( 12 | private el: ElementRef, 13 | private renderer: Renderer2, 14 | ) {} 15 | 16 | ngOnInit() { 17 | const nativeElement: HTMLElement = this.el.nativeElement; 18 | const name = this.renderer.createText(this.item.name); 19 | 20 | if ( this.item.class ) { 21 | const classes = this.item.class; 22 | this.renderer.addClass(nativeElement, classes); 23 | } 24 | 25 | if ( this.item.wrapper ) { 26 | const wrapper = this.renderer.createElement(this.item.wrapper.element); 27 | this.addAttribs(this.item.wrapper.attributes, wrapper); 28 | this.renderer.appendChild(wrapper, name); 29 | this.renderer.appendChild(nativeElement, wrapper); 30 | } else { 31 | this.renderer.appendChild(nativeElement, name); 32 | } 33 | } 34 | 35 | private addAttribs(attribs, element) { 36 | if (attribs) { 37 | for (const attr in attribs) { 38 | if (attr === 'style' && typeof(attribs[attr]) === 'object' ) { 39 | this.setStyle(attribs[attr], element); 40 | } else if (attr === 'class') { 41 | this.addClass(attribs[attr], element); 42 | } else { 43 | this.setAttrib(attr, attribs[attr], element); 44 | } 45 | } 46 | } 47 | } 48 | 49 | private setStyle(styles, el) { 50 | for (const style in styles) { 51 | this.renderer.setStyle(el, style, styles[style] ); 52 | } 53 | } 54 | 55 | private addClass(classes, el) { 56 | const classArray = (Array.isArray(classes) ? classes : classes.split(' ')); 57 | classArray.filter((element) => element.length > 0).forEach(element => { 58 | this.renderer.addClass(el, element ); 59 | }); 60 | } 61 | 62 | private setAttrib(key, value, el) { 63 | this.renderer.setAttribute(el, key, value ); 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | 4 | import { AppSidebarComponent } from './app-sidebar.component'; 5 | 6 | describe('AppSidebarComponent', () => { 7 | let component: AppSidebarComponent; 8 | let fixture: ComponentFixture; 9 | 10 | beforeEach(waitForAsync(() => { 11 | TestBed.configureTestingModule({ 12 | imports: [RouterTestingModule.withRoutes([])], 13 | declarations: [ AppSidebarComponent ], 14 | }) 15 | .compileComponents(); 16 | })); 17 | 18 | beforeEach(() => { 19 | fixture = TestBed.createComponent(AppSidebarComponent); 20 | component = fixture.componentInstance; 21 | fixture.detectChanges(); 22 | }); 23 | 24 | it('should create', () => { 25 | expect(component).toBeTruthy(); 26 | }); 27 | 28 | it('has sidebar class', () => { 29 | expect(fixture.nativeElement.classList.contains('sidebar')).toBeTruthy(); 30 | }); 31 | 32 | describe('minimized', () => { 33 | it('updates document.body classes', () => { 34 | component.minimized = true; 35 | expect(document.body.classList.contains('sidebar-minimized')).toBeTruthy(); 36 | expect(document.body.classList.contains('brand-minimized')).toBeTruthy(); 37 | 38 | component.minimized = false; 39 | expect(document.body.classList.contains('sidebar-minimized')).toBeFalsy(); 40 | expect(document.body.classList.contains('brand-minimized')).toBeFalsy(); 41 | }); 42 | 43 | it('emits only when value changes', waitForAsync(() => { 44 | spyOn(component.minimizedChange, 'emit'); 45 | 46 | component.minimized = true; 47 | component.minimized = true; 48 | component.minimized = false; 49 | 50 | expect(component.minimizedChange.emit).toHaveBeenCalledTimes(2); 51 | })); 52 | }); 53 | }); 54 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar.component.ts: -------------------------------------------------------------------------------- 1 | import { DOCUMENT } from '@angular/common'; 2 | import { Component, EventEmitter, HostBinding, Inject, Input, OnDestroy, OnInit, Output, Renderer2 } from '@angular/core'; 3 | import { Subscription } from 'rxjs'; 4 | 5 | import { sidebarCssClasses } from '../shared'; 6 | import { AppSidebarService } from './app-sidebar.service'; 7 | 8 | @Component({ 9 | selector: 'app-sidebar, cui-sidebar', 10 | template: `` 11 | }) 12 | export class AppSidebarComponent implements OnInit, OnDestroy { 13 | 14 | private subscriptionEvents: Subscription; 15 | private _minimized = false; 16 | 17 | @Input() compact: boolean; 18 | @Input() display: any; 19 | @Input() fixed: boolean; 20 | @Input() offCanvas: boolean; 21 | 22 | @Input() 23 | get minimized() { 24 | return this._minimized; 25 | } 26 | set minimized(value: boolean) { 27 | // only update / emit events when the value changes 28 | if (this._minimized !== value) { 29 | this._minimized = value; 30 | this._updateMinimized(value); 31 | this.minimizedChange.emit(value); 32 | this.sidebarService.toggle({ minimize: value } ); 33 | } 34 | } 35 | 36 | /** 37 | * Emits whenever the minimized state of the sidebar changes. 38 | * Primarily used to facilitate two-way binding. 39 | */ 40 | @Output() minimizedChange = new EventEmitter(); 41 | 42 | @HostBinding('class.sidebar') sidebarClass = true; 43 | 44 | constructor( 45 | @Inject(DOCUMENT) private document: any, 46 | private renderer: Renderer2, 47 | private sidebarService: AppSidebarService 48 | ) { } 49 | 50 | ngOnInit(): void { 51 | this.displayBreakpoint(this.display); 52 | this.isCompact(this.compact); 53 | this.isFixed(this.fixed); 54 | this.isOffCanvas(this.offCanvas); 55 | this.sidebarService.toggle({ minimize: this.minimized } ); 56 | this.subscriptionEvents = this.sidebarService.events$.subscribe(action => { 57 | if (action.minimize !== undefined) { 58 | action.minimize === 'toggle' ? this.toggleMinimized() : this.minimized = !!action.minimize; 59 | } 60 | }); 61 | } 62 | 63 | ngOnDestroy(): void { 64 | this.subscriptionEvents.unsubscribe(); 65 | this.minimizedChange.complete(); 66 | this.renderer.removeClass(this.document.body, 'sidebar-fixed'); 67 | this._updateMinimized(false); 68 | } 69 | 70 | isCompact(compact: boolean = this.compact): void { 71 | if (compact) { 72 | this.renderer.addClass(this.document.body, 'sidebar-compact'); 73 | } 74 | } 75 | 76 | isFixed(fixed: boolean = this.fixed): void { 77 | if (fixed) { 78 | this.renderer.addClass(this.document.body, 'sidebar-fixed'); 79 | } 80 | } 81 | 82 | toggleMinimized(): void { 83 | this.minimized = !this._minimized; 84 | } 85 | 86 | isOffCanvas(offCanvas: boolean = this.offCanvas): void { 87 | if (offCanvas) { 88 | this.renderer.addClass(this.document.body, 'sidebar-off-canvas'); 89 | } 90 | } 91 | 92 | displayBreakpoint(display: any = this.display): void { 93 | if (display !== false) { 94 | const cssClass = display ? `sidebar-${display}-show` : sidebarCssClasses[0]; 95 | this.renderer.addClass(this.document.body, cssClass); 96 | } 97 | } 98 | 99 | private _updateMinimized(minimized: boolean): void { 100 | const body = this.document.body; 101 | 102 | if (minimized) { 103 | this.renderer.addClass(body, 'sidebar-minimized'); 104 | this.renderer.addClass(body, 'brand-minimized'); 105 | } else { 106 | this.renderer.removeClass(body, 'sidebar-minimized'); 107 | this.renderer.removeClass(body, 'brand-minimized'); 108 | } 109 | } 110 | } 111 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule } from '@angular/common'; 2 | import { NgModule } from '@angular/core'; 3 | import { RouterModule } from '@angular/router'; 4 | 5 | import { LayoutModule } from '../shared/layout/layout.module'; 6 | // App Sidebar Component 7 | import { AppSidebarComponent } from './app-sidebar.component'; 8 | import { AppSidebarFooterComponent } from './app-sidebar-footer.component'; 9 | import { AppSidebarFormComponent } from './app-sidebar-form.component'; 10 | import { AppSidebarHeaderComponent } from './app-sidebar-header.component'; 11 | import { AppSidebarMinimizerComponent } from './app-sidebar-minimizer.component'; 12 | import { AppSidebarService } from './app-sidebar.service'; 13 | 14 | // App SidebarNav Component 15 | import { NavDropdownDirective, NavDropdownToggleDirective } from './app-sidebar-nav.directive'; 16 | import { AppSidebarNavComponent } from './app-sidebar-nav.component'; 17 | import { AppSidebarNavDividerComponent } from './app-sidebar-nav/app-sidebar-nav-divider.component'; 18 | import { AppSidebarNavDropdownComponent } from './app-sidebar-nav/app-sidebar-nav-dropdown.component'; 19 | import { AppSidebarNavItemsComponent } from './app-sidebar-nav/app-sidebar-nav-items.component'; 20 | import { AppSidebarNavLinkComponent, AppSidebarNavLinkContentComponent } from './app-sidebar-nav/app-sidebar-nav-link.component'; 21 | import { AppSidebarNavTitleComponent } from './app-sidebar-nav/app-sidebar-nav-title.component'; 22 | import { SidebarNavHelper } from './app-sidebar-nav.service'; 23 | import { AppSidebarNavLabelComponent } from './app-sidebar-nav/app-sidebar-nav-label.component'; 24 | import { AppSidebarNavIconPipe } from './app-sidebar-nav/app-sidebar-nav-icon.pipe'; 25 | import { AppSidebarNavBadgePipe } from './app-sidebar-nav/app-sidebar-nav-badge.pipe'; 26 | import { AppSidebarNavLinkPipe } from './app-sidebar-nav/app-sidebar-nav-link.pipe'; 27 | import { AppSidebarNavItemClassPipe } from './app-sidebar-nav/app-sidebar-nav-item-class.pipe'; 28 | 29 | @NgModule({ 30 | imports: [ 31 | CommonModule, 32 | RouterModule, 33 | LayoutModule 34 | ], 35 | exports: [ 36 | AppSidebarFooterComponent, 37 | AppSidebarFormComponent, 38 | AppSidebarHeaderComponent, 39 | AppSidebarMinimizerComponent, 40 | AppSidebarComponent, 41 | AppSidebarNavItemsComponent, 42 | AppSidebarNavComponent, 43 | AppSidebarNavDividerComponent, 44 | AppSidebarNavDropdownComponent, 45 | AppSidebarNavLabelComponent, 46 | AppSidebarNavLinkComponent, 47 | AppSidebarNavLinkContentComponent, 48 | AppSidebarNavTitleComponent, 49 | NavDropdownDirective, 50 | NavDropdownToggleDirective, 51 | LayoutModule 52 | ], 53 | declarations: [ 54 | AppSidebarFooterComponent, 55 | AppSidebarFormComponent, 56 | AppSidebarHeaderComponent, 57 | AppSidebarMinimizerComponent, 58 | AppSidebarMinimizerComponent, 59 | AppSidebarComponent, 60 | AppSidebarNavItemsComponent, 61 | AppSidebarNavComponent, 62 | AppSidebarNavDividerComponent, 63 | AppSidebarNavDropdownComponent, 64 | AppSidebarNavLinkComponent, 65 | AppSidebarNavLinkContentComponent, 66 | AppSidebarNavTitleComponent, 67 | NavDropdownDirective, 68 | NavDropdownToggleDirective, 69 | AppSidebarNavLabelComponent, 70 | AppSidebarNavIconPipe, 71 | AppSidebarNavBadgePipe, 72 | AppSidebarNavLinkPipe, 73 | AppSidebarNavItemClassPipe 74 | ], 75 | providers: [ 76 | SidebarNavHelper, 77 | AppSidebarService 78 | ] 79 | }) 80 | export class AppSidebarModule { } 81 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar.service.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed } from '@angular/core/testing'; 2 | 3 | import { AppSidebarService } from './app-sidebar.service'; 4 | 5 | describe('AppSidebarService', () => { 6 | beforeEach(() => TestBed.configureTestingModule({})); 7 | 8 | it('should be created', () => { 9 | const service: AppSidebarService = TestBed.inject(AppSidebarService); 10 | expect(service).toBeTruthy(); 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/app-sidebar.service.ts: -------------------------------------------------------------------------------- 1 | import { Injectable } from '@angular/core'; 2 | import { BehaviorSubject } from 'rxjs'; 3 | 4 | export interface ISidebarAction { 5 | minimize?: boolean | 'toggle'; 6 | } 7 | 8 | @Injectable({ 9 | providedIn: 'root' 10 | }) 11 | export class AppSidebarService { 12 | 13 | private events = new BehaviorSubject({}); 14 | events$ = this.events.asObservable(); 15 | 16 | constructor() {} 17 | 18 | toggle(action: ISidebarAction) { 19 | this.events.next(action); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/index.ts: -------------------------------------------------------------------------------- 1 | export * from './public_api'; 2 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/lib/sidebar/public_api.ts: -------------------------------------------------------------------------------- 1 | export { INavData } from './app-sidebar-nav'; 2 | export { AppSidebarComponent } from './app-sidebar.component'; 3 | export { AppSidebarNavComponent } from './app-sidebar-nav.component'; 4 | export { AppSidebarMinimizerComponent } from './app-sidebar-minimizer.component'; 5 | export { SidebarNavHelper } from './app-sidebar-nav.service'; 6 | export { AppSidebarModule } from './app-sidebar.module'; 7 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/public-api.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * Public API Surface of @coreui/angular 3 | */ 4 | 5 | export * from './lib/aside/index'; 6 | export * from './lib/breadcrumb/index'; 7 | export * from './lib/footer/index'; 8 | export * from './lib/header/index'; 9 | export * from './lib/sidebar/index'; 10 | // export * from './lib/shared/index'; 11 | // export * from './lib/coreui.module'; 12 | -------------------------------------------------------------------------------- /projects/coreui/angular/src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone'; 4 | import 'zone.js/dist/zone-testing'; 5 | import { getTestBed } from '@angular/core/testing'; 6 | import { 7 | BrowserDynamicTestingModule, 8 | platformBrowserDynamicTesting 9 | } from '@angular/platform-browser-dynamic/testing'; 10 | 11 | import '@angular/localize/init'; 12 | 13 | declare const require: any; 14 | 15 | // First, initialize the Angular testing environment. 16 | getTestBed().initTestEnvironment( 17 | BrowserDynamicTestingModule, 18 | platformBrowserDynamicTesting() 19 | ); 20 | // Then we find all the tests. 21 | const context = require.context('./', true, /\.spec\.ts$/); 22 | // And load the modules. 23 | context.keys().map(context); 24 | -------------------------------------------------------------------------------- /projects/coreui/angular/tsconfig.lib.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "../../../tsconfig.json", 4 | "compilerOptions": { 5 | "outDir": "../../../out-tsc/lib", 6 | "declarationMap": true, 7 | "target": "es2015", 8 | "declaration": true, 9 | "inlineSources": true, 10 | "types": [], 11 | "lib": [ 12 | "dom", 13 | "es2018" 14 | ] 15 | }, 16 | "angularCompilerOptions": { 17 | "enableIvy": false, 18 | "flatModuleId": "@coreui/angular", 19 | "skipTemplateCodegen": true, 20 | "strictMetadataEmit": true, 21 | "enableResourceInlining": true 22 | }, 23 | "exclude": [ 24 | "src/test.ts", 25 | "**/*.spec.ts" 26 | ] 27 | } 28 | -------------------------------------------------------------------------------- /projects/coreui/angular/tsconfig.lib.prod.json: -------------------------------------------------------------------------------- 1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */ 2 | { 3 | "extends": "./tsconfig.lib.json", 4 | "compilerOptions": { 5 | "declarationMap": false 6 | }, 7 | "angularCompilerOptions": { 8 | "enableIvy": false 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /projects/coreui/angular/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../../../out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts" 12 | ], 13 | "include": [ 14 | "**/*.spec.ts", 15 | "**/*.d.ts" 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /projects/coreui/angular/tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tslint.json", 3 | "rules": { 4 | "directive-selector": [ 5 | true, 6 | "attribute", 7 | "app", 8 | "camelCase" 9 | ], 10 | "component-selector": [ 11 | true, 12 | "element", 13 | "app", 14 | "kebab-case" 15 | ], 16 | "forin": false 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/app/_nav.ts: -------------------------------------------------------------------------------- 1 | import { INavData } from '../../dist/@coreui/angular/lib/sidebar/public_api'; 2 | 3 | export const navItems: INavData[] = [ 4 | { 5 | name: 'Dashboard', 6 | url: '/dashboard', 7 | icon: 'icon-speedometer', 8 | badge: { 9 | variant: 'info', 10 | text: 'NEW' 11 | } 12 | }, 13 | { 14 | title: true, 15 | name: 'Title' 16 | }, 17 | { 18 | name: 'Disabled', 19 | url: '/dashboard', 20 | icon: 'icon-ban', 21 | attributes: { disabled: true }, 22 | }, 23 | { 24 | name: 'Download CoreUI', 25 | url: 'http://coreui.io/angular/', 26 | icon: 'icon-cloud-download', 27 | class: 'mt-auto', 28 | variant: 'success', 29 | attributes: { target: '_blank', rel: 'noopener' } 30 | }, 31 | { 32 | name: 'Try CoreUI PRO', 33 | url: 'http://coreui.io/pro/angular/', 34 | icon: 'icon-layers', 35 | variant: 'danger', 36 | attributes: { target: '_blank', rel: 'noopener' } 37 | } 38 | ]; 39 | -------------------------------------------------------------------------------- /src/app/app.component.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/app/app.component.css -------------------------------------------------------------------------------- /src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { RouterTestingModule } from '@angular/router/testing'; 2 | import { TestBed, waitForAsync } from '@angular/core/testing'; 3 | import { AppComponent } from './app.component'; 4 | describe('AppComponent', () => { 5 | beforeEach(waitForAsync(() => { 6 | TestBed.configureTestingModule({ 7 | declarations: [ 8 | AppComponent 9 | ], 10 | imports: [ RouterTestingModule ] 11 | }).compileComponents(); 12 | })); 13 | it('should create the app', waitForAsync(() => { 14 | const fixture = TestBed.createComponent(AppComponent); 15 | const app = fixture.debugElement.componentInstance; 16 | expect(app).toBeTruthy(); 17 | })); 18 | }); 19 | -------------------------------------------------------------------------------- /src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | import { Router, NavigationEnd } from '@angular/router'; 3 | 4 | @Component({ 5 | // tslint:disable-next-line 6 | selector: 'body', 7 | template: '' 8 | }) 9 | export class AppComponent implements OnInit { 10 | title = 'CoreUI 2 for Angular 8'; 11 | constructor(private router: Router) { } 12 | 13 | ngOnInit() { 14 | this.router.events.subscribe((evt) => { 15 | if (!(evt instanceof NavigationEnd)) { 16 | return; 17 | } 18 | window.scrollTo(0, 0); 19 | }); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | import { LocationStrategy, HashLocationStrategy } from '@angular/common'; 4 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 5 | 6 | import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar'; 7 | import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar'; 8 | import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar'; 9 | 10 | const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = { 11 | suppressScrollX: true 12 | }; 13 | 14 | import { AppComponent } from './app.component'; 15 | 16 | // Import containers 17 | import { DefaultLayoutComponent } from './containers'; 18 | 19 | const APP_CONTAINERS = [ 20 | DefaultLayoutComponent 21 | ]; 22 | 23 | import { 24 | AppAsideModule, 25 | AppBreadcrumbModule, 26 | AppHeaderModule, 27 | AppFooterModule, 28 | AppSidebarModule, 29 | } from '../../dist/@coreui/angular'; 30 | 31 | // Import routing module 32 | import { AppRoutingModule } from './app.routing'; 33 | 34 | 35 | @NgModule({ 36 | imports: [ 37 | BrowserModule, 38 | BrowserAnimationsModule, 39 | AppRoutingModule, 40 | AppAsideModule, 41 | AppBreadcrumbModule.forRoot(), 42 | AppFooterModule, 43 | AppHeaderModule, 44 | AppSidebarModule, 45 | PerfectScrollbarModule 46 | ], 47 | declarations: [ 48 | AppComponent, 49 | ...APP_CONTAINERS, 50 | ], 51 | providers: [{ 52 | provide: LocationStrategy, 53 | useClass: HashLocationStrategy 54 | }], 55 | bootstrap: [ AppComponent ] 56 | }) 57 | export class AppModule { } 58 | -------------------------------------------------------------------------------- /src/app/app.routing.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | // Import Containers 5 | import { DefaultLayoutComponent } from './containers'; 6 | 7 | export const routes: Routes = [ 8 | { 9 | path: '', 10 | redirectTo: 'dashboard', 11 | pathMatch: 'full', 12 | }, 13 | { 14 | path: '', 15 | component: DefaultLayoutComponent, 16 | data: { 17 | title: 'Home' 18 | }, 19 | children: [ 20 | { 21 | path: 'dashboard', 22 | loadChildren: () => import('./views/dashboard/dashboard.module').then(m => m.DashboardModule) 23 | } 24 | ] 25 | }, 26 | { path: '**', component: DefaultLayoutComponent } 27 | ]; 28 | 29 | @NgModule({ 30 | imports: [ RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' }) ], 31 | exports: [ RouterModule ] 32 | }) 33 | export class AppRoutingModule {} 34 | -------------------------------------------------------------------------------- /src/app/containers/default-layout/default-layout.component.html: -------------------------------------------------------------------------------- 1 | 8 |
    9 |
    10 |     11 |
    12 | 13 | 14 | 15 | 16 | 17 |
    18 | 19 | 20 | 21 | 22 |
    23 | 24 |
    25 |
    26 | 27 | 28 |
    29 | 30 | CoreUI © 2021 creativeLabs. 31 | Powered by CoreUI 2 for Angular 32 | 33 | -------------------------------------------------------------------------------- /src/app/containers/default-layout/default-layout.component.ts: -------------------------------------------------------------------------------- 1 | import {Component} from '@angular/core'; 2 | 3 | import { navItems } from '../../_nav'; 4 | 5 | @Component({ 6 | selector: 'app-dashboard', 7 | templateUrl: './default-layout.component.html' 8 | }) 9 | export class DefaultLayoutComponent { 10 | minimized = false; 11 | public navItems = [...navItems]; 12 | 13 | toggleMinimize(e) { 14 | this.minimized = e; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/app/containers/default-layout/index.ts: -------------------------------------------------------------------------------- 1 | export * from './default-layout.component'; 2 | -------------------------------------------------------------------------------- /src/app/containers/index.ts: -------------------------------------------------------------------------------- 1 | export * from './default-layout'; 2 | -------------------------------------------------------------------------------- /src/app/views/dashboard/dashboard-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | import { DashboardComponent } from './dashboard.component'; 5 | 6 | const routes: Routes = [ 7 | { 8 | path: '', 9 | component: DashboardComponent, 10 | data: { 11 | title: 'Dashboard' 12 | } 13 | } 14 | ]; 15 | 16 | @NgModule({ 17 | imports: [RouterModule.forChild(routes)], 18 | exports: [RouterModule] 19 | }) 20 | export class DashboardRoutingModule {} 21 | -------------------------------------------------------------------------------- /src/app/views/dashboard/dashboard.component.html: -------------------------------------------------------------------------------- 1 |
    2 | CoreUI Dashboard 3 |
    4 | -------------------------------------------------------------------------------- /src/app/views/dashboard/dashboard.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | templateUrl: 'dashboard.component.html' 5 | }) 6 | export class DashboardComponent {} 7 | -------------------------------------------------------------------------------- /src/app/views/dashboard/dashboard.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | 3 | import { DashboardComponent } from './dashboard.component'; 4 | import { DashboardRoutingModule } from './dashboard-routing.module'; 5 | 6 | @NgModule({ 7 | imports: [ 8 | DashboardRoutingModule, 9 | ], 10 | declarations: [ DashboardComponent ] 11 | }) 12 | export class DashboardModule { } 13 | -------------------------------------------------------------------------------- /src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/.gitkeep -------------------------------------------------------------------------------- /src/assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/favicon.ico -------------------------------------------------------------------------------- /src/assets/img/avatars/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/1.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/2.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/3.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/4.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/5.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/6.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/7.jpg -------------------------------------------------------------------------------- /src/assets/img/avatars/8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nirzaf/coreui-angular/e756214f700070b8db9e24bb74e42061564a1bc9/src/assets/img/avatars/8.jpg -------------------------------------------------------------------------------- /src/assets/img/brand/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 9 | 10 | 11 | 13 | 14 | 16 | 17 | 18 | 25 | 32 | 37 | 38 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /src/assets/img/brand/sygnet.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 9 | 10 | 11 | 13 | 14 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build ---prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * In development mode, to ignore zone related error stack frames such as 11 | * `zone.run`, `zoneDelegate.invokeTask` for easier debugging, you can 12 | * import the following file, but please comment it out in production mode 13 | * because it will have performance impact when throw error 14 | */ 15 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 16 | -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | CoreUI - Free Angular Admin Template 19 | 20 | 21 | 30 | 31 | 32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /src/karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | jasmine: { 17 | // you can add configuration options for Jasmine here 18 | // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html 19 | // for example, you can disable the random execution with `random: false` 20 | // or set a specific seed with `seed: 4321` 21 | }, 22 | clearContext: false // leave Jasmine Spec Runner output visible in browser 23 | }, 24 | jasmineHtmlReporter: { 25 | suppressAll: true // removes the duplicated traces 26 | }, 27 | coverageReporter: { 28 | dir: require('path').join(__dirname, '../coverage/coreui-test'), 29 | subdir: '.', 30 | reporters: [ 31 | { type: 'html' }, 32 | { type: 'text-summary' } 33 | ] 34 | }, 35 | reporters: ['progress', 'kjhtml'], 36 | port: 9876, 37 | colors: true, 38 | logLevel: config.LOG_INFO, 39 | autoWatch: true, 40 | browsers: ['Chrome'], 41 | singleRun: false, 42 | restartOnFileChange: true 43 | }); 44 | }; 45 | -------------------------------------------------------------------------------- /src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule, { 12 | useJit: true, 13 | preserveWhitespaces: true 14 | }) 15 | .catch(err => console.log(err)); 16 | -------------------------------------------------------------------------------- /src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /*************************************************************************************************** 2 | * Load `$localize` onto the global scope - used if i18n tags appear in Angular templates. 3 | */ 4 | import '@angular/localize/init'; 5 | 6 | /** 7 | * This file includes polyfills needed by Angular and is loaded before the app. 8 | * You can add your own extra polyfills to this file. 9 | * 10 | * This file is divided into 2 sections: 11 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 12 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 13 | * file. 14 | * 15 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 16 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 17 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 18 | * 19 | * Learn more in https://angular.io/guide/browser-support 20 | */ 21 | 22 | /*************************************************************************************************** 23 | * BROWSER POLYFILLS 24 | */ 25 | 26 | /** IE11 requires the following for NgClass support on SVG elements */ 27 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 28 | 29 | /** IE11 requires all of the following polyfills. */ 30 | import 'core-js'; 31 | 32 | /** IE11 requires the following for the Reflect API. */ 33 | import 'core-js/es/reflect'; 34 | 35 | /** 36 | * Web Animations `@angular/platform-browser/animations` 37 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 38 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 39 | */ 40 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 41 | 42 | /** 43 | * By default, zone.js will patch all possible macroTask and DomEvents 44 | * user can disable parts of macroTask/DomEvents patch by setting following flags 45 | * because those flags need to be set before `zone.js` being loaded, and webpack 46 | * will put import in the top of bundle, so user need to create a separate file 47 | * in this directory (for example: zone-flags.ts), and put the following flags 48 | * into that file, and then add the following code before importing zone.js. 49 | * import './zone-flags'; 50 | * 51 | * The flags allowed in zone-flags.ts are listed here. 52 | * 53 | * The following flags will work for all browsers. 54 | * 55 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 56 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 57 | * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 58 | * 59 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 60 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 61 | * 62 | * (window as any).__Zone_enable_cross_context_check = true; 63 | * 64 | */ 65 | 66 | /*************************************************************************************************** 67 | * Zone JS is required by default for Angular itself. 68 | */ 69 | import 'zone.js/dist/zone'; // Included with Angular CLI. 70 | 71 | 72 | /*************************************************************************************************** 73 | * APPLICATION IMPORTS 74 | */ 75 | (window as any).global = window; 76 | 77 | -------------------------------------------------------------------------------- /src/scss/_custom.scss: -------------------------------------------------------------------------------- 1 | // Here you can add other styles 2 | -------------------------------------------------------------------------------- /src/scss/_variables.scss: -------------------------------------------------------------------------------- 1 | // Variable overrides 2 | -------------------------------------------------------------------------------- /src/scss/style.scss: -------------------------------------------------------------------------------- 1 | // If you want to override variables do it here 2 | @import "variables"; 3 | 4 | // Import styles 5 | @import "~@coreui/coreui/scss/coreui"; 6 | 7 | // If you want to add something do it here 8 | @import "custom"; 9 | -------------------------------------------------------------------------------- /src/scss/vendors/_variables.scss: -------------------------------------------------------------------------------- 1 | // Override Boostrap variables 2 | @import "../variables"; 3 | @import "~bootstrap/scss/mixins"; 4 | @import "~@coreui/coreui/scss/variables"; 5 | -------------------------------------------------------------------------------- /src/scss/vendors/chart.js/chart.scss: -------------------------------------------------------------------------------- 1 | // Import variables 2 | @import '../variables'; 3 | 4 | .chart-legend, 5 | .bar-legend, 6 | .line-legend, 7 | .pie-legend, 8 | .radar-legend, 9 | .polararea-legend, 10 | .doughnut-legend { 11 | list-style-type: none; 12 | margin-top: 5px; 13 | text-align: center; 14 | -webkit-padding-start: 0; 15 | -moz-padding-start: 0; 16 | padding-left: 0; 17 | } 18 | .chart-legend li, 19 | .bar-legend li, 20 | .line-legend li, 21 | .pie-legend li, 22 | .radar-legend li, 23 | .polararea-legend li, 24 | .doughnut-legend li { 25 | display: inline-block; 26 | white-space: nowrap; 27 | position: relative; 28 | margin-bottom: 4px; 29 | @include border-radius($border-radius); 30 | padding: 2px 8px 2px 28px; 31 | font-size: smaller; 32 | cursor: default; 33 | } 34 | .chart-legend li span, 35 | .bar-legend li span, 36 | .line-legend li span, 37 | .pie-legend li span, 38 | .radar-legend li span, 39 | .polararea-legend li span, 40 | .doughnut-legend li span { 41 | display: block; 42 | position: absolute; 43 | left: 0; 44 | top: 0; 45 | width: 20px; 46 | height: 20px; 47 | @include border-radius($border-radius); 48 | } 49 | -------------------------------------------------------------------------------- /src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: any; 11 | 12 | // First, initialize the Angular testing environment. 13 | getTestBed().initTestEnvironment( 14 | BrowserDynamicTestingModule, 15 | platformBrowserDynamicTesting() 16 | ); 17 | // Then we find all the tests. 18 | const context = require.context('./', true, /\.spec\.ts$/); 19 | // And load the modules. 20 | context.keys().map(context); 21 | -------------------------------------------------------------------------------- /src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "baseUrl": "./", 6 | "module": "esnext", 7 | "target": "es2015", 8 | "types": [], 9 | "paths": { 10 | "@angular/*": [ 11 | "../node_modules/@angular/*" 12 | ] 13 | } 14 | }, 15 | "angularCompilerOptions": { 16 | "enableIvy": true 17 | }, 18 | "files": [ 19 | "main.ts", 20 | "polyfills.ts" 21 | ], 22 | "include": [ 23 | "**/*.d.ts" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /src/tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/spec", 5 | "baseUrl": "./", 6 | "module": "commonjs", 7 | "types": [ 8 | "jasmine", 9 | "node" 10 | ] 11 | }, 12 | "files": [ 13 | "test.ts", 14 | "polyfills.ts" 15 | ], 16 | "include": [ 17 | "**/*.spec.ts", 18 | "**/*.d.ts" 19 | ] 20 | } 21 | -------------------------------------------------------------------------------- /src/typings.d.ts: -------------------------------------------------------------------------------- 1 | /* SystemJS module definition */ 2 | declare var module: NodeModule; 3 | interface NodeModule { 4 | id: string; 5 | } 6 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist", 6 | "sourceMap": true, 7 | "declaration": true, 8 | "downlevelIteration": true, 9 | "experimentalDecorators": true, 10 | "module": "esnext", 11 | "moduleResolution": "node", 12 | "importHelpers": true, 13 | "target": "es2015", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ], 21 | "paths": { 22 | "@coreui/angular": [ 23 | "dist/@coreui/angular" 24 | ] 25 | } 26 | }, 27 | "angularCompilerOptions": { 28 | "enableIvy": false, 29 | "fullTemplateTypeCheck": true, 30 | "strictInjectionParameters": true 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rulesDirectory": [ 4 | "codelyzer" 5 | ], 6 | "rules": { 7 | "align": { 8 | "options": [ 9 | "parameters", 10 | "statements" 11 | ] 12 | }, 13 | "array-type": false, 14 | "arrow-parens": false, 15 | "arrow-return-shorthand": true, 16 | "deprecation": { 17 | "severity": "warning" 18 | }, 19 | "import-blacklist": [ 20 | true, 21 | "rxjs/Rx" 22 | ], 23 | "curly": true, 24 | "interface-name": false, 25 | "max-classes-per-file": false, 26 | "eofline": true, 27 | "max-line-length": [ 28 | true, 29 | 140 30 | ], 31 | "import-spacing": true, 32 | "indent": { 33 | "options": [ 34 | "spaces" 35 | ] 36 | }, 37 | "member-access": false, 38 | "member-ordering": [ 39 | true, 40 | { 41 | "order": [ 42 | "static-field", 43 | "instance-field", 44 | "static-method", 45 | "instance-method" 46 | ] 47 | } 48 | ], 49 | "no-consecutive-blank-lines": false, 50 | "no-console": [ 51 | true, 52 | "debug", 53 | "info", 54 | "time", 55 | "timeEnd", 56 | "trace" 57 | ], 58 | "no-empty": false, 59 | "no-inferrable-types": [ 60 | true, 61 | "ignore-params" 62 | ], 63 | "no-non-null-assertion": true, 64 | "no-redundant-jsdoc": true, 65 | "no-string-literal": false, 66 | "no-switch-case-fall-through": true, 67 | "no-var-requires": false, 68 | "object-literal-key-quotes": [ 69 | true, 70 | "as-needed" 71 | ], 72 | "object-literal-sort-keys": false, 73 | "ordered-imports": false, 74 | "prefer-const": true, 75 | "quotemark": [ 76 | true, 77 | "single" 78 | ], 79 | "trailing-comma": false, 80 | "component-class-suffix": true, 81 | "contextual-lifecycle": true, 82 | "directive-class-suffix": true, 83 | "no-conflicting-lifecycle": true, 84 | "variable-name": false, 85 | "no-host-metadata-property": true, 86 | "no-input-rename": true, 87 | "no-inputs-metadata-property": true, 88 | "no-output-native": true, 89 | "no-output-on-prefix": true, 90 | "semicolon": { 91 | "options": [ 92 | "always" 93 | ] 94 | }, 95 | "space-before-function-paren": { 96 | "options": { 97 | "anonymous": "never", 98 | "asyncArrow": "always", 99 | "constructor": "never", 100 | "method": "never", 101 | "named": "never" 102 | } 103 | }, 104 | "no-output-rename": true, 105 | "no-outputs-metadata-property": true, 106 | "template-banana-in-box": true, 107 | "typedef-whitespace": { 108 | "options": [ 109 | { 110 | "call-signature": "nospace", 111 | "index-signature": "nospace", 112 | "parameter": "nospace", 113 | "property-declaration": "nospace", 114 | "variable-declaration": "nospace" 115 | }, 116 | { 117 | "call-signature": "onespace", 118 | "index-signature": "onespace", 119 | "parameter": "onespace", 120 | "property-declaration": "onespace", 121 | "variable-declaration": "onespace" 122 | } 123 | ] 124 | }, 125 | "template-no-negated-async": true, 126 | "use-lifecycle-interface": true, 127 | "use-pipe-transform-interface": true, 128 | "whitespace": { 129 | "options": [ 130 | "check-branch", 131 | "check-decl", 132 | "check-operator", 133 | "check-separator", 134 | "check-type", 135 | "check-typecast" 136 | ] 137 | } 138 | } 139 | } 140 | --------------------------------------------------------------------------------