From 63a01113c9bf705ded724e91a28513ade4acf357 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Thu, 27 Feb 2020 22:10:14 -0500 Subject: [PATCH 1/9] feat(samples): Starter app --- examples/example-app/.editorconfig | 13 + examples/example-app/.gitignore | 46 ++ examples/example-app/README.md | 27 + examples/example-app/angular.json | 133 +++++ examples/example-app/browserslist | 12 + examples/example-app/e2e/protractor.conf.js | 32 ++ examples/example-app/e2e/src/app.e2e-spec.ts | 23 + examples/example-app/e2e/src/app.po.ts | 11 + examples/example-app/e2e/tsconfig.json | 13 + examples/example-app/karma.conf.js | 32 ++ examples/example-app/package.json | 48 ++ .../example-app/src/app/app-routing.module.ts | 11 + .../example-app/src/app/app.component.html | 534 ++++++++++++++++++ .../example-app/src/app/app.component.scss | 0 .../example-app/src/app/app.component.spec.ts | 35 ++ examples/example-app/src/app/app.component.ts | 10 + examples/example-app/src/app/app.module.ts | 20 + .../example-app/src/app/material.module.ts | 59 ++ examples/example-app/src/assets/.gitkeep | 0 .../src/environments/environment.prod.ts | 3 + .../src/environments/environment.ts | 16 + examples/example-app/src/favicon.ico | Bin 0 -> 948 bytes examples/example-app/src/index.html | 13 + examples/example-app/src/main.ts | 12 + examples/example-app/src/polyfills.ts | 63 +++ examples/example-app/src/styles.scss | 13 + examples/example-app/src/styles/_body.scss | 13 + examples/example-app/src/styles/_mdc.scss | 34 ++ examples/example-app/src/test.ts | 25 + examples/example-app/tsconfig.app.json | 14 + examples/example-app/tsconfig.json | 26 + examples/example-app/tsconfig.spec.json | 18 + examples/example-app/tslint.json | 91 +++ 33 files changed, 1400 insertions(+) create mode 100644 examples/example-app/.editorconfig create mode 100644 examples/example-app/.gitignore create mode 100644 examples/example-app/README.md create mode 100644 examples/example-app/angular.json create mode 100644 examples/example-app/browserslist create mode 100644 examples/example-app/e2e/protractor.conf.js create mode 100644 examples/example-app/e2e/src/app.e2e-spec.ts create mode 100644 examples/example-app/e2e/src/app.po.ts create mode 100644 examples/example-app/e2e/tsconfig.json create mode 100644 examples/example-app/karma.conf.js create mode 100644 examples/example-app/package.json create mode 100644 examples/example-app/src/app/app-routing.module.ts create mode 100644 examples/example-app/src/app/app.component.html create mode 100644 examples/example-app/src/app/app.component.scss create mode 100644 examples/example-app/src/app/app.component.spec.ts create mode 100644 examples/example-app/src/app/app.component.ts create mode 100644 examples/example-app/src/app/app.module.ts create mode 100644 examples/example-app/src/app/material.module.ts create mode 100644 examples/example-app/src/assets/.gitkeep create mode 100644 examples/example-app/src/environments/environment.prod.ts create mode 100644 examples/example-app/src/environments/environment.ts create mode 100644 examples/example-app/src/favicon.ico create mode 100644 examples/example-app/src/index.html create mode 100644 examples/example-app/src/main.ts create mode 100644 examples/example-app/src/polyfills.ts create mode 100644 examples/example-app/src/styles.scss create mode 100644 examples/example-app/src/styles/_body.scss create mode 100644 examples/example-app/src/styles/_mdc.scss create mode 100644 examples/example-app/src/test.ts create mode 100644 examples/example-app/tsconfig.app.json create mode 100644 examples/example-app/tsconfig.json create mode 100644 examples/example-app/tsconfig.spec.json create mode 100644 examples/example-app/tslint.json diff --git a/examples/example-app/.editorconfig b/examples/example-app/.editorconfig new file mode 100644 index 000000000..e89330a61 --- /dev/null +++ b/examples/example-app/.editorconfig @@ -0,0 +1,13 @@ +# Editor configuration, see https://editorconfig.org +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +max_line_length = off +trim_trailing_whitespace = false diff --git a/examples/example-app/.gitignore b/examples/example-app/.gitignore new file mode 100644 index 000000000..86d943a9b --- /dev/null +++ b/examples/example-app/.gitignore @@ -0,0 +1,46 @@ +# See http://help.github.com/ignore-files/ for more about ignoring files. + +# compiled output +/dist +/tmp +/out-tsc +# Only exists if Bazel was run +/bazel-out + +# dependencies +/node_modules + +# profiling files +chrome-profiler-events*.json +speed-measure-plugin*.json + +# IDEs and editors +/.idea +.project +.classpath +.c9/ +*.launch +.settings/ +*.sublime-workspace + +# IDE - VSCode +.vscode/* +!.vscode/settings.json +!.vscode/tasks.json +!.vscode/launch.json +!.vscode/extensions.json +.history/* + +# misc +/.sass-cache +/connect.lock +/coverage +/libpeerconnection.log +npm-debug.log +yarn-error.log +testem.log +/typings + +# System Files +.DS_Store +Thumbs.db diff --git a/examples/example-app/README.md b/examples/example-app/README.md new file mode 100644 index 000000000..198b93a12 --- /dev/null +++ b/examples/example-app/README.md @@ -0,0 +1,27 @@ +# ExampleApp + +This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.4. + +## Development server + +Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. + +## Code scaffolding + +Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`. + +## Build + +Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build. + +## Running unit tests + +Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io). + +## Running end-to-end tests + +Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). + +## Further help + +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). diff --git a/examples/example-app/angular.json b/examples/example-app/angular.json new file mode 100644 index 000000000..0ca8b47ec --- /dev/null +++ b/examples/example-app/angular.json @@ -0,0 +1,133 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "example-app": { + "projectType": "application", + "schematics": { + "@schematics/angular:component": { + "style": "scss" + } + }, + "root": "", + "sourceRoot": "src", + "prefix": "app", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "dist/example-app", + "index": "src/index.html", + "main": "src/main.ts", + "polyfills": "src/polyfills.ts", + "tsConfig": "tsconfig.app.json", + "aot": true, + "assets": [ + "src/favicon.ico", + "src/assets" + ], + "styles": [ + "src/styles.scss" + ], + "stylePreprocessorOptions": { + "includePaths": [ + "node_modules/" + ] + }, + "scripts": [] + }, + "configurations": { + "production": { + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ], + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "budgets": [ + { + "type": "initial", + "maximumWarning": "2mb", + "maximumError": "5mb" + }, + { + "type": "anyComponentStyle", + "maximumWarning": "6kb", + "maximumError": "10kb" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "example-app:build" + }, + "configurations": { + "production": { + "browserTarget": "example-app:build:production" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "example-app:build" + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "main": "src/test.ts", + "polyfills": "src/polyfills.ts", + "tsConfig": "tsconfig.spec.json", + "karmaConfig": "karma.conf.js", + "assets": [ + "src/favicon.ico", + "src/assets" + ], + "styles": [ + "src/styles.scss" + ], + "scripts": [] + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "tsconfig.app.json", + "tsconfig.spec.json", + "e2e/tsconfig.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + }, + "e2e": { + "builder": "@angular-devkit/build-angular:protractor", + "options": { + "protractorConfig": "e2e/protractor.conf.js", + "devServerTarget": "example-app:serve" + }, + "configurations": { + "production": { + "devServerTarget": "example-app:serve:production" + } + } + } + } + }}, + "defaultProject": "example-app" +} diff --git a/examples/example-app/browserslist b/examples/example-app/browserslist new file mode 100644 index 000000000..80848532e --- /dev/null +++ b/examples/example-app/browserslist @@ -0,0 +1,12 @@ +# This file is used by the build system to adjust CSS and JS output to support the specified browsers below. +# For additional information regarding the format and rule options, please see: +# https://github.com/browserslist/browserslist#queries + +# You can see what browsers were selected by your queries by running: +# npx browserslist + +> 0.5% +last 2 versions +Firefox ESR +not dead +not IE 9-11 # For IE 9-11 support, remove 'not'. \ No newline at end of file diff --git a/examples/example-app/e2e/protractor.conf.js b/examples/example-app/e2e/protractor.conf.js new file mode 100644 index 000000000..7c798cfff --- /dev/null +++ b/examples/example-app/e2e/protractor.conf.js @@ -0,0 +1,32 @@ +// @ts-check +// Protractor configuration file, see link for more information +// https://github.com/angular/protractor/blob/master/lib/config.ts + +const { SpecReporter } = require('jasmine-spec-reporter'); + +/** + * @type { import("protractor").Config } + */ +exports.config = { + allScriptsTimeout: 11000, + specs: [ + './src/**/*.e2e-spec.ts' + ], + capabilities: { + browserName: 'chrome' + }, + directConnect: true, + baseUrl: 'http://localhost:4200/', + framework: 'jasmine', + jasmineNodeOpts: { + showColors: true, + defaultTimeoutInterval: 30000, + print: function() {} + }, + onPrepare() { + require('ts-node').register({ + project: require('path').join(__dirname, './tsconfig.json') + }); + jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); + } +}; \ No newline at end of file diff --git a/examples/example-app/e2e/src/app.e2e-spec.ts b/examples/example-app/e2e/src/app.e2e-spec.ts new file mode 100644 index 000000000..e19f1be59 --- /dev/null +++ b/examples/example-app/e2e/src/app.e2e-spec.ts @@ -0,0 +1,23 @@ +import { AppPage } from './app.po'; +import { browser, logging } from 'protractor'; + +describe('workspace-project App', () => { + let page: AppPage; + + beforeEach(() => { + page = new AppPage(); + }); + + it('should display welcome message', () => { + page.navigateTo(); + expect(page.getTitleText()).toEqual('example-app app is running!'); + }); + + afterEach(async () => { + // Assert that there are no errors emitted from the browser + const logs = await browser.manage().logs().get(logging.Type.BROWSER); + expect(logs).not.toContain(jasmine.objectContaining({ + level: logging.Level.SEVERE, + } as logging.Entry)); + }); +}); diff --git a/examples/example-app/e2e/src/app.po.ts b/examples/example-app/e2e/src/app.po.ts new file mode 100644 index 000000000..b68475e0f --- /dev/null +++ b/examples/example-app/e2e/src/app.po.ts @@ -0,0 +1,11 @@ +import { browser, by, element } from 'protractor'; + +export class AppPage { + navigateTo(): Promise { + return browser.get(browser.baseUrl) as Promise; + } + + getTitleText(): Promise { + return element(by.css('app-root .content span')).getText() as Promise; + } +} diff --git a/examples/example-app/e2e/tsconfig.json b/examples/example-app/e2e/tsconfig.json new file mode 100644 index 000000000..39b800f78 --- /dev/null +++ b/examples/example-app/e2e/tsconfig.json @@ -0,0 +1,13 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/e2e", + "module": "commonjs", + "target": "es5", + "types": [ + "jasmine", + "jasminewd2", + "node" + ] + } +} diff --git a/examples/example-app/karma.conf.js b/examples/example-app/karma.conf.js new file mode 100644 index 000000000..864a5d62d --- /dev/null +++ b/examples/example-app/karma.conf.js @@ -0,0 +1,32 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular-devkit/build-angular'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage-istanbul-reporter'), + require('@angular-devkit/build-angular/plugins/karma') + ], + client: { + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + coverageIstanbulReporter: { + dir: require('path').join(__dirname, './coverage/example-app'), + reports: ['html', 'lcovonly', 'text-summary'], + fixWebpackSourcePaths: true + }, + reporters: ['progress', 'kjhtml'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['Chrome'], + singleRun: false, + restartOnFileChange: true + }); +}; diff --git a/examples/example-app/package.json b/examples/example-app/package.json new file mode 100644 index 000000000..388040510 --- /dev/null +++ b/examples/example-app/package.json @@ -0,0 +1,48 @@ +{ + "name": "example-app", + "version": "0.0.0", + "scripts": { + "ng": "ng", + "start": "ng serve", + "build": "ng build", + "test": "ng test", + "lint": "ng lint", + "e2e": "ng e2e" + }, + "private": true, + "dependencies": { + "@angular-mdc/web": "^5.1.0", + "@angular/animations": "~9.0.3", + "@angular/common": "~9.0.3", + "@angular/compiler": "~9.0.3", + "@angular/core": "~9.0.3", + "@angular/forms": "~9.0.3", + "@angular/platform-browser": "~9.0.3", + "@angular/platform-browser-dynamic": "~9.0.3", + "@angular/router": "~9.0.3", + "rxjs": "~6.5.4", + "tslib": "^1.10.0", + "zone.js": "~0.10.2" + }, + "devDependencies": { + "@angular-devkit/build-angular": "~0.900.4", + "@angular/cli": "~9.0.4", + "@angular/compiler-cli": "~9.0.3", + "@angular/language-service": "~9.0.3", + "@types/jasmine": "~3.5.0", + "@types/jasminewd2": "~2.0.3", + "@types/node": "^12.11.1", + "codelyzer": "^5.1.2", + "jasmine-core": "~3.5.0", + "jasmine-spec-reporter": "~4.2.1", + "karma": "~4.3.0", + "karma-chrome-launcher": "~3.1.0", + "karma-coverage-istanbul-reporter": "~2.1.0", + "karma-jasmine": "~2.0.1", + "karma-jasmine-html-reporter": "^1.4.2", + "protractor": "~5.4.3", + "ts-node": "~8.3.0", + "tslint": "~5.18.0", + "typescript": "~3.7.5" + } +} diff --git a/examples/example-app/src/app/app-routing.module.ts b/examples/example-app/src/app/app-routing.module.ts new file mode 100644 index 000000000..06c734263 --- /dev/null +++ b/examples/example-app/src/app/app-routing.module.ts @@ -0,0 +1,11 @@ +import { NgModule } from '@angular/core'; +import { Routes, RouterModule } from '@angular/router'; + + +const routes: Routes = []; + +@NgModule({ + imports: [RouterModule.forRoot(routes)], + exports: [RouterModule] +}) +export class AppRoutingModule { } diff --git a/examples/example-app/src/app/app.component.html b/examples/example-app/src/app/app.component.html new file mode 100644 index 000000000..0c510c671 --- /dev/null +++ b/examples/example-app/src/app/app.component.html @@ -0,0 +1,534 @@ + + + + + + + + + + + + + + +
+ + +
+ + + + + + + + + + + + {{ title }} app is running! + + + + + +
+ + +

