feat(doc): now we support v4 demos #1595

apps/doc/project.json

@@ -49,20 +49,21 @@
  "apps/doc/src/styles.less",
  "node_modules/@taiga-ui/core/styles/taiga-ui-theme.less",
  "node_modules/@taiga-ui/core/styles/taiga-ui-fonts.less",
+
  "libs/components/src/styles/styles.less",
  "libs/theme/src/styles/styles.less",
  "libs/icons/flags/src/styles/styles.less",
  "libs/components/src/styles/icons/icons.less",
  "libs/components/src/styles/icons-16/icons-16.less",
- "node_modules/prismjs/themes/prism-okaidia.css",
- "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.css",
  "libs/icons/base/src/styles/styles.less",
-
  "libs/icons/base/src/styles/icons-base/prizm-base-icons.css",
  "libs/icons/base/src/styles/icons-base/prizm-base-icons-location.css",
 
  "libs/icons/base/src/styles/icons-full/prizm-full-icons.css",
- "libs/icons/base/src/styles/icons-full/prizm-full-icons-location.css"
+ "libs/icons/base/src/styles/icons-full/prizm-full-icons-location.css",
+
+ "node_modules/prismjs/themes/prism-okaidia.css",
+ "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.css"
  ],
  "scripts": [
  "node_modules/marked/bin/marked.js",

apps/doc/src/app/code-demo/files/angular.json.template

@@ -23,22 +23,20 @@
  "src/assets",
  {
  "glob": "**/*",
- "input": "@prizm-ui/icons/src/styles/icons",
- "output": "assets/prizm-icons/fonts"
+ "input": "@prizm-ui/icons/src/styles/icons-base",
+ "output": "assets/prizm/icons/base"
+ },
+ {
+ "glob": "**/*",
+ "input": "@prizm-ui/icons/src/styles/icons-full",
+ "output": "assets/prizm/icons/full"
  }
+
  ],
  "styles": [
  "src/styles.less"
  ],
