Use generate codicon.css with embedded TTF instead of imported one

- This removes the need to have codicon as depedency to the sprotty core
- Replace rimraf wih shx

package.json

@@ -10,7 +10,8 @@
     "publish:next": "SHA=$(git rev-parse --short HEAD) && lerna publish preminor --exact --canary --preid next.${SHA} --dist-tag next --no-git-reset --no-git-tag-version --no-push --ignore-scripts --yes --no-verify-access"
   },
   "devDependencies": {
-    "lerna": "^4.0.0"
+    "lerna": "^4.0.0",
+    "shx": "^0.3.4"
   },
   "workspaces": [
     "packages/*",

packages/sprotty-elk/package.json

@@ -58,14 +58,13 @@
     "jenkins-mocha": "^8.0.0",
     "mocha": "^7.2.0",
     "reflect-metadata": "^0.1.13",
-    "rimraf": "^3.0.2",
     "semver": "^7.3.5",
     "ts-node": "^10.4.0",
     "typescript": "~3.8.3"
   },
   "scripts": {
     "prepare": "yarn run clean && yarn run build",
-    "clean": "rimraf lib artifacts",
+    "clean": "shx rm -fr lib artifacts",
     "build": "tsc -p ./tsconfig.json && yarn run lint",
     "watch": "tsc -w -p ./tsconfig.json",
     "lint": "eslint -c ../../configs/.eslintrc.js \"src/**/!(*.spec.ts*)\"",

packages/sprotty-protocol/package.json

@@ -38,13 +38,12 @@
     "eslint-plugin-header": "^3.1.1",
     "eslint-plugin-no-null": "^1.0.2",
     "mocha": "^7.2.0",
-    "rimraf": "^3.0.2",
     "semver": "^7.3.5",
     "typescript": "~3.8.3"
   },
   "scripts": {
     "prepare": "yarn run clean && yarn run build",
-    "clean": "rimraf lib artifacts",
+    "clean": "shx rm -fr lib artifacts",
     "build": "tsc -p ./tsconfig.json && yarn run lint",
     "watch": "tsc -w -p ./tsconfig.json",
     "lint": "eslint -c ../../configs/.eslintrc.js \"src/**/!(*.spec.ts*)\"",

packages/sprotty/.gitignore

@@ -1,2 +1,5 @@
 /lib/
 /artifacts/
+/css/generated
+/build/dist
+/build/src/generated

packages/sprotty/build/src/buildCodicon.ts

@@ -0,0 +1,72 @@
+import * as fs from 'fs';
+
+function transformCodicon() {
+    fs.readFile('../../node_modules/@vscode/codicons/dist/codicon.css', 'utf8', (err, cssData) => {
+        if (err) {
+            console.error(err);
+            return;
+        }
+
+        if (!fs.existsSync('./src/utils/generated')) {
+            fs.mkdirSync('./src/utils/generated');
+        }
+        if (!fs.existsSync('./css/generated')) {
+            fs.mkdirSync('./css/generated');
+        }
+
+        fs.readFile('../../node_modules/@vscode/codicons/dist/codicon.ttf', 'base64', (errTtf, dataTtf) => {
+            if (errTtf) {
+                console.error(errTtf);
+                return;
+            }
+            const ttfData = `data:font/ttf;base64,${dataTtf}`;
+            const alteredCssData = cssData.replace('"./codicon.ttf?0e5b0adf625a37fbcd638d31f0fe72aa"', ttfData);
+
+            fs.writeFileSync('./css/generated/codicon.css', alteredCssData);
+
+            // Generated for debugging purposes
+            fs.writeFileSync('./build/src/generated/codiconTTF.ts',
+`export function getCodiconTtf() {
+    return \'${ttfData}\';
+}
+`);
+            // Generated for debugging purposes
+            fs.writeFileSync('./build/src/generated/codiconCSS.ts',
+`export function getCodiconCss() {
+    return \`${cssData}\`;
+}
+`);
+        });
+
+    });
+}
+
+/**
+ * Generated for debugging purposes
+ */
+function generateAlernateLoadingFunction() {
+    const funcData = `import { getCodiconCss } from "./codiconCSS";
+import { getCodiconTtf } from "./codiconTTF";
+
+export function loadCodicon(): void {
+    const ttf = getCodiconTtf();
+    const codicon = new FontFace('Codicon', ` + '\`url(${ttf})\`' + `);
+    codicon.load().then((l: FontFace) => {
+        document.fonts.add(l);
+        document.body.style.fontFamily = 'Codicon';
+        console.log('Loaded Codicon TTF font');
+    }).catch((e: Error) => {
+        throw e;
+    });
+
+    const style = document.createElement('style');
+    style.id = 'codicon';
+    style.innerHTML = getCodiconCss();
+    document.head.appendChild(style);
+}
+`
+    fs.writeFileSync('./build/src/generated/codiconLoader.ts', funcData);
+}
+
+transformCodicon();
+generateAlernateLoadingFunction();

packages/sprotty/build/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "src",
+    "outDir": "dist",
+    "declarationDir": "dist",
+    "target": "ES2020",
+    "types": [
+      "node"
+    ]
+  },
+  "include": [
+    "**/*.ts",
+  ],
+  "exclude": []
+}

