chore: init docs

angular.json

@@ -0,0 +1,87 @@
+{
+    "version": 1,
+    "newProjectRoot": "projects",
+    "projects": {
+        "mosaic-io": {
+            "root": "",
+            "projectType": "application",
+            "architect": {
+                "build": {
+                    "builder": "@angular-devkit/build-angular:browser",
+                    "options": {
+                        "aot": true,
+                        "sourceMap": false,
+                        "outputPath": "dist",
+                        "index": "packages/docs/index.html",
+                        "main": "packages/docs/main.ts",
+                        "tsConfig": "packages/docs/tsconfig.json",
+                        "assets": [
+                            {
+                                "glob": "**/*",
+                                "input": "packages/docs/assets",
+                                "output": "/assets"
+                            },
+                            {
+                                "glob": "**/*",
+                                "input": "./node_modules/@angular/material-examples/docs-content",
+                                "output": "/docs-content"
+                            },
+                            {
+                                "glob": "favicon.ico",
+                                "input": "src",
+                                "output": "/"
+                            }
+                        ],
+                        "styles": [
+                            {
+                                "input": "packages/docs/main.scss"
+                            }
+                        ],
+                        "scripts": []
+                    },
+                    "configurations": {
+                        "production": {
+                            "optimization": true,
+                            "outputHashing": "all",
+                            "sourceMap": false,
+                            "extractCss": true,
+                            "namedChunks": false,
+                            "aot": true,
+                            "extractLicenses": true,
+                            "vendorChunk": false,
+                            "buildOptimizer": true,
+                            "fileReplacements": [
+                                {
+                                    "src": "src/environments/environment.ts",
+                                    "replaceWith": "src/environments/environment.prod.ts"
+                                }
+                            ]
+                        }
+                    }
+                },
+                "serve": {
+                    "builder": "@angular-devkit/build-angular:dev-server",
+                    "options": {
+                        "browserTarget": "mosaic-io:build"
+                    },
+                    "configurations": {
+                        "production": {
+                            "browserTarget": "mosaic-io:build:production"
+                        }
+                    }
+                },
+                "lint": {
+                    "builder": "@angular-devkit/build-angular:tslint",
+                    "options": {
+                        "tsConfig": [
+                            "packages/docs/tsconfig.json"
+                        ],
+                        "exclude": [
+                            "**/node_modules/**"
+                        ]
+                    }
+                }
+            }
+        }
+    }
+}

package.json

