codecharta-visualization 1.114.0 → 1.115.0

package/app/material/_theme.scss

@@ -1,24 +1,24 @@
-@use "~@angular/material" as mat;
+@use "@angular/material" as mat;
 
-@import "~@angular/material/theming";
+@import "@angular/material/theming";
 
 @include mat.core();
 
 $cc-palette: (
-	50: #e0f2f1,
-	100: #b2dfdb,
-	200: #80cbc4,
-	300: #4db6ac,
-	400: #26a69a,
-	500: #009688,
-	600: #00897b,
-	700: #00796b,
-	800: #00695c,
-	900: #004d40,
-	A100: #a7ffeb,
-	A200: #64ffda,
-	A400: #1de9b6,
-	A700: #00bfa5,
+	50: #c3e5fe,
+	100: #9bd3fe,
+	200: #76c3fd,
+	300: #55b5fc,
+	400: #37a8fc,
+	500: #1b9cfc,
+	600: #038ff8,
+	700: #0381df,
+	800: #0374c9,
+	900: #0368b5,
+	A100: #a0d5ff,
+	A200: #a0d5ff,
+	A400: #7ac5ff,
+	A700: #58b6ff,
 	contrast: (
 		50: #000000,
 		100: #000000,
@@ -49,5 +49,16 @@ $cc-theme: mat.define-light-theme(
 );
 
 $cc-primary-color: mat-color($cc-primary);
-$cc-emphasized-color: rgb(0, 124, 112);
+$cc-emphasized-color: #0374c9;
 $cc-disabled-color: rgb(204, 204, 204);
+$cc-font-color: rgba(0, 0, 0, 0.87);
+
+// For the lack of a better way of doing this
+// please remove this
+// if a method is found how to change the checkmark colors directly in theme
+// or you wish to keep the default black
+:root {
+	.mat-mdc-checkbox.mat-accent {
+		--mdc-checkbox-selected-checkmark-color: #fff !important;
+	}
+}

package/app/material/matDialog.scss

@@ -1,3 +1,3 @@
-.mat-dialog-container {
+.mat-mdc-dialog-container {
 	min-width: 320px;
 }

package/app/material/matMenu.scss

@@ -1,4 +1,4 @@
-.mat-menu-content {
+.mat-mdc-menu-content {
 	// overwrite global app.scss style
 	button {
 		margin: unset;
@@ -10,7 +10,7 @@
 		line-height: 20px;
 	}
 
-	.mat-menu-item {
+	.mat-mdc-menu-item {
 		font-size: 16px;
 	}
 }

package/app/material/material.module.ts

@@ -1,5 +1,6 @@
+import { FormsModule } from "@angular/forms"
 import { NgModule } from "@angular/core"
-import { BrowserAnimationsModule } from "@angular/platform-browser/animations"
+import { NoopAnimationsModule } from "@angular/platform-browser/animations"
 import { MatSelectModule } from "@angular/material/select"
 import { MatMenuModule } from "@angular/material/menu"
 import { MatButtonModule } from "@angular/material/button"
@@ -37,11 +38,12 @@ const materialModules = [
 	MatExpansionModule,
 	MatSliderModule,
 	MatSlideToggleModule,
-	BrowserAnimationsModule
+	NoopAnimationsModule,
+	FormsModule
 ]
 
 @NgModule({
-	imports: [BrowserAnimationsModule, materialModules],
+	imports: [NoopAnimationsModule, materialModules],
 	exports: [materialModules]
 })
 export class MaterialModule {}

package/app/material/material.scss

@@ -1,4 +1,4 @@
-@use "~@angular/material" as mat;
+@use "@angular/material" as mat;
 @use "./theme";
 
 @include mat.core-theme(theme.$cc-theme);
@@ -19,10 +19,5 @@
 @include mat.slider-theme(theme.$cc-theme);
 @include mat.slide-toggle-theme(theme.$cc-theme);
 
-@import "./matSelect.scss";
 @import "./matMenu.scss";
 @import "./matDialog.scss";
-
-.cc-mat-raised {
-	background-color: theme.$cc-primary-color;
-}

package/app/polyfills.ts

@@ -0,0 +1,28 @@
+/**
+ * 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" // Included with Angular CLI.

package/conf/jestE2E.config.json

@@ -5,7 +5,6 @@
 	"collectCoverageFrom": ["<rootDir>/app/**/*.ts", "!**/node_modules/**"],
 	"coveragePathIgnorePatterns": ["\\.(spec|e2e|po)\\.ts$", "<rootDir>/app/puppeteer.helper.ts"],
 	"transform": {
-		"\\.(m?js)$": "babel-jest",
 		"\\.(ts|tsx)$": "ts-jest"
 	},
 	"transformIgnorePatterns": ["/node_modules/(?!(three|ngx-color/fesm2020))"],
@@ -15,8 +14,7 @@
 	"moduleDirectories": ["node_modules", "<rootDir>/app"],
 	"globals": {
 		"ts-jest": {
-			"tsconfig": "tsconfig.spec.json",
-			"babelConfig": true
+			"tsconfig": "tsconfig.spec.json"
 		}
 	},
 	"preset": "./conf/jestE2E-preset.js",

package/conf/jestUnit.config.json

@@ -4,30 +4,18 @@
 	"coverageDirectory": "<rootDir>/dist/coverage",
 	"collectCoverageFrom": ["<rootDir>/app/**/*.ts", "!**/node_modules/**"],
 	"coveragePathIgnorePatterns": ["\\.(spec|e2e|po)\\.ts$", "<rootDir>/app/puppeteer.helper.ts"],
+	"preset": "jest-preset-angular",
 	"transform": {
-		"\\.(m?js)$": "babel-jest",
-		"\\.(ts|tsx)$": "ts-jest",
-		"\\.glsl$": "<rootDir>/mocks/fileTransformer.js",
-		"\\.html$": "html-loader-jest"
+		"\\.glsl$": "<rootDir>/mocks/fileTransformer.js"
 	},
-	"transformIgnorePatterns": ["/node_modules/(?!(three|ngx-color/fesm2020))"],
+	"transformIgnorePatterns": ["/node_modules/(?!(three|ngx-color/fesm2020|.*\\.mjs$))"],
 	"moduleNameMapper": {
-		"\\.png$": "<rootDir>/mocks/fileMock.js",
-		"\\.(css|scss)$": "<rootDir>/mocks/styleMock.js",
-		"\\CHANGELOG.(md)$": "<rootDir>/mocks/changelogMock.js",
-		"ngx-color/chrome": "<rootDir>/node_modules/ngx-color/fesm2020/ngx-color-chrome.mjs",
-		"ngx-color": "<rootDir>/node_modules/ngx-color/fesm2020/ngx-color.mjs"
+		"\\CHANGELOG.(md)$": "<rootDir>/mocks/changelogMock.js"
 	},
 	"roots": ["<rootDir>/app"],
 	"moduleFileExtensions": ["js", "json", "ts", "mjs"],
 	"moduleDirectories": ["node_modules", "<rootDir>/app"],
-	"globals": {
-		"ts-jest": {
-			"tsconfig": "<rootDir>/tsconfig.spec.json",
-			"babelConfig": true
-		}
-	},
 	"setupFiles": ["<rootDir>/mocks/localStorageMock.js"],
-	"setupFilesAfterEnv": ["<rootDir>/conf/setupJestUnit.ts"],
+	"setupFilesAfterEnv": ["<rootDir>/conf/setupJestUnit.ts", "jest-canvas-mock"],
 	"testEnvironment": "jsdom"
 }

package/conf/webpack.config.js

@@ -1,64 +1,27 @@
-const HtmlWebpackPlugin = require("html-webpack-plugin")
-const path = require("path")
-const { CleanWebpackPlugin } = require("clean-webpack-plugin")
-const { DefinePlugin } = require("webpack")
-const NodePolyfillPlugin = require("node-polyfill-webpack-plugin")
-const dist = path.resolve(__dirname, "../dist/webpack")
-const TerserPlugin = require("terser-webpack-plugin")
+const RemarkHTML = require("remark-html")
 
-module.exports = env => {
-	const config = {
-		mode: "development",
-		target: "web",
-		entry: "./app/app.module.ts",
-		output: {
-			filename: "bundle.js",
-			path: dist
+module.exports = config => {
+	config.module.rules.push(
+		{
+			test: /\.glsl$/,
+			use: ["webpack-glsl-loader"]
 		},
-		devServer: {
-			static: {
-				directory: dist
-			},
-			compress: true, // enable gzip compression
-			hot: true, // hot module replacement. Depends on HotModuleReplacementPlugin
-			port: 3000,
-			client: {
-				logging: "error"
-			},
-			open: true
-		},
-		module: require("./webpack.loaders.js"),
-		plugins: [
-			new CleanWebpackPlugin(),
-			new HtmlWebpackPlugin({
-				template: "./app/index.html",
-				favicon: "./app/assets/icon.ico"
-			}),
-			new DefinePlugin({
-				"process.env.DEV": JSON.stringify(env.DEV)
-			}),
-			new NodePolyfillPlugin()
-		],
-		devtool: "source-map",
-		resolve: {
-			extensions: [".ts", ".tsx", ".js"]
-		},
-		optimization: {
-			minimize: true,
-			minimizer: [
-				new TerserPlugin({
-					terserOptions: {
-						keep_classnames: true,
-						keep_fnames: true
+		{
+			test: /\.md$/,
+			use: [
+				{ loader: "html-loader" },
+				{
+					loader: "remark-loader",
+					options: {
+						removeFrontMatter: false,
+						remarkOptions: {
+							plugins: [RemarkHTML]
+						}
 					}
-				})
+				}
 			]
 		}
-	}
-
-	if (env.DEV === "true") {
-		delete config.optimization
-	}
+	)
 
 	return config
 }