packages/sprotty/package.json

@@ -52,7 +52,6 @@
     "directory": "packages/sprotty"
   },
   "dependencies": {
-    "@vscode/codicons": "^0.0.25",
     "autocompleter": "^5.1.0",
     "file-saver": "^2.0.2",
     "inversify": "^5.1.1",
@@ -65,8 +64,10 @@
     "@types/file-saver": "^2.0.3",
     "@types/jsdom": "^16.2.13",
     "@types/mocha": "^7.0.2",
+    "@types/node": "16.11.57",
     "@typescript-eslint/eslint-plugin": "^5.3.0",
     "@typescript-eslint/parser": "^5.3.0",
+    "@vscode/codicons": "^0.0.32",
     "chai": "^4.3.4",
     "eslint": "^8.1.0",
     "eslint-config-prettier": "^8.3.0",
@@ -76,7 +77,6 @@
     "jsdom": "^18.0.1",
     "mocha": "^7.2.0",
     "reflect-metadata": "^0.1.13",
-    "rimraf": "^3.0.2",
     "semver": "^7.3.5",
     "snabbdom-to-html": "^7.0.0",
     "ts-mocha": "^8.0.0",
@@ -85,8 +85,9 @@
   },
   "scripts": {
     "prepare": "yarn run clean && yarn run build",
-    "clean": "rimraf lib artifacts",
-    "build": "tsc -p ./tsconfig.json && yarn run lint",
+    "clean": "shx rm -fr lib artifacts build/dist",
+    "build:generate": "shx rm -fr ./build/dist ./build/src/generated && shx mkdir -p ./build/src/generated && tsc -p ./build/tsconfig.json && node ./build/dist/buildCodicon.js",
+    "build": "yarn run build:generate && tsc -p ./tsconfig.json && yarn run lint",
     "watch": "tsc -w -p ./tsconfig.json",
     "lint": "eslint -c ../../configs/.eslintrc.js \"src/**/!(*.spec.ts*|test-helper.ts)\"",
     "test:cli": "ts-mocha \"./src/**/*.spec.?(ts|tsx)\"",

packages/sprotty/src/base/model/smodel-utils.ts

@@ -175,4 +175,4 @@ export function  transformToRootBounds(parent: SParentElement, bounds: Bounds) {
         parent = parent.parent;
     }
     return bounds;
-}
+}

packages/sprotty/src/features/command-palette/di.config.ts

@@ -13,7 +13,7 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import '@vscode/codicons/dist/codicon.css';
+import '../../../css/generated/codicon.css';
 import { ContainerModule } from "inversify";
 import { TYPES } from "../../base/types";
 import { CommandPaletteActionProviderRegistry } from "./action-providers";

packages/sprotty/tsconfig.json

@@ -7,6 +7,9 @@
     "src"
   ],
   "exclude": [
-    "**/*.spec.ts", "**/*.spec.tsx", "src/utils/test-helper.ts"
+    "build",
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "src/utils/test-helper.ts"
   ]
 }