Resources

+

Here are some links to help you get started:

+ +
+ + + + Learn Angular + + + + + + + CLI Documentation + + + + + + + + Angular Blog + + + + +
+ + +

Next Steps

+

What do you want to do next with your app?

+ + + +
+
+ + + New Component +
+ +
+ + + Angular Material +
+ +
+ + + Add PWA Support +
+ +
+ + + Add Dependency +
+ +
+ + + Run and Watch Tests +
+ +
+ + + Build for Production +
+
+ + +
+ 
ng generate component xyz
+ 
ng add @angular/material
+ 
ng add @angular/pwa
+ 
ng add _____
+ 
ng test
+ 
ng build --prod
+
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + +
+ + + + + + + + + + + + \ No newline at end of file diff --git a/examples/example-app/src/app/app.component.scss b/examples/example-app/src/app/app.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/examples/example-app/src/app/app.component.spec.ts b/examples/example-app/src/app/app.component.spec.ts new file mode 100644 index 000000000..217749737 --- /dev/null +++ b/examples/example-app/src/app/app.component.spec.ts @@ -0,0 +1,35 @@ +import { TestBed, async } from '@angular/core/testing'; +import { RouterTestingModule } from '@angular/router/testing'; +import { AppComponent } from './app.component'; + +describe('AppComponent', () => { + beforeEach(async(() => { + TestBed.configureTestingModule({ + imports: [ + RouterTestingModule + ], + declarations: [ + AppComponent + ], + }).compileComponents(); + })); + + it('should create the app', () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.componentInstance; + expect(app).toBeTruthy(); + }); + + it(`should have as title 'example-app'`, () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.componentInstance; + expect(app.title).toEqual('example-app'); + }); + + it('should render title', () => { + const fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + const compiled = fixture.nativeElement; + expect(compiled.querySelector('.content span').textContent).toContain('example-app app is running!'); + }); +}); diff --git a/examples/example-app/src/app/app.component.ts b/examples/example-app/src/app/app.component.ts new file mode 100644 index 000000000..9c627af7a --- /dev/null +++ b/examples/example-app/src/app/app.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.scss'] +}) +export class AppComponent { + title = 'example-app'; +} diff --git a/examples/example-app/src/app/app.module.ts b/examples/example-app/src/app/app.module.ts new file mode 100644 index 000000000..4c391a67a --- /dev/null +++ b/examples/example-app/src/app/app.module.ts @@ -0,0 +1,20 @@ +import {BrowserModule} from '@angular/platform-browser'; +import {NgModule} from '@angular/core'; + +import {AppRoutingModule} from './app-routing.module'; +import {AppComponent} from './app.component'; +import {MaterialModule} from './material.module'; + +@NgModule({ + declarations: [ + AppComponent + ], + imports: [ + BrowserModule, + AppRoutingModule, + MaterialModule, + ], + providers: [], + bootstrap: [AppComponent] +}) +export class AppModule {} diff --git a/examples/example-app/src/app/material.module.ts b/examples/example-app/src/app/material.module.ts new file mode 100644 index 000000000..daf9bbf7a --- /dev/null +++ b/examples/example-app/src/app/material.module.ts @@ -0,0 +1,59 @@ +import {NgModule} from '@angular/core'; +import { + MdcButtonModule, + MdcCardModule, + MdcCheckboxModule, + MdcChipsModule, + MDCDataTableModule, + MdcDialogModule, + MdcDrawerModule, + MdcElevationModule, + MdcFabModule, + MdcIconButtonModule, + MdcIconModule, + MdcImageListModule, + MdcLinearProgressModule, + MdcListModule, + MdcMenuModule, + MdcRadioModule, + MdcRippleModule, + MdcSelectModule, + MdcSliderModule, + MdcSnackbarModule, + MdcSwitchModule, + MdcTabBarModule, + MdcTextFieldModule, + MdcTopAppBarModule, + MdcTypographyModule +} from '@angular-mdc/web'; + +@NgModule({ + exports: [ + MdcButtonModule, + MdcCardModule, + MdcCheckboxModule, + MdcChipsModule, + MDCDataTableModule, + MdcDialogModule, + MdcDrawerModule, + MdcElevationModule, + MdcFabModule, + MdcIconButtonModule, + MdcIconModule, + MdcImageListModule, + MdcLinearProgressModule, + MdcListModule, + MdcMenuModule, + MdcRadioModule, + MdcRippleModule, + MdcSelectModule, + MdcSliderModule, + MdcSnackbarModule, + MdcSwitchModule, + MdcTabBarModule, + MdcTextFieldModule, + MdcTopAppBarModule, + MdcTypographyModule + ] +}) +export class MaterialModule {} diff --git a/examples/example-app/src/assets/.gitkeep b/examples/example-app/src/assets/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/examples/example-app/src/environments/environment.prod.ts b/examples/example-app/src/environments/environment.prod.ts new file mode 100644 index 000000000..3612073bc --- /dev/null +++ b/examples/example-app/src/environments/environment.prod.ts @@ -0,0 +1,3 @@ +export const environment = { + production: true +}; diff --git a/examples/example-app/src/environments/environment.ts b/examples/example-app/src/environments/environment.ts new file mode 100644 index 000000000..7b4f817ad --- /dev/null +++ b/examples/example-app/src/environments/environment.ts @@ -0,0 +1,16 @@ +// This file can be replaced during build by using the `fileReplacements` array. +// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. +// The list of file replacements can be found in `angular.json`. + +export const environment = { + production: false +}; + +/* + * For easier debugging in development mode, you can import the following file + * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. + * + * This import should be commented out in production mode because it will have a negative impact + * on performance if an error is thrown. + */ +// import 'zone.js/dist/zone-error'; // Included with Angular CLI. diff --git a/examples/example-app/src/favicon.ico b/examples/example-app/src/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..997406ad22c29aae95893fb3d666c30258a09537 GIT binary patch literal 948 zcmV;l155mgP)CBYU7IjCFmI-B}4sMJt3^s9NVg!P0 z6hDQy(L`XWMkB@zOLgN$4KYz;j0zZxq9KKdpZE#5@k0crP^5f9KO};h)ZDQ%ybhht z%t9#h|nu0K(bJ ztIkhEr!*UyrZWQ1k2+YkGqDi8Z<|mIN&$kzpKl{cNP=OQzXHz>vn+c)F)zO|Bou>E z2|-d_=qY#Y+yOu1a}XI?cU}%04)zz%anD(XZC{#~WreV!a$7k2Ug`?&CUEc0EtrkZ zL49MB)h!_K{H(*l_93D5tO0;BUnvYlo+;yss%n^&qjt6fZOa+}+FDO(~2>G z2dx@=JZ?DHP^;b7*Y1as5^uphBsh*s*z&MBd?e@I>-9kU>63PjP&^#5YTOb&x^6Cf z?674rmSHB5Fk!{Gv7rv!?qX#ei_L(XtwVqLX3L}$MI|kJ*w(rhx~tc&L&xP#?cQow zX_|gx$wMr3pRZIIr_;;O|8fAjd;1`nOeu5K(pCu7>^3E&D2OBBq?sYa(%S?GwG&_0-s%_v$L@R!5H_fc)lOb9ZoOO#p`Nn`KU z3LTTBtjwo`7(HA6 z7gmO$yTR!5L>Bsg!X8616{JUngg_@&85%>W=mChTR;x4`P=?PJ~oPuy5 zU-L`C@_!34D21{fD~Y8NVnR3t;aqZI3fIhmgmx}$oc-dKDC6Ap$Gy>a!`A*x2L1v0 WcZ@i?LyX}70000 + + + + ExampleApp + + + + + + + + diff --git a/examples/example-app/src/main.ts b/examples/example-app/src/main.ts new file mode 100644 index 000000000..c7b673cf4 --- /dev/null +++ b/examples/example-app/src/main.ts @@ -0,0 +1,12 @@ +import { enableProdMode } from '@angular/core'; +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; + +import { AppModule } from './app/app.module'; +import { environment } from './environments/environment'; + +if (environment.production) { + enableProdMode(); +} + +platformBrowserDynamic().bootstrapModule(AppModule) + .catch(err => console.error(err)); diff --git a/examples/example-app/src/polyfills.ts b/examples/example-app/src/polyfills.ts new file mode 100644 index 000000000..03711e5d9 --- /dev/null +++ b/examples/example-app/src/polyfills.ts @@ -0,0 +1,63 @@ +/** + * This file includes polyfills needed by Angular and is loaded before the app. + * You can add your own extra polyfills to this file. + * + * This file is divided into 2 sections: + * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. + * 2. Application imports. Files imported after ZoneJS that should be loaded before your main + * file. + * + * The current setup is for so-called "evergreen" browsers; the last versions of browsers that + * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), + * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. + * + * Learn more in https://angular.io/guide/browser-support + */ + +/*************************************************************************************************** + * BROWSER POLYFILLS + */ + +/** IE10 and IE11 requires the following for NgClass support on SVG elements */ +// import 'classlist.js'; // Run `npm install --save classlist.js`. + +/** + * Web Animations `@angular/platform-browser/animations` + * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. + * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). + */ +// import 'web-animations-js'; // Run `npm install --save web-animations-js`. + +/** + * By default, zone.js will patch all possible macroTask and DomEvents + * user can disable parts of macroTask/DomEvents patch by setting following flags + * because those flags need to be set before `zone.js` being loaded, and webpack + * will put import in the top of bundle, so user need to create a separate file + * in this directory (for example: zone-flags.ts), and put the following flags + * into that file, and then add the following code before importing zone.js. + * import './zone-flags'; + * + * The flags allowed in zone-flags.ts are listed here. + * + * The following flags will work for all browsers. + * + * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame + * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick + * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames + * + * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js + * with the following flag, it will bypass `zone.js` patch for IE/Edge + * + * (window as any).__Zone_enable_cross_context_check = true; + * + */ + +/*************************************************************************************************** + * Zone JS is required by default for Angular itself. + */ +import 'zone.js/dist/zone'; // Included with Angular CLI. + + +/*************************************************************************************************** + * APPLICATION IMPORTS + */ diff --git a/examples/example-app/src/styles.scss b/examples/example-app/src/styles.scss new file mode 100644 index 000000000..9ae36e4ee --- /dev/null +++ b/examples/example-app/src/styles.scss @@ -0,0 +1,13 @@ +@use './styles/body'; + +@use '@material/theme' with ( + $primary: #6200ee, + $secondary: #faab1a, + $background: #fff, +); + +// Material Components Web +@use './styles/mdc'; + +// Angular MDC +@use '@angular-mdc/theme/material'; diff --git a/examples/example-app/src/styles/_body.scss b/examples/example-app/src/styles/_body.scss new file mode 100644 index 000000000..9c377ed48 --- /dev/null +++ b/examples/example-app/src/styles/_body.scss @@ -0,0 +1,13 @@ +body { + margin: 0; +} + +// Remove clear button for IE inputs +::-ms-clear { + display: none; +} + +// Remove pseudo-element for password field from IE +::-ms-reveal { + display: none; +} diff --git a/examples/example-app/src/styles/_mdc.scss b/examples/example-app/src/styles/_mdc.scss new file mode 100644 index 000000000..532f9e730 --- /dev/null +++ b/examples/example-app/src/styles/_mdc.scss @@ -0,0 +1,34 @@ +// Material Components Web + +@use '@material/typography/mdc-typography'; +@use '@material/button/mdc-button'; +@use '@material/drawer/mdc-drawer'; +@use '@material/list/mdc-list'; +@use '@material/elevation/mdc-elevation'; +@use '@material/icon-button/mdc-icon-button'; +@use '@material/top-app-bar/mdc-top-app-bar'; +@use '@material/tab/mdc-tab'; +@use '@material/tab-bar/mdc-tab-bar'; +@use '@material/tab-indicator/mdc-tab-indicator'; +@use '@material/tab-scroller/mdc-tab-scroller'; +@use '@material/card/mdc-card'; +@use '@material/chips/mdc-chips'; +@use '@material/checkbox/mdc-checkbox'; +@use '@material/data-table/mdc-data-table'; +@use '@material/fab/mdc-fab'; +@use '@material/dialog/mdc-dialog'; +@use '@material/floating-label/mdc-floating-label'; +@use '@material/form-field/mdc-form-field'; +@use '@material/image-list/mdc-image-list'; +@use '@material/line-ripple/mdc-line-ripple'; +@use '@material/linear-progress/mdc-linear-progress'; +@use '@material/menu/mdc-menu'; +@use '@material/menu-surface/mdc-menu-surface'; +@use '@material/notched-outline/mdc-notched-outline'; +@use '@material/radio/mdc-radio'; +@use '@material/ripple/mdc-ripple'; +@use '@material/select/mdc-select'; +@use '@material/slider/mdc-slider'; +@use '@material/snackbar/mdc-snackbar'; +@use '@material/switch/mdc-switch'; +@use '@material/textfield/mdc-text-field'; diff --git a/examples/example-app/src/test.ts b/examples/example-app/src/test.ts new file mode 100644 index 000000000..50193eb0f --- /dev/null +++ b/examples/example-app/src/test.ts @@ -0,0 +1,25 @@ +// This file is required by karma.conf.js and loads recursively all the .spec and framework files + +import 'zone.js/dist/zone-testing'; +import { getTestBed } from '@angular/core/testing'; +import { + BrowserDynamicTestingModule, + platformBrowserDynamicTesting +} from '@angular/platform-browser-dynamic/testing'; + +declare const require: { + context(path: string, deep?: boolean, filter?: RegExp): { + keys(): string[]; + (id: string): T; + }; +}; + +// First, initialize the Angular testing environment. +getTestBed().initTestEnvironment( + BrowserDynamicTestingModule, + platformBrowserDynamicTesting() +); +// Then we find all the tests. +const context = require.context('./', true, /\.spec\.ts$/); +// And load the modules. +context.keys().map(context); diff --git a/examples/example-app/tsconfig.app.json b/examples/example-app/tsconfig.app.json new file mode 100644 index 000000000..f758d9820 --- /dev/null +++ b/examples/example-app/tsconfig.app.json @@ -0,0 +1,14 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "./out-tsc/app", + "types": [] + }, + "files": [ + "src/main.ts", + "src/polyfills.ts" + ], + "include": [ + "src/**/*.d.ts" + ] +} diff --git a/examples/example-app/tsconfig.json b/examples/example-app/tsconfig.json new file mode 100644 index 000000000..30956ae7e --- /dev/null +++ b/examples/example-app/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compileOnSave": false, + "compilerOptions": { + "baseUrl": "./", + "outDir": "./dist/out-tsc", + "sourceMap": true, + "declaration": false, + "downlevelIteration": true, + "experimentalDecorators": true, + "module": "esnext", + "moduleResolution": "node", + "importHelpers": true, + "target": "es2015", + "typeRoots": [ + "node_modules/@types" + ], + "lib": [ + "es2018", + "dom" + ] + }, + "angularCompilerOptions": { + "fullTemplateTypeCheck": true, + "strictInjectionParameters": true + } +} diff --git a/examples/example-app/tsconfig.spec.json b/examples/example-app/tsconfig.spec.json new file mode 100644 index 000000000..6400fde7d --- /dev/null +++ b/examples/example-app/tsconfig.spec.json @@ -0,0 +1,18 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "./out-tsc/spec", + "types": [ + "jasmine", + "node" + ] + }, + "files": [ + "src/test.ts", + "src/polyfills.ts" + ], + "include": [ + "src/**/*.spec.ts", + "src/**/*.d.ts" + ] +} diff --git a/examples/example-app/tslint.json b/examples/example-app/tslint.json new file mode 100644 index 000000000..c8d70f152 --- /dev/null +++ b/examples/example-app/tslint.json @@ -0,0 +1,91 @@ +{ + "extends": "tslint:recommended", + "rules": { + "array-type": false, + "arrow-parens": false, + "deprecation": { + "severity": "warning" + }, + "component-class-suffix": true, + "contextual-lifecycle": true, + "directive-class-suffix": true, + "directive-selector": [ + true, + "attribute", + "app", + "camelCase" + ], + "component-selector": [ + true, + "element", + "app", + "kebab-case" + ], + "import-blacklist": [ + true, + "rxjs/Rx" + ], + "interface-name": false, + "max-classes-per-file": false, + "max-line-length": [ + true, + 140 + ], + "member-access": false, + "member-ordering": [ + true, + { + "order": [ + "static-field", + "instance-field", + "static-method", + "instance-method" + ] + } + ], + "no-consecutive-blank-lines": false, + "no-console": [ + true, + "debug", + "info", + "time", + "timeEnd", + "trace" + ], + "no-empty": false, + "no-inferrable-types": [ + true, + "ignore-params" + ], + "no-non-null-assertion": true, + "no-redundant-jsdoc": true, + "no-switch-case-fall-through": true, + "no-var-requires": false, + "object-literal-key-quotes": [ + true, + "as-needed" + ], + "object-literal-sort-keys": false, + "ordered-imports": false, + "quotemark": [ + true, + "single" + ], + "trailing-comma": false, + "no-conflicting-lifecycle": true, + "no-host-metadata-property": true, + "no-input-rename": true, + "no-inputs-metadata-property": true, + "no-output-native": true, + "no-output-on-prefix": true, + "no-output-rename": true, + "no-outputs-metadata-property": true, + "template-banana-in-box": true, + "template-no-negated-async": true, + "use-lifecycle-interface": true, + "use-pipe-transform-interface": true + }, + "rulesDirectory": [ + "codelyzer" + ] +} \ No newline at end of file From 0de291db1d735f86dcea48e932c74cff90c17555 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Fri, 28 Feb 2020 06:57:08 -0500 Subject: [PATCH 2/9] WIP - starter app --- examples/example-app/src/index.html | 13 ------------ .../.editorconfig | 0 .../{example-app => starter-app}/.gitignore | 0 .../{example-app => starter-app}/README.md | 0 .../{example-app => starter-app}/angular.json | 16 +++++++------- .../{example-app => starter-app}/browserslist | 0 .../e2e/protractor.conf.js | 0 .../e2e/src/app.e2e-spec.ts | 2 +- .../e2e/src/app.po.ts | 0 .../e2e/tsconfig.json | 0 .../karma.conf.js | 2 +- .../{example-app => starter-app}/package.json | 2 +- .../src/app/app-routing.module.ts | 0 .../src/app/app.component.html | 0 .../src/app/app.component.scss | 0 .../src/app/app.component.spec.ts | 6 +++--- .../src/app/app.component.ts | 2 +- .../src/app/app.module.ts | 0 .../src/app/material.module.ts | 0 .../src/assets/.gitkeep | 0 .../src/environments/environment.prod.ts | 0 .../src/environments/environment.ts | 0 .../src/favicon.ico | Bin examples/starter-app/src/index.html | 20 ++++++++++++++++++ .../{example-app => starter-app}/src/main.ts | 0 .../src/polyfills.ts | 0 .../src/styles.scss | 2 +- .../src/styles/_global.scss} | 0 .../src/styles/_mdc.scss | 0 .../{example-app => starter-app}/src/test.ts | 0 .../tsconfig.app.json | 0 .../tsconfig.json | 0 .../tsconfig.spec.json | 0 .../{example-app => starter-app}/tslint.json | 0 34 files changed, 36 insertions(+), 29 deletions(-) delete mode 100644 examples/example-app/src/index.html rename examples/{example-app => starter-app}/.editorconfig (100%) rename examples/{example-app => starter-app}/.gitignore (100%) rename examples/{example-app => starter-app}/README.md (100%) rename examples/{example-app => starter-app}/angular.json (90%) rename examples/{example-app => starter-app}/browserslist (100%) rename examples/{example-app => starter-app}/e2e/protractor.conf.js (100%) rename examples/{example-app => starter-app}/e2e/src/app.e2e-spec.ts (90%) rename examples/{example-app => starter-app}/e2e/src/app.po.ts (100%) rename examples/{example-app => starter-app}/e2e/tsconfig.json (100%) rename examples/{example-app => starter-app}/karma.conf.js (93%) rename examples/{example-app => starter-app}/package.json (98%) rename examples/{example-app => starter-app}/src/app/app-routing.module.ts (100%) rename examples/{example-app => starter-app}/src/app/app.component.html (100%) rename examples/{example-app => starter-app}/src/app/app.component.scss (100%) rename examples/{example-app => starter-app}/src/app/app.component.spec.ts (87%) rename examples/{example-app => starter-app}/src/app/app.component.ts (88%) rename examples/{example-app => starter-app}/src/app/app.module.ts (100%) rename examples/{example-app => starter-app}/src/app/material.module.ts (100%) rename examples/{example-app => starter-app}/src/assets/.gitkeep (100%) rename examples/{example-app => starter-app}/src/environments/environment.prod.ts (100%) rename examples/{example-app => starter-app}/src/environments/environment.ts (100%) rename examples/{example-app => starter-app}/src/favicon.ico (100%) create mode 100644 examples/starter-app/src/index.html rename examples/{example-app => starter-app}/src/main.ts (100%) rename examples/{example-app => starter-app}/src/polyfills.ts (100%) rename examples/{example-app => starter-app}/src/styles.scss (89%) rename examples/{example-app/src/styles/_body.scss => starter-app/src/styles/_global.scss} (100%) rename examples/{example-app => starter-app}/src/styles/_mdc.scss (100%) rename examples/{example-app => starter-app}/src/test.ts (100%) rename examples/{example-app => starter-app}/tsconfig.app.json (100%) rename examples/{example-app => starter-app}/tsconfig.json (100%) rename examples/{example-app => starter-app}/tsconfig.spec.json (100%) rename examples/{example-app => starter-app}/tslint.json (100%) diff --git a/examples/example-app/src/index.html b/examples/example-app/src/index.html deleted file mode 100644 index ef07ffeea..000000000 --- a/examples/example-app/src/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - ExampleApp - - - - - - - - diff --git a/examples/example-app/.editorconfig b/examples/starter-app/.editorconfig similarity index 100% rename from examples/example-app/.editorconfig rename to examples/starter-app/.editorconfig diff --git a/examples/example-app/.gitignore b/examples/starter-app/.gitignore similarity index 100% rename from examples/example-app/.gitignore rename to examples/starter-app/.gitignore diff --git a/examples/example-app/README.md b/examples/starter-app/README.md similarity index 100% rename from examples/example-app/README.md rename to examples/starter-app/README.md diff --git a/examples/example-app/angular.json b/examples/starter-app/angular.json similarity index 90% rename from examples/example-app/angular.json rename to examples/starter-app/angular.json index 0ca8b47ec..5bd50ca8e 100644 --- a/examples/example-app/angular.json +++ b/examples/starter-app/angular.json @@ -3,7 +3,7 @@ "version": 1, "newProjectRoot": "projects", "projects": { - "example-app": { + "starter-app": { "projectType": "application", "schematics": { "@schematics/angular:component": { @@ -17,7 +17,7 @@ "build": { "builder": "@angular-devkit/build-angular:browser", "options": { - "outputPath": "dist/example-app", + "outputPath": "dist/starter-app", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", @@ -71,18 +71,18 @@ "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { - "browserTarget": "example-app:build" + "browserTarget": "starter-app:build" }, "configurations": { "production": { - "browserTarget": "example-app:build:production" + "browserTarget": "starter-app:build:production" } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { - "browserTarget": "example-app:build" + "browserTarget": "starter-app:build" } }, "test": { @@ -119,15 +119,15 @@ "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", - "devServerTarget": "example-app:serve" + "devServerTarget": "starter-app:serve" }, "configurations": { "production": { - "devServerTarget": "example-app:serve:production" + "devServerTarget": "starter-app:serve:production" } } } } }}, - "defaultProject": "example-app" + "defaultProject": "starter-app" } diff --git a/examples/example-app/browserslist b/examples/starter-app/browserslist similarity index 100% rename from examples/example-app/browserslist rename to examples/starter-app/browserslist diff --git a/examples/example-app/e2e/protractor.conf.js b/examples/starter-app/e2e/protractor.conf.js similarity index 100% rename from examples/example-app/e2e/protractor.conf.js rename to examples/starter-app/e2e/protractor.conf.js diff --git a/examples/example-app/e2e/src/app.e2e-spec.ts b/examples/starter-app/e2e/src/app.e2e-spec.ts similarity index 90% rename from examples/example-app/e2e/src/app.e2e-spec.ts rename to examples/starter-app/e2e/src/app.e2e-spec.ts index e19f1be59..4fec63801 100644 --- a/examples/example-app/e2e/src/app.e2e-spec.ts +++ b/examples/starter-app/e2e/src/app.e2e-spec.ts @@ -10,7 +10,7 @@ describe('workspace-project App', () => { it('should display welcome message', () => { page.navigateTo(); - expect(page.getTitleText()).toEqual('example-app app is running!'); + expect(page.getTitleText()).toEqual('starter-app app is running!'); }); afterEach(async () => { diff --git a/examples/example-app/e2e/src/app.po.ts b/examples/starter-app/e2e/src/app.po.ts similarity index 100% rename from examples/example-app/e2e/src/app.po.ts rename to examples/starter-app/e2e/src/app.po.ts diff --git a/examples/example-app/e2e/tsconfig.json b/examples/starter-app/e2e/tsconfig.json similarity index 100% rename from examples/example-app/e2e/tsconfig.json rename to examples/starter-app/e2e/tsconfig.json diff --git a/examples/example-app/karma.conf.js b/examples/starter-app/karma.conf.js similarity index 93% rename from examples/example-app/karma.conf.js rename to examples/starter-app/karma.conf.js index 864a5d62d..ce4ed5cca 100644 --- a/examples/example-app/karma.conf.js +++ b/examples/starter-app/karma.conf.js @@ -16,7 +16,7 @@ module.exports = function (config) { clearContext: false // leave Jasmine Spec Runner output visible in browser }, coverageIstanbulReporter: { - dir: require('path').join(__dirname, './coverage/example-app'), + dir: require('path').join(__dirname, './coverage/starter-app'), reports: ['html', 'lcovonly', 'text-summary'], fixWebpackSourcePaths: true }, diff --git a/examples/example-app/package.json b/examples/starter-app/package.json similarity index 98% rename from examples/example-app/package.json rename to examples/starter-app/package.json index 388040510..e0ec9cd24 100644 --- a/examples/example-app/package.json +++ b/examples/starter-app/package.json @@ -1,5 +1,5 @@ { - "name": "example-app", + "name": "starter-app", "version": "0.0.0", "scripts": { "ng": "ng", diff --git a/examples/example-app/src/app/app-routing.module.ts b/examples/starter-app/src/app/app-routing.module.ts similarity index 100% rename from examples/example-app/src/app/app-routing.module.ts rename to examples/starter-app/src/app/app-routing.module.ts diff --git a/examples/example-app/src/app/app.component.html b/examples/starter-app/src/app/app.component.html similarity index 100% rename from examples/example-app/src/app/app.component.html rename to examples/starter-app/src/app/app.component.html diff --git a/examples/example-app/src/app/app.component.scss b/examples/starter-app/src/app/app.component.scss similarity index 100% rename from examples/example-app/src/app/app.component.scss rename to examples/starter-app/src/app/app.component.scss diff --git a/examples/example-app/src/app/app.component.spec.ts b/examples/starter-app/src/app/app.component.spec.ts similarity index 87% rename from examples/example-app/src/app/app.component.spec.ts rename to examples/starter-app/src/app/app.component.spec.ts index 217749737..a386951bd 100644 --- a/examples/example-app/src/app/app.component.spec.ts +++ b/examples/starter-app/src/app/app.component.spec.ts @@ -20,16 +20,16 @@ describe('AppComponent', () => { expect(app).toBeTruthy(); }); - it(`should have as title 'example-app'`, () => { + it(`should have as title 'starter-app'`, () => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.componentInstance; - expect(app.title).toEqual('example-app'); + expect(app.title).toEqual('starter-app'); }); it('should render title', () => { const fixture = TestBed.createComponent(AppComponent); fixture.detectChanges(); const compiled = fixture.nativeElement; - expect(compiled.querySelector('.content span').textContent).toContain('example-app app is running!'); + expect(compiled.querySelector('.content span').textContent).toContain('starter-app app is running!'); }); }); diff --git a/examples/example-app/src/app/app.component.ts b/examples/starter-app/src/app/app.component.ts similarity index 88% rename from examples/example-app/src/app/app.component.ts rename to examples/starter-app/src/app/app.component.ts index 9c627af7a..5987237b0 100644 --- a/examples/example-app/src/app/app.component.ts +++ b/examples/starter-app/src/app/app.component.ts @@ -6,5 +6,5 @@ import { Component } from '@angular/core'; styleUrls: ['./app.component.scss'] }) export class AppComponent { - title = 'example-app'; + title = 'starter-app'; } diff --git a/examples/example-app/src/app/app.module.ts b/examples/starter-app/src/app/app.module.ts similarity index 100% rename from examples/example-app/src/app/app.module.ts rename to examples/starter-app/src/app/app.module.ts diff --git a/examples/example-app/src/app/material.module.ts b/examples/starter-app/src/app/material.module.ts similarity index 100% rename from examples/example-app/src/app/material.module.ts rename to examples/starter-app/src/app/material.module.ts diff --git a/examples/example-app/src/assets/.gitkeep b/examples/starter-app/src/assets/.gitkeep similarity index 100% rename from examples/example-app/src/assets/.gitkeep rename to examples/starter-app/src/assets/.gitkeep diff --git a/examples/example-app/src/environments/environment.prod.ts b/examples/starter-app/src/environments/environment.prod.ts similarity index 100% rename from examples/example-app/src/environments/environment.prod.ts rename to examples/starter-app/src/environments/environment.prod.ts diff --git a/examples/example-app/src/environments/environment.ts b/examples/starter-app/src/environments/environment.ts similarity index 100% rename from examples/example-app/src/environments/environment.ts rename to examples/starter-app/src/environments/environment.ts diff --git a/examples/example-app/src/favicon.ico b/examples/starter-app/src/favicon.ico similarity index 100% rename from examples/example-app/src/favicon.ico rename to examples/starter-app/src/favicon.ico diff --git a/examples/starter-app/src/index.html b/examples/starter-app/src/index.html new file mode 100644 index 000000000..f4c40b599 --- /dev/null +++ b/examples/starter-app/src/index.html @@ -0,0 +1,20 @@ + + + + + + Angular MDC + + + + + + + + + + + + \ No newline at end of file diff --git a/examples/example-app/src/main.ts b/examples/starter-app/src/main.ts similarity index 100% rename from examples/example-app/src/main.ts rename to examples/starter-app/src/main.ts diff --git a/examples/example-app/src/polyfills.ts b/examples/starter-app/src/polyfills.ts similarity index 100% rename from examples/example-app/src/polyfills.ts rename to examples/starter-app/src/polyfills.ts diff --git a/examples/example-app/src/styles.scss b/examples/starter-app/src/styles.scss similarity index 89% rename from examples/example-app/src/styles.scss rename to examples/starter-app/src/styles.scss index 9ae36e4ee..3f33c3614 100644 --- a/examples/example-app/src/styles.scss +++ b/examples/starter-app/src/styles.scss @@ -1,4 +1,4 @@ -@use './styles/body'; +@use './styles/global'; @use '@material/theme' with ( $primary: #6200ee, diff --git a/examples/example-app/src/styles/_body.scss b/examples/starter-app/src/styles/_global.scss similarity index 100% rename from examples/example-app/src/styles/_body.scss rename to examples/starter-app/src/styles/_global.scss diff --git a/examples/example-app/src/styles/_mdc.scss b/examples/starter-app/src/styles/_mdc.scss similarity index 100% rename from examples/example-app/src/styles/_mdc.scss rename to examples/starter-app/src/styles/_mdc.scss diff --git a/examples/example-app/src/test.ts b/examples/starter-app/src/test.ts similarity index 100% rename from examples/example-app/src/test.ts rename to examples/starter-app/src/test.ts diff --git a/examples/example-app/tsconfig.app.json b/examples/starter-app/tsconfig.app.json similarity index 100% rename from examples/example-app/tsconfig.app.json rename to examples/starter-app/tsconfig.app.json diff --git a/examples/example-app/tsconfig.json b/examples/starter-app/tsconfig.json similarity index 100% rename from examples/example-app/tsconfig.json rename to examples/starter-app/tsconfig.json diff --git a/examples/example-app/tsconfig.spec.json b/examples/starter-app/tsconfig.spec.json similarity index 100% rename from examples/example-app/tsconfig.spec.json rename to examples/starter-app/tsconfig.spec.json diff --git a/examples/example-app/tslint.json b/examples/starter-app/tslint.json similarity index 100% rename from examples/example-app/tslint.json rename to examples/starter-app/tslint.json From eca220456b180feb20f602beef88c67f53a2595e Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Fri, 28 Feb 2020 06:58:37 -0500 Subject: [PATCH 3/9] fix: ignore yarn.lock --- examples/starter-app/.gitignore | 1 + 1 file changed, 1 insertion(+) diff --git a/examples/starter-app/.gitignore b/examples/starter-app/.gitignore index 86d943a9b..a030cbbb6 100644 --- a/examples/starter-app/.gitignore +++ b/examples/starter-app/.gitignore @@ -44,3 +44,4 @@ testem.log # System Files .DS_Store Thumbs.db +yarn.lock From a39202cb2ec721667bc0f6caf84b949093cdb45b Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Fri, 28 Feb 2020 07:01:56 -0500 Subject: [PATCH 4/9] WIP - fix readme --- examples/starter-app/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/starter-app/README.md b/examples/starter-app/README.md index 198b93a12..8ac95fe0d 100644 --- a/examples/starter-app/README.md +++ b/examples/starter-app/README.md @@ -1,4 +1,4 @@ -# ExampleApp +# Angular MDC Starter App This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.4. From 7425c61a8dd73be1e573349ec0a98030f52f9052 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Fri, 28 Feb 2020 07:55:07 -0500 Subject: [PATCH 5/9] WIP - starter app --- examples/starter-app/src/app/app-routing.module.ts | 7 +++---- examples/starter-app/src/app/app.component.spec.ts | 6 +++--- examples/starter-app/src/index.html | 2 +- examples/starter-app/src/main.ts | 8 ++++---- examples/starter-app/src/test.ts | 2 +- 5 files changed, 12 insertions(+), 13 deletions(-) diff --git a/examples/starter-app/src/app/app-routing.module.ts b/examples/starter-app/src/app/app-routing.module.ts index 06c734263..9caad6bc1 100644 --- a/examples/starter-app/src/app/app-routing.module.ts +++ b/examples/starter-app/src/app/app-routing.module.ts @@ -1,6 +1,5 @@ -import { NgModule } from '@angular/core'; -import { Routes, RouterModule } from '@angular/router'; - +import {NgModule} from '@angular/core'; +import {Routes, RouterModule} from '@angular/router'; const routes: Routes = []; @@ -8,4 +7,4 @@ const routes: Routes = []; imports: [RouterModule.forRoot(routes)], exports: [RouterModule] }) -export class AppRoutingModule { } +export class AppRoutingModule {} diff --git a/examples/starter-app/src/app/app.component.spec.ts b/examples/starter-app/src/app/app.component.spec.ts index a386951bd..77607bbc1 100644 --- a/examples/starter-app/src/app/app.component.spec.ts +++ b/examples/starter-app/src/app/app.component.spec.ts @@ -1,6 +1,6 @@ -import { TestBed, async } from '@angular/core/testing'; -import { RouterTestingModule } from '@angular/router/testing'; -import { AppComponent } from './app.component'; +import {TestBed, async} from '@angular/core/testing'; +import {RouterTestingModule} from '@angular/router/testing'; +import {AppComponent} from './app.component'; describe('AppComponent', () => { beforeEach(async(() => { diff --git a/examples/starter-app/src/index.html b/examples/starter-app/src/index.html index f4c40b599..c931d8e49 100644 --- a/examples/starter-app/src/index.html +++ b/examples/starter-app/src/index.html @@ -3,7 +3,7 @@ - Angular MDC + Angular MDC - Starter App diff --git a/examples/starter-app/src/main.ts b/examples/starter-app/src/main.ts index c7b673cf4..484b5f3d3 100644 --- a/examples/starter-app/src/main.ts +++ b/examples/starter-app/src/main.ts @@ -1,8 +1,8 @@ -import { enableProdMode } from '@angular/core'; -import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import {enableProdMode} from '@angular/core'; +import {platformBrowserDynamic} from '@angular/platform-browser-dynamic'; -import { AppModule } from './app/app.module'; -import { environment } from './environments/environment'; +import {AppModule} from './app/app.module'; +import {environment} from './environments/environment'; if (environment.production) { enableProdMode(); diff --git a/examples/starter-app/src/test.ts b/examples/starter-app/src/test.ts index 50193eb0f..ce7ba5214 100644 --- a/examples/starter-app/src/test.ts +++ b/examples/starter-app/src/test.ts @@ -1,7 +1,7 @@ // This file is required by karma.conf.js and loads recursively all the .spec and framework files import 'zone.js/dist/zone-testing'; -import { getTestBed } from '@angular/core/testing'; +import {getTestBed} from '@angular/core/testing'; import { BrowserDynamicTestingModule, platformBrowserDynamicTesting From 48ef192044bf4b6ecdace731e3ebea7f5b768088 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Tue, 24 Mar 2020 05:04:18 -0400 Subject: [PATCH 6/9] feat: Starter app --- .gitignore | 1 + examples/starter-app/.gitignore | 1 - examples/starter-app/README.md | 4 +- examples/starter-app/angular.json | 16 +- examples/starter-app/browserslist | 2 +- examples/starter-app/e2e/src/app.e2e-spec.ts | 6 +- examples/starter-app/e2e/src/app.po.ts | 2 +- examples/starter-app/karma.conf.js | 2 +- examples/starter-app/package.json | 28 +- .../starter-app/src/app/app-routing.module.ts | 1 + .../starter-app/src/app/app.component.html | 585 ++---------------- .../starter-app/src/app/app.component.spec.ts | 12 +- examples/starter-app/src/app/app.component.ts | 25 +- examples/starter-app/src/app/app.module.ts | 3 +- .../starter-app/src/app/material.module.ts | 59 +- examples/starter-app/src/index.html | 7 +- examples/starter-app/src/styles.scss | 3 + .../src/styles/_drawer-content.scss | 4 + .../starter-app/src/styles/_top-app-bar.scss | 29 + examples/starter-app/tsconfig.json | 3 - 20 files changed, 187 insertions(+), 606 deletions(-) create mode 100644 examples/starter-app/src/styles/_drawer-content.scss create mode 100644 examples/starter-app/src/styles/_top-app-bar.scss diff --git a/.gitignore b/.gitignore index eca631005..ef64e3313 100644 --- a/.gitignore +++ b/.gitignore @@ -38,3 +38,4 @@ testem.log /.git /.firebase /.bazelrc.user +/examples/**/*.lock diff --git a/examples/starter-app/.gitignore b/examples/starter-app/.gitignore index a030cbbb6..86d943a9b 100644 --- a/examples/starter-app/.gitignore +++ b/examples/starter-app/.gitignore @@ -44,4 +44,3 @@ testem.log # System Files .DS_Store Thumbs.db -yarn.lock diff --git a/examples/starter-app/README.md b/examples/starter-app/README.md index 8ac95fe0d..1734668aa 100644 --- a/examples/starter-app/README.md +++ b/examples/starter-app/README.md @@ -1,6 +1,6 @@ -# Angular MDC Starter App +# AngularMdcStarter -This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.4. +This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.0.7. ## Development server diff --git a/examples/starter-app/angular.json b/examples/starter-app/angular.json index 5bd50ca8e..5a4a545d0 100644 --- a/examples/starter-app/angular.json +++ b/examples/starter-app/angular.json @@ -3,7 +3,7 @@ "version": 1, "newProjectRoot": "projects", "projects": { - "starter-app": { + "angular-mdc-starter": { "projectType": "application", "schematics": { "@schematics/angular:component": { @@ -17,7 +17,7 @@ "build": { "builder": "@angular-devkit/build-angular:browser", "options": { - "outputPath": "dist/starter-app", + "outputPath": "dist/angular-mdc-starter", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", @@ -71,18 +71,18 @@ "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { - "browserTarget": "starter-app:build" + "browserTarget": "angular-mdc-starter:build" }, "configurations": { "production": { - "browserTarget": "starter-app:build:production" + "browserTarget": "angular-mdc-starter:build:production" } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { - "browserTarget": "starter-app:build" + "browserTarget": "angular-mdc-starter:build" } }, "test": { @@ -119,15 +119,15 @@ "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", - "devServerTarget": "starter-app:serve" + "devServerTarget": "angular-mdc-starter:serve" }, "configurations": { "production": { - "devServerTarget": "starter-app:serve:production" + "devServerTarget": "angular-mdc-starter:serve:production" } } } } }}, - "defaultProject": "starter-app" + "defaultProject": "angular-mdc-starter" } diff --git a/examples/starter-app/browserslist b/examples/starter-app/browserslist index 80848532e..533473d52 100644 --- a/examples/starter-app/browserslist +++ b/examples/starter-app/browserslist @@ -9,4 +9,4 @@ last 2 versions Firefox ESR not dead -not IE 9-11 # For IE 9-11 support, remove 'not'. \ No newline at end of file +IE 9-11 \ No newline at end of file diff --git a/examples/starter-app/e2e/src/app.e2e-spec.ts b/examples/starter-app/e2e/src/app.e2e-spec.ts index 4fec63801..b6ce8fc1b 100644 --- a/examples/starter-app/e2e/src/app.e2e-spec.ts +++ b/examples/starter-app/e2e/src/app.e2e-spec.ts @@ -1,5 +1,5 @@ -import { AppPage } from './app.po'; -import { browser, logging } from 'protractor'; +import {AppPage} from './app.po'; +import {browser, logging} from 'protractor'; describe('workspace-project App', () => { let page: AppPage; @@ -10,7 +10,7 @@ describe('workspace-project App', () => { it('should display welcome message', () => { page.navigateTo(); - expect(page.getTitleText()).toEqual('starter-app app is running!'); + expect(page.getTitleText()).toEqual('angular-mdc-starter app is running!'); }); afterEach(async () => { diff --git a/examples/starter-app/e2e/src/app.po.ts b/examples/starter-app/e2e/src/app.po.ts index b68475e0f..8a9811cc7 100644 --- a/examples/starter-app/e2e/src/app.po.ts +++ b/examples/starter-app/e2e/src/app.po.ts @@ -1,4 +1,4 @@ -import { browser, by, element } from 'protractor'; +import {browser, by, element} from 'protractor'; export class AppPage { navigateTo(): Promise { diff --git a/examples/starter-app/karma.conf.js b/examples/starter-app/karma.conf.js index ce4ed5cca..09731f183 100644 --- a/examples/starter-app/karma.conf.js +++ b/examples/starter-app/karma.conf.js @@ -16,7 +16,7 @@ module.exports = function (config) { clearContext: false // leave Jasmine Spec Runner output visible in browser }, coverageIstanbulReporter: { - dir: require('path').join(__dirname, './coverage/starter-app'), + dir: require('path').join(__dirname, './coverage/angular-mdc-starter'), reports: ['html', 'lcovonly', 'text-summary'], fixWebpackSourcePaths: true }, diff --git a/examples/starter-app/package.json b/examples/starter-app/package.json index e0ec9cd24..dc4d003a3 100644 --- a/examples/starter-app/package.json +++ b/examples/starter-app/package.json @@ -1,5 +1,5 @@ { - "name": "starter-app", + "name": "angular-mdc-starter", "version": "0.0.0", "scripts": { "ng": "ng", @@ -11,24 +11,24 @@ }, "private": true, "dependencies": { - "@angular-mdc/web": "^5.1.0", - "@angular/animations": "~9.0.3", - "@angular/common": "~9.0.3", - "@angular/compiler": "~9.0.3", - "@angular/core": "~9.0.3", - "@angular/forms": "~9.0.3", - "@angular/platform-browser": "~9.0.3", - "@angular/platform-browser-dynamic": "~9.0.3", - "@angular/router": "~9.0.3", + "@angular-mdc/web": "canary", + "@angular/animations": "~9.0.7", + "@angular/common": "~9.0.7", + "@angular/compiler": "~9.0.7", + "@angular/core": "~9.0.7", + "@angular/forms": "~9.0.7", + "@angular/platform-browser": "~9.0.7", + "@angular/platform-browser-dynamic": "~9.0.7", + "@angular/router": "~9.0.7", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { - "@angular-devkit/build-angular": "~0.900.4", - "@angular/cli": "~9.0.4", - "@angular/compiler-cli": "~9.0.3", - "@angular/language-service": "~9.0.3", + "@angular-devkit/build-angular": "~0.900.7", + "@angular/cli": "~9.0.7", + "@angular/compiler-cli": "~9.0.7", + "@angular/language-service": "~9.0.7", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", diff --git a/examples/starter-app/src/app/app-routing.module.ts b/examples/starter-app/src/app/app-routing.module.ts index 9caad6bc1..4ffde391b 100644 --- a/examples/starter-app/src/app/app-routing.module.ts +++ b/examples/starter-app/src/app/app-routing.module.ts @@ -1,6 +1,7 @@ import {NgModule} from '@angular/core'; import {Routes, RouterModule} from '@angular/router'; + const routes: Routes = []; @NgModule({ diff --git a/examples/starter-app/src/app/app.component.html b/examples/starter-app/src/app/app.component.html index 0c510c671..38fbcec87 100644 --- a/examples/starter-app/src/app/app.component.html +++ b/examples/starter-app/src/app/app.component.html @@ -1,534 +1,55 @@ - - - - - - - - - - - - - - -
- - -
- - - - - - - - - - - - {{ title }} app is running! - - - - - -
- - -