@@ -33,8 +33,10 @@
         "zone.js": "~0.9.1"
     },
     "devDependencies": {
+        "@angular-devkit/build-angular": "^0.800.2",
         "@angular-devkit/core": "^8.0.1",
         "@angular-devkit/schematics": "^8.0.1",
+        "@angular/cli": "^8.0.2",
         "@angular/compiler-cli": "^8.0.0",
         "@angular/platform-browser-dynamic": "^8.0.0",
         "@angular/platform-server": "^8.0.0",
@@ -107,6 +109,7 @@
         "messageformat": "^2.0.5",
         "moment": "^2.24.0",
         "node-sass": "^4.11.0",
+        "parse5": "^5.0.0",
         "postcss-loader": "^3.0.0",
         "raw-loader": "^0.5.1",
         "resolve-bin": "^0.4.0",
@@ -137,21 +140,23 @@
         "webpack-dev-server": "^3.1.9"
     },
     "scripts": {
-        "serve:dev-app": "gulp serve:devapp",
         "ci:aot": "gulp ci:aot",
-        "build-dev-app:aot": "gulp build-aot",
-        "test:unit": "gulp ci:test",
-        "valid:lic": "gulp validate-licenses",
         "build:cdk": "gulp cdk:build-release",
         "build:mosaic-moment-adapter": "gulp mosaic-moment-adapter:build-release",
         "build:mosaic": "gulp mosaic:build-release",
         "build:docs": "gulp docs",
+        "build-dev-app:aot": "gulp build-aot",
         "changelog": "gulp changelog",
+        "ng": "ng",
+        "docs:start": "ng serve",
         "postinstall": "ngc -p angular.tsconfig.json",
         "preinstall": "node ./tools/npm/check-npm.js",
         "publish": "ts-node --project ./scripts/tsconfig.deploy.json ./scripts/deploy/publish-artifacts.ts",
         "linter:mosaic": "gulp tslint",
         "linter:styles": "gulp stylelint",
+        "test:unit": "gulp ci:test",
+        "valid:lic": "gulp validate-licenses",
+        "serve:dev-app": "gulp serve:devapp",
         "release:stage": "ts-node --project tools/release/ tools/release/stage-release.ts",
         "release:publish": "ts-node --project tools/release/ tools/release/publish-release.ts",
         "server-dev": "webpack-dev-server --config tools/webpack/webpack.config.js",

packages/cdk/schematics/utils/parse5-element.ts

@@ -1,32 +1,26 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
+import { SchematicsException } from '@angular-devkit/schematics';
+import { DefaultTreeElement } from 'parse5';
 
-import {DefaultTreeElement} from 'parse5';
 
 /** Determines the indentation of child elements for the given Parse5 element. */
 export function getChildElementIndentation(element: DefaultTreeElement) {
-  const childElement = element.childNodes
-    .find(node => node['tagName']) as DefaultTreeElement | null;
+    const childElement = element.childNodes
+        .find((node) => node.tagName) as DefaultTreeElement | null;
 
-  if ((childElement && !childElement.sourceCodeLocation) || !element.sourceCodeLocation) {
-    throw new Error('Cannot determine child element indentation because the specified Parse5 ' +
-        'element does not have any source code location metadata.');
-  }
+    if ((childElement && !childElement.sourceCodeLocation) || !element.sourceCodeLocation) {
+        throw new SchematicsException('Cannot determine child element indentation because the ' +
+            'specified Parse5 element does not have any source code location metadata.');
+    }
 
-  const startColumns = childElement ?
-    // In case there are child elements inside of the element, we assume that their
-    // indentation is also applicable for other child elements.
-    childElement.sourceCodeLocation!.startCol :
-    // In case there is no child element, we just assume that child elements should be indented
-    // by two spaces.
-    element.sourceCodeLocation!.startCol + 2;
+    const startColumns = childElement ?
+        // In case there are child elements inside of the element, we assume that their
+        // indentation is also applicable for other child elements.
+        childElement.sourceCodeLocation!.startCol :
+        // In case there is no child element, we just assume that child elements should be indented
+        // by two spaces.
+        element.sourceCodeLocation!.startCol + 2;
 
-  // Since Parse5 does not set the `startCol` properties as zero-based, we need to subtract
-  // one column in order to have a proper zero-based offset for the indentation.
-  return startColumns - 1;
+    // Since Parse5 does not set the `startCol` properties as zero-based, we need to subtract
+    // one column in order to have a proper zero-based offset for the indentation.
+    return startColumns - 1;
 }

packages/docs/_app-theme.scss

@@ -0,0 +1,20 @@
+@import '../mosaic/core/theming/theming';
+
+
+@mixin material-docs-app-theme($theme) {
+    $primary: map-get($theme, primary);
+    $accent: map-get($theme, accent);
+    $warn: map-get($theme, warn);
+    $background: map-get($theme, background);
+    $foreground: map-get($theme, foreground);
+    $next-theme: mc-palette($mat-red);
+
+    .docs-app-background {
+        background: mc-palette($background, background);
+    }
+
+    .docs-footer {
+        background: mc-palette($primary);
+        color: mc-palette($primary, default-contrast);
+    }
+}

packages/docs/app/components/main-layout/main-layout.component.html

@@ -0,0 +1,24 @@
+<mc-vertical-navbar expanded="true">
+
+    <a mc-vertical-navbar-header routerLink="/">
+        <img src="https://i.ibb.co/p0zh3sb/logo-png-48.png" alt="PT Mosaic" class="css-l8z9zc">
+        <mc-vertical-navbar-title>Mosaic</mc-vertical-navbar-title>
+    </a>
+
+    <mc-vertical-navbar-item class="mc-vertical-navbar__item_active">
+        <mc-vertical-navbar-title>Components</mc-vertical-navbar-title>
+    </mc-vertical-navbar-item>
+
+    <mc-vertical-navbar-item >
+        <mc-vertical-navbar-title>Icons</mc-vertical-navbar-title>
+    </mc-vertical-navbar-item>
+
+    <mc-vertical-navbar-item >
+        <mc-vertical-navbar-title>Guides</mc-vertical-navbar-title>
+    </mc-vertical-navbar-item>
+</mc-vertical-navbar>
+
+
+<div class="content">
+    <router-outlet></router-outlet>
+</div>

packages/docs/app/components/main-layout/main-layout.component.scss

@@ -0,0 +1,24 @@
+
+mc-vertical-navbar {
+    height: 100%;
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 1000;
+    box-shadow: 1px 0 2px 1px grey;
+
+    .mc-vertical-navbar__toggle-button {
+        visibility: hidden;
+        width: 24px !important;
+    }
+}
+
+[mc-vertical-navbar-item]:first-of-type {
+    margin-top: 64px;
+}
+
+.content {
+    margin-left: 64px;
+}
+
+

packages/docs/app/components/main-layout/main-layout.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+    templateUrl: './main-layout.component.html',
+    styleUrls: ['./main-layout.component.scss']
+})
+export class MainLayoutComponent {
+
+
+}

packages/docs/app/components/main-layout/main-layout.module.ts

