From 8e6024c3ee6856c25bc2dba3a7ce293abea5a866 Mon Sep 17 00:00:00 2001
From: Sercan Yemen <sercanyemen@gmail.com>
Date: Wed, 8 Nov 2017 15:11:20 +0300
Subject: [PATCH] Fixes #44 : Removed angular material elements assets

---
 .../form-field-custom-control-example.css     |  21 ---
 .../form-field-custom-control-example.html    |   7 -
 .../form-field-custom-control-example.ts      | 177 ------------------
 .../form-field-error-example.css              |   8 -
 .../form-field-error-example.html             |   6 -
 .../form-field-error-example.ts               |  20 --
 .../form-field-hint-example.css               |   8 -
 .../form-field-hint-example.html              |  13 --
 .../form-field-hint-example.ts                |  11 --
 .../form-field-overview-example.css           |   8 -
 .../form-field-overview-example.html          |  15 --
 .../form-field-overview-example.ts            |  11 --
 .../form-field-placeholder-example.css        |  20 --
 .../form-field-placeholder-example.html       |  31 ---
 .../form-field-placeholder-example.ts         |  21 ---
 .../form-field-prefix-suffix-example.css      |  17 --
 .../form-field-prefix-suffix-example.html     |  12 --
 .../form-field-prefix-suffix-example.ts       |  12 --
 .../form-field-theming-example.css            |   8 -
 .../form-field-theming-example.html           |  14 --
 .../form-field-theming-example.ts             |  26 ---
 21 files changed, 466 deletions(-)
 delete mode 100644 src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-error/form-field-error-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-error/form-field-error-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-error/form-field-error-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts
 delete mode 100644 src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css
 delete mode 100644 src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html
 delete mode 100644 src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts

diff --git a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css
deleted file mode 100644
index 515dd7c1..00000000
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css
+++ /dev/null
@@ -1,21 +0,0 @@
-div {
-    display: flex;
-}
-
-input {
-    border: none;
-    background: none;
-    padding: 0;
-    outline: none;
-    font: inherit;
-    text-align: center;
-}
-
-span {
-    opacity: 0;
-    transition: opacity 200ms;
-}
-
-:host.floating span {
-    opacity: 1;
-}
diff --git a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html
deleted file mode 100644
index 74a64b9c..00000000
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<div [formGroup]="parts">
-    <input class="area" formControlName="area" size="3" [disabled]="disabled">
-    <span>&ndash;</span>
-    <input class="exchange" formControlName="exchange" size="3" [disabled]="disabled">
-    <span>&ndash;</span>
-    <input class="subscriber" formControlName="subscriber" size="4" [disabled]="disabled">
-</div>
diff --git a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts
deleted file mode 100644
index e9e62c24..00000000
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts
+++ /dev/null
@@ -1,177 +0,0 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { Component, ElementRef, Input, OnDestroy, Renderer2 } from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
-import { MatFormFieldControl } from '@angular/material/form-field';
-import { Subject } from 'rxjs/Subject';
-
-/** Data structure for holding telephone number. */
-export class MyTel
-{
-    constructor(public area: string, public exchange: string, public subscriber: string)
-    {
-    }
-}
-
-/** Custom `MatFormFieldControl` for telephone number input. */
-@Component({
-    selector   : 'my-tel-input',
-    templateUrl: 'form-field-custom-control-example.html',
-    styleUrls  : ['form-field-custom-control-example.css'],
-    providers  : [
-        {
-            provide    : MatFormFieldControl,
-            useExisting: MyTelInput
-        }
-    ],
-    host       : {
-        '[class.floating]'       : 'shouldPlaceholderFloat',
-        '[id]'                   : 'id',
-        '[attr.aria-describedby]': 'describedBy'
-    }
-})
-export class MyTelInput implements MatFormFieldControl<MyTel>, OnDestroy
-{
-    static nextId = 0;
-
-    parts: FormGroup;
-
-    stateChanges = new Subject<void>();
-
-    focused = false;
-
-    ngControl = null;
-
-    errorState = false;
-
-    controlType = 'my-tel-input';
-
-    get empty()
-    {
-        let n = this.parts.value;
-        return !n.area && !n.exchange && !n.subscriber;
-    }
-
-    get shouldPlaceholderFloat()
-    {
-        return this.focused || !this.empty;
-    }
-
-    id = `my-tel-input-${MyTelInput.nextId++}`;
-
-    describedBy = '';
-
-    @Input()
-    get placeholder()
-    {
-        return this._placeholder;
-    }
-
-    set placeholder(plh)
-    {
-        this._placeholder = plh;
-        this.stateChanges.next();
-    }
-
-    private _placeholder: string;
-
-    @Input()
-    get required()
-    {
-        return this._required;
-    }
-
-    set required(req)
-    {
-        this._required = coerceBooleanProperty(req);
-        this.stateChanges.next();
-    }
-
-    private _required = false;
-
-    @Input()
-    get disabled()
-    {
-        return this._disabled;
-    }
-
-    set disabled(dis)
-    {
-        this._disabled = coerceBooleanProperty(dis);
-        this.stateChanges.next();
-    }
-
-    private _disabled = false;
-
-    @Input()
-    get value(): MyTel | null
-    {
-        let n = this.parts.value;
-        if ( n.area.length == 3 && n.exchange.length == 3 && n.subscriber.length == 4 )
-        {
-            return new MyTel(n.area, n.exchange, n.subscriber);
-        }
-        return null;
-    }
-
-    set value(tel: MyTel | null)
-    {
-        tel = tel || new MyTel('', '', '');
-        this.parts.setValue({
-            area      : tel.area,
-            exchange  : tel.exchange,
-            subscriber: tel.subscriber
-        });
-        this.stateChanges.next();
-    }
-
-    constructor(fb: FormBuilder, private fm: FocusMonitor, private elRef: ElementRef,
-                renderer: Renderer2
-    )
-    {
-        this.parts = fb.group({
-            'area'      : '',
-            'exchange'  : '',
-            'subscriber': ''
-        });
-
-        fm.monitor(elRef.nativeElement, renderer, true).subscribe((origin) => {
-            this.focused = !!origin;
-            this.stateChanges.next();
-        });
-    }
-
-    ngOnDestroy()
-    {
-        this.stateChanges.complete();
-        this.fm.stopMonitoring(this.elRef.nativeElement);
-    }
-
-    setDescribedByIds(ids: string[])
-    {
-        this.describedBy = ids.join(' ');
-    }
-
-    onContainerClick(event: MouseEvent)
-    {
-        if ( (event.target as Element).tagName.toLowerCase() != 'input' )
-        {
-            this.elRef.nativeElement.querySelector('input').focus();
-        }
-    }
-}
-
-/** @title Form field with custom telephone number input control. */
-@Component({
-    selector: 'form-field-custom-control-example',
-    template: `
-    <mat-form-field>
-      <my-tel-input placeholder="Phone number" required></my-tel-input>
-      <mat-icon matSuffix>phone</mat-icon>
-      <mat-hint>Include area code</mat-hint>
-    </mat-form-field>
-  `
-})
-export class FormFieldCustomControlExample
-{
-}
diff --git a/src/assets/angular-material-examples/form-field-error/form-field-error-example.css b/src/assets/angular-material-examples/form-field-error/form-field-error-example.css
deleted file mode 100644
index 6efed507..00000000
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
diff --git a/src/assets/angular-material-examples/form-field-error/form-field-error-example.html b/src/assets/angular-material-examples/form-field-error/form-field-error-example.html
deleted file mode 100644
index 4a626d54..00000000
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.html
+++ /dev/null
@@ -1,6 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Enter your email" [formControl]="email" required>
-        <mat-error *ngIf="email.invalid">{{getErrorMessage()}}</mat-error>
-    </mat-form-field>
-</div>
diff --git a/src/assets/angular-material-examples/form-field-error/form-field-error-example.ts b/src/assets/angular-material-examples/form-field-error/form-field-error-example.ts
deleted file mode 100644
index ad13e53b..00000000
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Component } from '@angular/core';
-import { FormControl, Validators } from '@angular/forms';
-
-/** @title Form field with error messages */
-@Component({
-    selector   : 'form-field-error-example',
-    templateUrl: 'form-field-error-example.html',
-    styleUrls  : ['form-field-error-example.css']
-})
-export class FormFieldErrorExample
-{
-    email = new FormControl('', [Validators.required, Validators.email]);
-
-    getErrorMessage()
-    {
-        return this.email.hasError('required') ? 'You must enter a value' :
-            this.email.hasError('email') ? 'Not a valid email' :
-                '';
-    }
-}
diff --git a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css
deleted file mode 100644
index 6efed507..00000000
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
diff --git a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html
deleted file mode 100644
index fb09e073..00000000
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<div class="example-container">
-    <mat-form-field hintLabel="Max 10 characters">
-        <input matInput #input maxlength="10" placeholder="Enter some input">
-        <mat-hint align="end">{{input.value?.length || 0}}/10</mat-hint>
-    </mat-form-field>
-
-    <mat-form-field>
-        <mat-select placeholder="Select me">
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-        <mat-hint align="end">Here's the dropdown arrow ^</mat-hint>
-    </mat-form-field>
-</div>
diff --git a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts
deleted file mode 100644
index 556928ca..00000000
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Form field with hints */
-@Component({
-    selector   : 'form-field-hint-example',
-    templateUrl: 'form-field-hint-example.html',
-    styleUrls  : ['form-field-hint-example.css']
-})
-export class FormFieldHintExample
-{
-}
diff --git a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css
deleted file mode 100644
index 6efed507..00000000
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
diff --git a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html
deleted file mode 100644
index 8c19a60e..00000000
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html
+++ /dev/null
@@ -1,15 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Input">
-    </mat-form-field>
-
-    <mat-form-field>
-        <textarea matInput placeholder="Textarea"></textarea>
-    </mat-form-field>
-
-    <mat-form-field>
-        <mat-select placeholder="Select">
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-    </mat-form-field>
-</div>
diff --git a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts
deleted file mode 100644
index cd18e2ef..00000000
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Simple form field */
-@Component({
-    selector   : 'form-field-overview-example',
-    templateUrl: 'form-field-overview-example.html',
-    styleUrls  : ['form-field-overview-example.css']
-})
-export class FormFieldOverviewExample
-{
-}
diff --git a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css
deleted file mode 100644
index 4118084a..00000000
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css
+++ /dev/null
@@ -1,20 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
-
-.example-container form {
-    margin-bottom: 20px;
-}
-
-.example-container form > * {
-    margin: 5px 0;
-}
-
-.example-container .mat-radio-button {
-    margin: 0 5px;
-}
diff --git a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html
deleted file mode 100644
index 384e461c..00000000
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<div class="example-container">
-    <form class="example-container" [formGroup]="options">
-        <mat-checkbox formControlName="hideRequired">Hide required marker</mat-checkbox>
-        <div>
-            <label>Float placeholder: </label>
-            <mat-radio-group formControlName="floatPlaceholder">
-                <mat-radio-button value="auto">Auto</mat-radio-button>
-                <mat-radio-button value="always">Always</mat-radio-button>
-                <mat-radio-button value="never">Never</mat-radio-button>
-            </mat-radio-group>
-        </div>
-    </form>
-
-    <mat-form-field
-        [hideRequiredMarker]="options.value.hideRequired"
-        [floatPlaceholder]="options.value.floatPlaceholder">
-        <input matInput placeholder="Simple placeholder" required>
-    </mat-form-field>
-
-    <mat-form-field
-        [hideRequiredMarker]="options.value.hideRequired"
-        [floatPlaceholder]="options.value.floatPlaceholder">
-        <mat-select required>
-            <mat-option>-- None --</mat-option>
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-        <mat-placeholder>
-            <mat-icon>favorite</mat-icon>
-            <b> Fancy</b> <i> placeholder</i></mat-placeholder>
-    </mat-form-field>
-</div>
diff --git a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts
deleted file mode 100644
index 92fb35c5..00000000
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
-
-/** @title Form field with placeholder */
-@Component({
-    selector   : 'form-field-placeholder-example',
-    templateUrl: 'form-field-placeholder-example.html',
-    styleUrls  : ['form-field-placeholder-example.css']
-})
-export class FormFieldPlaceholderExample
-{
-    options: FormGroup;
-
-    constructor(fb: FormBuilder)
-    {
-        this.options = fb.group({
-            hideRequired    : false,
-            floatPlaceholder: 'auto'
-        });
-    }
-}
diff --git a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css
deleted file mode 100644
index 553ce85f..00000000
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css
+++ /dev/null
@@ -1,17 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
-
-.example-right-align {
-    text-align: right;
-}
-
-input.example-right-align::-webkit-outer-spin-button,
-input.example-right-align::-webkit-inner-spin-button {
-    display: none;
-}
diff --git a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html
deleted file mode 100644
index a761065b..00000000
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html
+++ /dev/null
@@ -1,12 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Enter your password" [type]="hide ? 'password' : 'text'">
-        <mat-icon matSuffix (click)="hide = !hide">{{hide ? 'visibility' : 'visibility_off'}}</mat-icon>
-    </mat-form-field>
-
-    <mat-form-field>
-        <input matInput placeholder="Amount" type="number" class="example-right-align">
-        <span matPrefix>$&nbsp;</span>
-        <span matSuffix>.00</span>
-    </mat-form-field>
-</div>
diff --git a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts
deleted file mode 100644
index 279ed320..00000000
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Form field with prefix & suffix */
-@Component({
-    selector   : 'form-field-prefix-suffix-example',
-    templateUrl: 'form-field-prefix-suffix-example.html',
-    styleUrls  : ['form-field-prefix-suffix-example.css']
-})
-export class FormFieldPrefixSuffixExample
-{
-    hide = true;
-}
diff --git a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css
deleted file mode 100644
index 6efed507..00000000
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
diff --git a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html
deleted file mode 100644
index 085adc53..00000000
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<form class="example-container" [formGroup]="options" [style.fontSize.px]="getFontSize()">
-    <mat-form-field [color]="options.value.color">
-        <mat-select placeholder="Color" formControlName="color">
-            <mat-option value="primary">Primary</mat-option>
-            <mat-option value="accent">Accent</mat-option>
-            <mat-option value="warn">Warn</mat-option>
-        </mat-select>
-    </mat-form-field>
-
-    <mat-form-field [color]="options.value.color">
-        <input matInput type="number" placeholder="Font size (px)" formControlName="fontSize" min="10">
-        <mat-error *ngIf="options.get('fontSize').invalid">Min size: 10px</mat-error>
-    </mat-form-field>
-</form>
diff --git a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts
deleted file mode 100644
index a417d1fa..00000000
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-
-/** @title Form field theming */
-@Component({
-    selector   : 'form-field-theming-example',
-    templateUrl: 'form-field-theming-example.html',
-    styleUrls  : ['form-field-theming-example.css']
-})
-export class FormFieldThemingExample
-{
-    options: FormGroup;
-
-    constructor(fb: FormBuilder)
-    {
-        this.options = fb.group({
-            'color'   : 'primary',
-            'fontSize': [16, Validators.min(10)]
-        });
-    }
-
-    getFontSize()
-    {
-        return Math.max(10, this.options.value.fontSize);
-    }
-}