Resources

-

Here are some links to help you get started:

- -
- - - - Learn Angular - - - - - - - CLI Documentation - - - - - - - - Angular Blog - - - - + + + + + + + search + notifications_none + more_vert +
+ + + My Profile + + Sign out + + +
+ + + + + + + + + + + + + +
+ + + + + + + {{link.icon}}{{link.label}} + + + + +
+ Lorem ipsum dolor sit amet, ad erat postea ullamcorper nec, veri veniam + quo et. Diam phaedrum ei mea, quaeque + voluptaria efficiantur duo no. Eu adhuc veritus civibus nec, sumo + invidunt mel id, in vim dictas detraxit. Per an + legere iriure blandit. Veri iisque accusamus an pri.
- - -

Next Steps

-

What do you want to do next with your app?

- - - -
-
- - - New Component -
- -
- - - Angular Material -
- -
- - - Add PWA Support -
- -
- - - Add Dependency -
- -
- - - Run and Watch Tests -
- -
- - - Build for Production -
-
- - -
- 
ng generate component xyz
- 
ng add @angular/material
- 
ng add @angular/pwa
- 
ng add _____
- 
ng test
- 
ng build --prod
-
- - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - -
- - - - - - - - - - - - \ No newline at end of file diff --git a/examples/starter-app/src/app/app.component.spec.ts b/examples/starter-app/src/app/app.component.spec.ts index 77607bbc1..693c71dc9 100644 --- a/examples/starter-app/src/app/app.component.spec.ts +++ b/examples/starter-app/src/app/app.component.spec.ts @@ -1,6 +1,6 @@ -import {TestBed, async} from '@angular/core/testing'; -import {RouterTestingModule} from '@angular/router/testing'; -import {AppComponent} from './app.component'; +import { TestBed, async } from '@angular/core/testing'; +import { RouterTestingModule } from '@angular/router/testing'; +import { AppComponent } from './app.component'; describe('AppComponent', () => { beforeEach(async(() => { @@ -20,16 +20,16 @@ describe('AppComponent', () => { expect(app).toBeTruthy(); }); - it(`should have as title 'starter-app'`, () => { + it(`should have as title 'angular-mdc-starter'`, () => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.componentInstance; - expect(app.title).toEqual('starter-app'); + expect(app.title).toEqual('angular-mdc-starter'); }); it('should render title', () => { const fixture = TestBed.createComponent(AppComponent); fixture.detectChanges(); const compiled = fixture.nativeElement; - expect(compiled.querySelector('.content span').textContent).toContain('starter-app app is running!'); + expect(compiled.querySelector('.content span').textContent).toContain('angular-mdc-starter app is running!'); }); }); diff --git a/examples/starter-app/src/app/app.component.ts b/examples/starter-app/src/app/app.component.ts index 5987237b0..d87bd74b3 100644 --- a/examples/starter-app/src/app/app.component.ts +++ b/examples/starter-app/src/app/app.component.ts @@ -1,4 +1,5 @@ -import { Component } from '@angular/core'; +import {Component} from '@angular/core'; +import {Router} from '@angular/router'; @Component({ selector: 'app-root', @@ -6,5 +7,25 @@ import { Component } from '@angular/core'; styleUrls: ['./app.component.scss'] }) export class AppComponent { - title = 'starter-app'; + destinations = [ + {label: 'Inbox', icon: 'inbox', activated: true}, + {label: 'Star', icon: 'star', activated: false}, + {label: 'Sent Mail', icon: 'send', activated: false}, + {label: 'Drafts', icon: 'drafts', activated: false} + ]; + + tabs = [ + {label: 'Flights', icon: 'airplanemode_active'}, + {label: 'Hotel', icon: 'hotel'}, + {label: 'Favorites', icon: 'favorite'} + ]; + + constructor( + private _router: Router) {} + + onDrawerSelect(route?: string) { + if (route) { + this._router.navigate([route]); + } + } } diff --git a/examples/starter-app/src/app/app.module.ts b/examples/starter-app/src/app/app.module.ts index 4c391a67a..b42e36a54 100644 --- a/examples/starter-app/src/app/app.module.ts +++ b/examples/starter-app/src/app/app.module.ts @@ -3,6 +3,7 @@ import {NgModule} from '@angular/core'; import {AppRoutingModule} from './app-routing.module'; import {AppComponent} from './app.component'; + import {MaterialModule} from './material.module'; @NgModule({ @@ -11,8 +12,8 @@ import {MaterialModule} from './material.module'; ], imports: [ BrowserModule, - AppRoutingModule, MaterialModule, + AppRoutingModule ], providers: [], bootstrap: [AppComponent] diff --git a/examples/starter-app/src/app/material.module.ts b/examples/starter-app/src/app/material.module.ts index daf9bbf7a..49bf1c349 100644 --- a/examples/starter-app/src/app/material.module.ts +++ b/examples/starter-app/src/app/material.module.ts @@ -1,5 +1,32 @@ import {NgModule} from '@angular/core'; -import { + +import {MdcTopAppBarModule} from '@angular-mdc/web/top-app-bar'; +import {MdcIconModule} from '@angular-mdc/web/icon'; +import {MdcDrawerModule} from '@angular-mdc/web/drawer'; +import {MdcListModule} from '@angular-mdc/web/list'; +import {MdcButtonModule} from '@angular-mdc/web/button'; +import {MdcTabBarModule} from '@angular-mdc/web/tab-bar'; +import {MdcSnackbarModule} from '@angular-mdc/web/snackbar'; +import {MdcDialogModule} from '@angular-mdc/web/dialog'; +import {MdcCardModule} from '@angular-mdc/web/card'; +import {MdcCheckboxModule} from '@angular-mdc/web/checkbox'; +import {MdcChipsModule} from '@angular-mdc/web/chips'; +import {MDCDataTableModule} from '@angular-mdc/web/data-table'; +import {MdcFabModule} from '@angular-mdc/web/fab'; +import {MdcElevationModule} from '@angular-mdc/web/elevation'; +import {MdcIconButtonModule} from '@angular-mdc/web/icon-button'; +import {MdcImageListModule} from '@angular-mdc/web/image-list'; +import {MdcLinearProgressModule} from '@angular-mdc/web/linear-progress'; +import {MdcMenuModule} from '@angular-mdc/web/menu'; +import {MdcRadioModule} from '@angular-mdc/web/radio'; +import {MdcRippleModule} from '@angular-mdc/web/ripple'; +import {MdcSelectModule} from '@angular-mdc/web/select'; +import {MdcSliderModule} from '@angular-mdc/web/slider'; +import {MdcSwitchModule} from '@angular-mdc/web/switch'; +import {MdcTextFieldModule} from '@angular-mdc/web/textfield'; +import {MdcTypographyModule} from '@angular-mdc/web/typography'; + +const MDC_MODULES = [ MdcButtonModule, MdcCardModule, MdcCheckboxModule, @@ -25,35 +52,9 @@ import { MdcTextFieldModule, MdcTopAppBarModule, MdcTypographyModule -} from '@angular-mdc/web'; +]; @NgModule({ - exports: [ - MdcButtonModule, - MdcCardModule, - MdcCheckboxModule, - MdcChipsModule, - MDCDataTableModule, - MdcDialogModule, - MdcDrawerModule, - MdcElevationModule, - MdcFabModule, - MdcIconButtonModule, - MdcIconModule, - MdcImageListModule, - MdcLinearProgressModule, - MdcListModule, - MdcMenuModule, - MdcRadioModule, - MdcRippleModule, - MdcSelectModule, - MdcSliderModule, - MdcSnackbarModule, - MdcSwitchModule, - MdcTabBarModule, - MdcTextFieldModule, - MdcTopAppBarModule, - MdcTypographyModule - ] + exports: [MDC_MODULES] }) export class MaterialModule {} diff --git a/examples/starter-app/src/index.html b/examples/starter-app/src/index.html index c931d8e49..2d63fb7e6 100644 --- a/examples/starter-app/src/index.html +++ b/examples/starter-app/src/index.html @@ -3,14 +3,17 @@ - Angular MDC - Starter App + AngularMdcStarter + + - + diff --git a/examples/starter-app/src/styles.scss b/examples/starter-app/src/styles.scss index 3f33c3614..8cda6d081 100644 --- a/examples/starter-app/src/styles.scss +++ b/examples/starter-app/src/styles.scss @@ -11,3 +11,6 @@ // Angular MDC @use '@angular-mdc/theme/material'; + +@use './styles/top-app-bar'; +@use './styles/drawer-content'; diff --git a/examples/starter-app/src/styles/_drawer-content.scss b/examples/starter-app/src/styles/_drawer-content.scss new file mode 100644 index 000000000..773d45301 --- /dev/null +++ b/examples/starter-app/src/styles/_drawer-content.scss @@ -0,0 +1,4 @@ +.drawer-app-content { + overflow: hidden; + position: relative; +} diff --git a/examples/starter-app/src/styles/_top-app-bar.scss b/examples/starter-app/src/styles/_top-app-bar.scss new file mode 100644 index 000000000..802b5eddb --- /dev/null +++ b/examples/starter-app/src/styles/_top-app-bar.scss @@ -0,0 +1,29 @@ +@use '@material/top-app-bar/_index' as top-app-bar; +@use '@material/tab/_index' as tab; +@use '@material/tab-indicator/_index' as tab-indicator; +@use '@material/ripple/_index' as ripple; +@use '@material/theme'; + +.top-app-bar-with-tabs { + .mdc-tab-bar { + margin-top: 1em; + + @media (max-width: 599px) { + margin-top: .5em; + } + + .mdc-tab { + @include tab.text-label-color(on-primary); + @include tab.icon-color(on-primary); + } + + .mdc-tab__ripple { + @include ripple.states(on-primary); + } + + .mdc-tab-indicator { + @include tab-indicator.underline-color(on-primary); + @include tab-indicator.underline-height(2px); + } + } +} diff --git a/examples/starter-app/tsconfig.json b/examples/starter-app/tsconfig.json index 30956ae7e..8c4ef3bba 100644 --- a/examples/starter-app/tsconfig.json +++ b/examples/starter-app/tsconfig.json @@ -11,9 +11,6 @@ "moduleResolution": "node", "importHelpers": true, "target": "es2015", - "typeRoots": [ - "node_modules/@types" - ], "lib": [ "es2018", "dom" From abd086811f6f53fc2b559ec3b3343f26de086498 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Thu, 26 Mar 2020 07:20:42 -0400 Subject: [PATCH 7/9] WIP - starter app --- examples/starter-app/package.json | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/examples/starter-app/package.json b/examples/starter-app/package.json index dc4d003a3..00fe608c7 100644 --- a/examples/starter-app/package.json +++ b/examples/starter-app/package.json @@ -12,23 +12,23 @@ "private": true, "dependencies": { "@angular-mdc/web": "canary", - "@angular/animations": "~9.0.7", - "@angular/common": "~9.0.7", - "@angular/compiler": "~9.0.7", - "@angular/core": "~9.0.7", - "@angular/forms": "~9.0.7", - "@angular/platform-browser": "~9.0.7", - "@angular/platform-browser-dynamic": "~9.0.7", - "@angular/router": "~9.0.7", + "@angular/animations": "~9.1.0", + "@angular/common": "~9.1.0", + "@angular/compiler": "~9.1.0", + "@angular/core": "~9.1.0", + "@angular/forms": "~9.1.0", + "@angular/platform-browser": "~9.1.0", + "@angular/platform-browser-dynamic": "~9.1.0", + "@angular/router": "~9.1.0", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { - "@angular-devkit/build-angular": "~0.900.7", - "@angular/cli": "~9.0.7", - "@angular/compiler-cli": "~9.0.7", - "@angular/language-service": "~9.0.7", + "@angular-devkit/build-angular": "~0.901.0", + "@angular/cli": "~9.1.0", + "@angular/compiler-cli": "~9.1.0", + "@angular/language-service": "~9.1.0", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "@types/node": "^12.11.1", @@ -43,6 +43,6 @@ "protractor": "~5.4.3", "ts-node": "~8.3.0", "tslint": "~5.18.0", - "typescript": "~3.7.5" + "typescript": "~3.8.3" } } From 057c4616fd6e7963e2e06fd493efe6eac62d5988 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Thu, 26 Mar 2020 07:25:07 -0400 Subject: [PATCH 8/9] WIP - starter app --- examples/starter-app/src/index.html | 2 -- examples/starter-app/src/styles.scss | 3 ++- .../src/styles/{_drawer-content.scss => _drawer.scss} | 0 3 files changed, 2 insertions(+), 3 deletions(-) rename examples/starter-app/src/styles/{_drawer-content.scss => _drawer.scss} (100%) diff --git a/examples/starter-app/src/index.html b/examples/starter-app/src/index.html index 2d63fb7e6..379419ae8 100644 --- a/examples/starter-app/src/index.html +++ b/examples/starter-app/src/index.html @@ -10,8 +10,6 @@ rel="stylesheet"> - diff --git a/examples/starter-app/src/styles.scss b/examples/starter-app/src/styles.scss index 8cda6d081..c89e90c89 100644 --- a/examples/starter-app/src/styles.scss +++ b/examples/starter-app/src/styles.scss @@ -12,5 +12,6 @@ // Angular MDC @use '@angular-mdc/theme/material'; +// App styles @use './styles/top-app-bar'; -@use './styles/drawer-content'; +@use './styles/drawer'; diff --git a/examples/starter-app/src/styles/_drawer-content.scss b/examples/starter-app/src/styles/_drawer.scss similarity index 100% rename from examples/starter-app/src/styles/_drawer-content.scss rename to examples/starter-app/src/styles/_drawer.scss From 83498a7a7a34f24c281306af4e5207cd21c4f734 Mon Sep 17 00:00:00 2001 From: Dominic Carretto Date: Wed, 15 Apr 2020 18:50:07 -0400 Subject: [PATCH 9/9] chore: Update angular version --- examples/starter-app/.editorconfig | 3 + examples/starter-app/package.json | 36 +++++----- .../starter-app/src/app/app-routing.module.ts | 1 - examples/starter-app/tslint.json | 71 +++++++++++++++++-- 4 files changed, 85 insertions(+), 26 deletions(-) diff --git a/examples/starter-app/.editorconfig b/examples/starter-app/.editorconfig index e89330a61..59d9a3a3e 100644 --- a/examples/starter-app/.editorconfig +++ b/examples/starter-app/.editorconfig @@ -8,6 +8,9 @@ indent_size = 2 insert_final_newline = true trim_trailing_whitespace = true +[*.ts] +quote_type = single + [*.md] max_line_length = off trim_trailing_whitespace = false diff --git a/examples/starter-app/package.json b/examples/starter-app/package.json index 00fe608c7..06f779654 100644 --- a/examples/starter-app/package.json +++ b/examples/starter-app/package.json @@ -12,37 +12,37 @@ "private": true, "dependencies": { "@angular-mdc/web": "canary", - "@angular/animations": "~9.1.0", - "@angular/common": "~9.1.0", - "@angular/compiler": "~9.1.0", - "@angular/core": "~9.1.0", - "@angular/forms": "~9.1.0", - "@angular/platform-browser": "~9.1.0", - "@angular/platform-browser-dynamic": "~9.1.0", - "@angular/router": "~9.1.0", + "@angular/animations": "~9.1.1", + "@angular/common": "~9.1.1", + "@angular/compiler": "~9.1.1", + "@angular/core": "~9.1.1", + "@angular/forms": "~9.1.1", + "@angular/platform-browser": "~9.1.1", + "@angular/platform-browser-dynamic": "~9.1.1", + "@angular/router": "~9.1.1", "rxjs": "~6.5.4", - "tslib": "^1.10.0", + "tslib": "^1.10.1", "zone.js": "~0.10.2" }, "devDependencies": { - "@angular-devkit/build-angular": "~0.901.0", - "@angular/cli": "~9.1.0", - "@angular/compiler-cli": "~9.1.0", - "@angular/language-service": "~9.1.0", + "@angular-devkit/build-angular": "~0.901.1", + "@angular/cli": "~9.1.1", + "@angular/compiler-cli": "~9.1.1", + "@angular/language-service": "~9.1.1", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", - "@types/node": "^12.11.1", + "@types/node": "^13.11.1", "codelyzer": "^5.1.2", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~4.2.1", - "karma": "~4.3.0", + "karma": "~4.4.1", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~2.1.0", - "karma-jasmine": "~2.0.1", + "karma-jasmine": "~3.0.1", "karma-jasmine-html-reporter": "^1.4.2", "protractor": "~5.4.3", - "ts-node": "~8.3.0", - "tslint": "~5.18.0", + "ts-node": "~8.8.2", + "tslint": "~6.1.0", "typescript": "~3.8.3" } } diff --git a/examples/starter-app/src/app/app-routing.module.ts b/examples/starter-app/src/app/app-routing.module.ts index 4ffde391b..9caad6bc1 100644 --- a/examples/starter-app/src/app/app-routing.module.ts +++ b/examples/starter-app/src/app/app-routing.module.ts @@ -1,7 +1,6 @@ import {NgModule} from '@angular/core'; import {Routes, RouterModule} from '@angular/router'; - const routes: Routes = []; @NgModule({ diff --git a/examples/starter-app/tslint.json b/examples/starter-app/tslint.json index c8d70f152..d92ff5d1b 100644 --- a/examples/starter-app/tslint.json +++ b/examples/starter-app/tslint.json @@ -1,8 +1,15 @@ { "extends": "tslint:recommended", "rules": { + "align": { + "options": [ + "parameters", + "statements" + ] + }, "array-type": false, - "arrow-parens": false, + "arrow-return-shorthand": true, + "curly": true, "deprecation": { "severity": "warning" }, @@ -21,17 +28,22 @@ "app", "kebab-case" ], + "eofline": true, "import-blacklist": [ true, "rxjs/Rx" ], - "interface-name": false, + "import-spacing": true, + "indent": { + "options": [ + "spaces" + ] + }, "max-classes-per-file": false, "max-line-length": [ true, 140 ], - "member-access": false, "member-ordering": [ true, { @@ -43,7 +55,6 @@ ] } ], - "no-consecutive-blank-lines": false, "no-console": [ true, "debug", @@ -65,13 +76,59 @@ true, "as-needed" ], - "object-literal-sort-keys": false, - "ordered-imports": false, "quotemark": [ true, "single" ], - "trailing-comma": false, + "semicolon": { + "options": [ + "always" + ] + }, + "space-before-function-paren": { + "options": { + "anonymous": "never", + "asyncArrow": "always", + "constructor": "never", + "method": "never", + "named": "never" + } + }, + "typedef-whitespace": { + "options": [ + { + "call-signature": "nospace", + "index-signature": "nospace", + "parameter": "nospace", + "property-declaration": "nospace", + "variable-declaration": "nospace" + }, + { + "call-signature": "onespace", + "index-signature": "onespace", + "parameter": "onespace", + "property-declaration": "onespace", + "variable-declaration": "onespace" + } + ] + }, + "variable-name": { + "options": [ + "ban-keywords", + "check-format", + "allow-pascal-case" + ] + }, + "whitespace": { + "options": [ + "check-branch", + "check-decl", + "check-operator", + "check-separator", + "check-type", + "check-typecast" + ] + }, "no-conflicting-lifecycle": true, "no-host-metadata-property": true, "no-input-rename": true,