yarn.lock

@@ -1197,6 +1197,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-16.11.6.tgz#6bef7a2a0ad684cf6e90fcfe31cecabd9ce0a3ae"
   integrity sha512-ua7PgUoeQFjmWPcoo9khiPum3Pd60k4/2ZGXt18sm2Slk0W0xZTqt5Y0Ny1NyBiN1EVQ/+FaF9NcY4Qe6rwk5w==
 
+"@types/[email protected]":
+  version "16.11.57"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-16.11.57.tgz#786f74cef16acf2c5eb11795b6c3f7ae93596662"
+  integrity sha512-diBb5AE2V8h9Fs9zEDtBwSeLvIACng/aAkdZ3ujMV+cGuIQ9Nc/V+wQqurk9HJp8ni5roBxQHW21z/ZYbGDivg==
+
 "@types/normalize-package-data@^2.4.0":
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz#d3357479a0fdfdd5907fe67e17e0a85c906e1301"
@@ -1310,10 +1315,10 @@
     "@typescript-eslint/types" "5.3.0"
     eslint-visitor-keys "^3.0.0"
 
-"@vscode/codicons@^0.0.25":
-  version "0.0.25"
-  resolved "https://registry.yarnpkg.com/@vscode/codicons/-/codicons-0.0.25.tgz#4ebc3e2c9e707ac46aea0becceda79f7738c647c"
-  integrity sha512-uqPhTdADjwoCh5Ufbv0M6TZiiP2mqbfJVB4grhVx1k+YeP03LDMOHBWPsNwGKn4/0S5Mq9o1w1GeftvR031Gzg==
+"@vscode/codicons@^0.0.32":
+  version "0.0.32"
+  resolved "https://registry.yarnpkg.com/@vscode/codicons/-/codicons-0.0.32.tgz#9e27de90d509c69762b073719ba3bf46c3cd2530"
+  integrity sha512-3lgSTWhAzzWN/EPURoY4ZDBEA80OPmnaknNujA3qnI4Iu7AONWd9xF3iE4L+4prIe8E3TUnLQ4pxoaFTEEZNwg==
 
 "@webassemblyjs/[email protected]":
   version "1.11.1"
@@ -4568,7 +4573,7 @@ [email protected]:
     is-plain-obj "^1.1.0"
     kind-of "^6.0.3"
 
-minimist@^1.2.0, minimist@^1.2.5:
+minimist@^1.2.0, minimist@^1.2.3, minimist@^1.2.5:
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
   integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
@@ -6099,7 +6104,7 @@ shell-escape@^0.2.0:
   resolved "https://registry.yarnpkg.com/shell-escape/-/shell-escape-0.2.0.tgz#68fd025eb0490b4f567a027f0bf22480b5f84133"
   integrity sha1-aP0CXrBJC09WegJ/C/IkgLX4QTM=
 
-shelljs@^0.8.3:
+shelljs@^0.8.3, shelljs@^0.8.5:
   version "0.8.5"
   resolved "https://registry.yarnpkg.com/shelljs/-/shelljs-0.8.5.tgz#de055408d8361bed66c669d2f000538ced8ee20c"
   integrity sha512-TiwcRcrkhHvbrZbnRcFYMLl30Dfov3HKqzp5tO5b4pt6G/SezKcYhmDg15zXVBswHmctSAQKznqNW2LO5tTDow==
@@ -6108,6 +6113,14 @@ shelljs@^0.8.3:
     interpret "^1.0.0"
     rechoir "^0.6.2"
 
+shx@^0.3.4:
+  version "0.3.4"
+  resolved "https://registry.yarnpkg.com/shx/-/shx-0.3.4.tgz#74289230b4b663979167f94e1935901406e40f02"
+  integrity sha512-N6A9MLVqjxZYcVn8hLmtneQWIJtp8IKzMP4eMnx+nqkvXoqinUPCbUFLp2UcWTEIUONhlk0ewxr/jaVGlc+J+g==
+  dependencies:
+    minimist "^1.2.3"
+    shelljs "^0.8.5"
+
 side-channel@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"