- "scripts": [
- "node_modules/marked/bin/marked.js",
- "node_modules/prismjs/prism.js",
- "node_modules/prismjs/components/prism-less.min.js",
- "node_modules/prismjs/components/prism-markup.min.js",
- "node_modules/prismjs/components/prism-typescript.min.js",
- "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.js",
- "node_modules/clipboard/dist/clipboard.min.js"
- ]
+ "scripts": []
  },
  "configurations": {
  "production": {

apps/doc/src/app/code-demo/files/angular.json.template.ng14

@@ -0,0 +1,103 @@
+{
+ "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+ "version": 1,
+ "newProjectRoot": "projects",
+ "projects": {
+ "demo": {
+ "root": "",
+ "sourceRoot": "src",
+ "projectType": "application",
+ "prefix": "app",
+ "schematics": {},
+ "architect": {
+ "build": {
+ "builder": "@angular-devkit/build-angular:browser",
+ "options": {
+ "outputPath": "dist/demo",
+ "index": "src/index.html",
+ "main": "src/main.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.app.json",
+ "assets": [
+ "src/favicon.ico",
+ "src/assets",
+ {
+ "glob": "**/*",
+ "input": "@prizm-ui/icons/src/styles/icons",
+ "output": "assets/prizm-icons/fonts"
+ }
+ ],
+ "styles": [
+ "src/styles.less"
+ ],
+ "scripts": [
+ "node_modules/marked/bin/marked.js",
+ "node_modules/prismjs/prism.js",
+ "node_modules/prismjs/components/prism-less.min.js",
+ "node_modules/prismjs/components/prism-markup.min.js",
+ "node_modules/prismjs/components/prism-typescript.min.js",
+ "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.js",
+ "node_modules/clipboard/dist/clipboard.min.js"
+ ]
+ },
+ "configurations": {
+ "production": {
+ "fileReplacements": [
+ {
+ "replace": "src/environments/environment.ts",
+ "with": "src/environments/environment.prod.ts"
+ }
+ ],
+ "optimization": true,
+ "outputHashing": "all",
+ "sourceMap": false,
+ "extractCss": true,
+ "namedChunks": false,
+ "aot": true,
+ "extractLicenses": true,
+ "vendorChunk": false,
+ "buildOptimizer": true
+ }
+ }
+ },
+ "serve": {
+ "builder": "@angular-devkit/build-angular:dev-server",
+ "options": {
+ "browserTarget": "demo:build"
+ },
+ "configurations": {
+ "production": {
+ "browserTarget": "demo:build:production"
+ }
+ }
+ },
+ "extract-i18n": {
+ "builder": "@angular-devkit/build-angular:extract-i18n",
+ "options": {
+ "browserTarget": "demo:build"
+ }
+ },
+ "test": {
+ "builder": "@angular-devkit/build-angular:karma",
+ "options": {
+ "main": "src/test.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.spec.json",
+ "karmaConfig": "src/karma.conf.js",
+ "styles": ["styles.css"],
+ "scripts": [],
+ "assets": ["src/favicon.ico", "src/assets"]
+ }
+ },
+ "lint": {
+ "builder": "@angular-devkit/build-angular:tslint",
+ "options": {
+ "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
+ "exclude": ["**/node_modules/**"]
+ }
+ }
+ }
+ }
+ },
+ "defaultProject": "demo"
+}

apps/doc/src/app/code-demo/files/angular.json.template.ng15

@@ -0,0 +1,103 @@
+{
+ "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+ "version": 1,
+ "newProjectRoot": "projects",
+ "projects": {
+ "demo": {
+ "root": "",
+ "sourceRoot": "src",
+ "projectType": "application",
+ "prefix": "app",
+ "schematics": {},
+ "architect": {
+ "build": {
+ "builder": "@angular-devkit/build-angular:browser",
+ "options": {
+ "outputPath": "dist/demo",
+ "index": "src/index.html",
+ "main": "src/main.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.app.json",
+ "assets": [
+ "src/favicon.ico",
+ "src/assets",
+ {
+ "glob": "**/*",
+ "input": "@prizm-ui/icons/src/styles/icons",
+ "output": "assets/prizm-icons/fonts"
+ }
+ ],
+ "styles": [
+ "src/styles.less"
+ ],
+ "scripts": [
+ "node_modules/marked/bin/marked.js",
+ "node_modules/prismjs/prism.js",
+ "node_modules/prismjs/components/prism-less.min.js",
+ "node_modules/prismjs/components/prism-markup.min.js",
+ "node_modules/prismjs/components/prism-typescript.min.js",
+ "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.js",
+ "node_modules/clipboard/dist/clipboard.min.js"
+ ]
+ },
+ "configurations": {
+ "production": {
+ "fileReplacements": [
+ {
+ "replace": "src/environments/environment.ts",
+ "with": "src/environments/environment.prod.ts"
+ }
+ ],
+ "optimization": true,
+ "outputHashing": "all",
+ "sourceMap": false,
+ "extractCss": true,
+ "namedChunks": false,
+ "aot": true,
+ "extractLicenses": true,
+ "vendorChunk": false,
+ "buildOptimizer": true
+ }
+ }
+ },
+ "serve": {
+ "builder": "@angular-devkit/build-angular:dev-server",
+ "options": {
+ "browserTarget": "demo:build"
+ },
+ "configurations": {
+ "production": {
+ "browserTarget": "demo:build:production"
+ }
+ }
+ },
+ "extract-i18n": {
+ "builder": "@angular-devkit/build-angular:extract-i18n",
+ "options": {
+ "browserTarget": "demo:build"
+ }
+ },
+ "test": {
+ "builder": "@angular-devkit/build-angular:karma",
+ "options": {
+ "main": "src/test.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.spec.json",
+ "karmaConfig": "src/karma.conf.js",
+ "styles": ["styles.css"],
+ "scripts": [],
+ "assets": ["src/favicon.ico", "src/assets"]
+ }
+ },
+ "lint": {
+ "builder": "@angular-devkit/build-angular:tslint",
+ "options": {
+ "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
+ "exclude": ["**/node_modules/**"]
+ }
+ }
+ }
+ }
+ },
+ "defaultProject": "demo"
+}

apps/doc/src/app/code-demo/files/angular.json.template.ng16

@@ -0,0 +1,103 @@
+{
+ "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+ "version": 1,
+ "newProjectRoot": "projects",
+ "projects": {
+ "demo": {
+ "root": "",
+ "sourceRoot": "src",
+ "projectType": "application",
+ "prefix": "app",
+ "schematics": {},
+ "architect": {
+ "build": {
+ "builder": "@angular-devkit/build-angular:browser",
+ "options": {
+ "outputPath": "dist/demo",
+ "index": "src/index.html",
+ "main": "src/main.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.app.json",
+ "assets": [
+ "src/favicon.ico",
+ "src/assets",
+ {
+ "glob": "**/*",
+ "input": "@prizm-ui/icons/src/styles/icons",
+ "output": "assets/prizm-icons/fonts"
+ }
+ ],
+ "styles": [
+ "src/styles.less"
+ ],
+ "scripts": [
+ "node_modules/marked/bin/marked.js",
+ "node_modules/prismjs/prism.js",
+ "node_modules/prismjs/components/prism-less.min.js",
+ "node_modules/prismjs/components/prism-markup.min.js",
+ "node_modules/prismjs/components/prism-typescript.min.js",
+ "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.js",
+ "node_modules/clipboard/dist/clipboard.min.js"
+ ]
+ },
+ "configurations": {
+ "production": {
+ "fileReplacements": [
+ {
+ "replace": "src/environments/environment.ts",
+ "with": "src/environments/environment.prod.ts"
+ }
+ ],
+ "optimization": true,
+ "outputHashing": "all",
+ "sourceMap": false,
+ "extractCss": true,
+ "namedChunks": false,
+ "aot": true,
+ "extractLicenses": true,
+ "vendorChunk": false,
+ "buildOptimizer": true
+ }
+ }
+ },
+ "serve": {
+ "builder": "@angular-devkit/build-angular:dev-server",
+ "options": {
+ "browserTarget": "demo:build"
+ },
+ "configurations": {
+ "production": {
+ "browserTarget": "demo:build:production"
+ }
+ }
+ },
+ "extract-i18n": {
+ "builder": "@angular-devkit/build-angular:extract-i18n",
+ "options": {
+ "browserTarget": "demo:build"
+ }
+ },
+ "test": {
+ "builder": "@angular-devkit/build-angular:karma",
+ "options": {
+ "main": "src/test.ts",
+ "polyfills": "src/polyfills.ts",
+ "tsConfig": "src/tsconfig.spec.json",
+ "karmaConfig": "src/karma.conf.js",
+ "styles": ["styles.css"],
+ "scripts": [],
+ "assets": ["src/favicon.ico", "src/assets"]
+ }
+ },
+ "lint": {
+ "builder": "@angular-devkit/build-angular:tslint",
+ "options": {
+ "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
+ "exclude": ["**/node_modules/**"]
+ }
+ }
+ }
+ }
+ },
+ "defaultProject": "demo"
+}

apps/doc/src/app/code-demo/files/src/app/app.module.ts.template

@@ -1,13 +1,17 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { FormsModule } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
 import { AppComponent } from './app.component';
 import { AppRoutingModule } from './app-routing.module';
 import { SharedModuleModule } from './shared.module';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { HttpClientModule } from '@angular/common/http';
 
 @NgModule({
- imports: [BrowserModule, FormsModule, AppRoutingModule, SharedModuleModule],
+ imports: [BrowserModule,
+ HttpClientModule,
+ BrowserAnimationsModule, FormsModule, ReactiveFormsModule, AppRoutingModule, SharedModuleModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent],
 })