@@ -0,0 +1,27 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { McButtonModule } from '@ptsecurity/mosaic/button';
+import { McDropdownModule } from '@ptsecurity/mosaic/dropdown';
+import { McIconModule } from '@ptsecurity/mosaic/icon';
+import { McVerticalNavbarModule } from '@ptsecurity/mosaic/vertical-navbar';
+
+import { MainLayoutComponent } from './main-layout.component';
+
+
+@NgModule({
+    imports: [
+        CommonModule,
+        RouterModule,
+
+        McVerticalNavbarModule,
+        McButtonModule,
+        McIconModule,
+        McDropdownModule
+
+    ],
+    exports: [MainLayoutComponent],
+    declarations: [MainLayoutComponent]
+})
+export class MainLayoutModule {}

packages/docs/app/components/navbar/index.ts

@@ -0,0 +1 @@
+export * from './navbar.module';

packages/docs/app/components/navbar/navbar.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+    selector: 'navbar',
+    templateUrl: './navbar.template.html',
+    styleUrls: ['./navbar.scss']
+})
+export class NavbarComponent {
+
+}

packages/docs/app/components/navbar/navbar.module.ts

@@ -0,0 +1,19 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { McIconModule } from '@ptsecurity/mosaic/icon';
+import { McNavbarModule } from '@ptsecurity/mosaic/navbar';
+
+import { NavbarComponent } from './navbar.component';
+
+
+@NgModule({
+    imports: [
+        CommonModule,
+
+        McNavbarModule,
+        McIconModule
+    ],
+    exports: [NavbarComponent],
+    declarations: [NavbarComponent]
+})
+export class NavbarModule {}

packages/docs/app/components/navbar/navbar.scss

@@ -0,0 +1,35 @@
+
+.app-navigation {
+    $self: &;
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 80px;
+    background-color: transparent;
+    transition: all .3s;
+    z-index: 100;
+
+    &__container {
+        margin: 0 auto;
+        width: 90%;
+        color: #1D1D1F;
+    }
+}
+
+.github-circle {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+
+    padding-top: 8px;
+    font-size: 14px;
+
+    color: black;
+    cursor: pointer;
+
+    &__logo {
+        margin: 0 4px 3px 0;
+    }
+}
+

packages/docs/app/components/navbar/navbar.template.html

@@ -0,0 +1,18 @@
+<header class="app-navigation">
+    <div class="app-navigation__container">
+        <div class="float-left">
+            <a href="#/en">
+                <svg class="logo" height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg"><g _ngcontent-hua-c5="" fill="none" fill-rule="evenodd"><path _ngcontent-hua-c5="" d="m0 32h32v-32h-32z" fill="#c00"></path><path _ngcontent-hua-c5="" d="m11.7013126 2.13713398h3.4056699v5.22500971c.0083884 1.2815534 1.0494758 2.31984466 2.3304078 2.32543689v-1.89825242c-.2370486-.00528156-.4296699-.19231068-.432466-.42718447v-5.22500971h3.4050485v-1.89794175h-8.7086602zm-3.29065629-1.89806602h-5.95976699-.0167767c-1.28062136.00590291-2.3192233 1.04978641-2.32481553 2.33351456h1.89794174c.00590292-.23735922.19262136-.42407767.42687379-.43557281h5.97654369c.24295146 0 .44054369.19821359.44054369.44427184v.97646602c0 .23735923-.19759223.43867961-.44054369.43867961l-5.97654369.00248544c-1.28062136.01118447-2.3192233 1.04667961-2.32481553 2.33071845v3.35782524h1.89794174v-3.35782524c.00590292-.23207767.19262136-.42438835.42687379-.42718447h5.97654369c1.28932039 0 2.34190289-1.05227184 2.34190289-2.34469903v-.97646602c0-1.29242718-1.0525825-2.34221359-2.34190289-2.34221359" fill="#fff" transform="translate(5.592 10.889)"></path></g></svg>
+            </a>
+        </div>
+        <div class="float-right">
+            <a href="https://github.com/positive-js/mosaic" aria-label="GitHub Repository">
+                <span class="github-circle">
+                    <svg class="github-circle__logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" focusable="false"
+                     width="2em" height="2em" style="-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="black" fill-rule="evenodd" d="M12 2C6.477 2 2 6.477 2 12c0 4.418 2.865 8.166 6.839 9.489.5.092.682-.217.682-.482 0-.237-.008-.866-.013-1.7-2.782.604-3.369-1.341-3.369-1.341-.454-1.155-1.11-1.463-1.11-1.463-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.831.092-.646.35-1.086.636-1.336-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.268 2.75 1.026A9.578 9.578 0 0 1 12 6.836a9.59 9.59 0 0 1 2.504.337c1.909-1.294 2.747-1.026 2.747-1.026.546 1.377.202 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.337-.012 2.415-.012 2.743 0 .267.18.578.688.48 3.97-1.324 6.833-5.07 6.833-9.486C22 6.477 17.522 2 12 2z"/></svg>
+                    GitHub
+                </span>
+            </a>
+        </div>
+    </div>
+</header>

packages/docs/app/containers/components/comp.component.ts

@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+    selector: 'docs-components',
+    templateUrl: './comp.template.html'
+})
+export class CompComponent {
+
+}