Implemented TS compilation

package-lock.json

@@ -515,15 +515,6 @@
       "integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug==",
       "dev": true
     },
-    "@types/ramda": {
-      "version": "0.27.38",
-      "resolved": "https://registry.npmjs.org/@types/ramda/-/ramda-0.27.38.tgz",
-      "integrity": "sha512-tZoQ0lv1WKkrpBHemL8yCkI9p8kUk/1PSMwhl0eeyqMQjD+2ePUtVLV8PpNS9Kq3OktObwOx9I3k+HumxTviRg==",
-      "dev": true,
-      "requires": {
-        "ts-toolbelt": "^6.15.1"
-      }
-    },
     "@types/relateurl": {
       "version": "0.2.28",
       "resolved": "https://registry.npmjs.org/@types/relateurl/-/relateurl-0.2.28.tgz",
@@ -536,6 +527,15 @@
       "integrity": "sha512-8k/67Z95Goa6Lznuykxkfhq9YU3l1Qe6LNZmwde1u7802a3x8v44oq0j91DICclxatTr0rNnhXx7+VTIetSrSQ==",
       "dev": true
     },
+    "@types/sass": {
+      "version": "1.16.0",
+      "resolved": "https://registry.npmjs.org/@types/sass/-/sass-1.16.0.tgz",
+      "integrity": "sha512-2XZovu4NwcqmtZtsBR5XYLw18T8cBCnU2USFHTnYLLHz9fkhnoEMoDsqShJIOFsFhn5aJHjweiUUdTrDGujegA==",
+      "dev": true,
+      "requires": {
+        "@types/node": "*"
+      }
+    },
     "@types/uglify-js": {
       "version": "3.9.0",
       "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-3.9.0.tgz",
@@ -6626,12 +6626,6 @@
       "integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==",
       "dev": true
     },
-    "ramda": {
-      "version": "0.27.1",
-      "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.27.1.tgz",
-      "integrity": "sha512-PgIdVpn5y5Yns8vqb8FzBUEYn98V3xcPgawAkkgj0YJ0qDsnHCiNmZYfOGMgOvoB0eWFLpYbhxUR3mxfDIMvpw==",
-      "dev": true
-    },
     "read-pkg": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
@@ -8814,12 +8808,6 @@
         "yn": "3.1.1"
       }
     },
-    "ts-toolbelt": {
-      "version": "6.15.5",
-      "resolved": "https://registry.npmjs.org/ts-toolbelt/-/ts-toolbelt-6.15.5.tgz",
-      "integrity": "sha512-FZIXf1ksVyLcfr7M317jbB67XFJhOO1YqdTcuGaq9q5jLUoTikukZ+98TPjKiP2jC5CgmYdWWYs0s2nLSU0/1A==",
-      "dev": true
-    },
     "tsconfig-paths": {
       "version": "3.9.0",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.9.0.tgz",
@@ -8832,12 +8820,6 @@
         "strip-bom": "^3.0.0"
       }
     },
-    "tslib": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.1.0.tgz",
-      "integrity": "sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==",
-      "dev": true
-    },
     "tsutils": {
       "version": "3.20.0",
       "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.20.0.tgz",

package.json

@@ -50,11 +50,12 @@
     "@types/html-minifier": "^4.0.0",
     "@types/lunr": "^2.3.3",
     "@types/node": "^14.14.28",
-    "@types/ramda": "^0.27.37",
     "@types/resize-observer-browser": "^0.1.5",
+    "@types/sass": "^1.16.0",
     "@typescript-eslint/eslint-plugin": "^4.15.0",
     "@typescript-eslint/parser": "^4.15.0",
-    "autoprefixer": "10.2.4",
+    "autoprefixer": "^10.2.4",
+    "chokidar": "^3.5.1",
     "cssnano": "^4.1.10",
     "esbuild": "^0.8.46",
     "eslint": "^7.20.0",
@@ -71,7 +72,6 @@
     "postcss-inline-svg": "^5.0.0",
     "postcss-svgo": "^4.0.2",
     "preact": "^10.5.12",
-    "ramda": "^0.27.1",
     "rimraf": "^3.0.2",
     "sass": "^1.32.6",
     "stylelint": "^13.9.0",
@@ -82,7 +82,6 @@
     "svgo": "^2.0.1",
     "tiny-glob": "^0.2.8",
     "ts-node": "^9.1.1",
-    "tslib": "^2.1.0",
     "typescript": "^4.1.5"
   },
   "engines": {

tools/copy/index.ts

@@ -38,7 +38,7 @@ import { mkdir, resolve } from "../resolve"
  *
  * @returns Transformed content
  */
-type CopyTransformFn = (content: string) => Promise<string> | string
+type CopyTransformFn = (content: string) => Promise<string>
 
 /* ------------------------------------------------------------------------- */
 
@@ -71,7 +71,7 @@ export function copy(
         ? from(fs.copyFile(src, out))
         : from(fs.readFile(src, "utf8"))
             .pipe(
-              switchMap(content => from(fn(content))),
+              switchMap(content => fn(content)),
               switchMap(content => fs.writeFile(out, content))
             )
       ),

tools/index.ts

@@ -20,14 +20,16 @@
  * IN THE SOFTWARE.
  */
 
-// import { build } from "esbuild"
 import { minify as minhtml } from "html-minifier"
-import { concat } from "rxjs"
+import { concat, merge } from "rxjs"
 import { concatMap } from "rxjs/operators"
 
 import { copyAll } from "./copy"
 import { base, resolve } from "./resolve"
-import { transformStyle } from "./transform"
+import {
+  transformScript,
+  transformStyle
+} from "./transform"
 
 /* ----------------------------------------------------------------------------
  * Program
@@ -79,7 +81,7 @@ const assets$ = concat(
   copyAll("**/*.html", {
     src: "src",
     out: base,
-    fn: content => {
+    fn: async content => {
       const metadata = require("../package.json")
       const banner =
         "{#-\n" +
@@ -113,15 +115,37 @@ const styles$ = resolve("**/[!_]*.scss", { cwd: "src" })
   .pipe(
     concatMap(file => transformStyle({
       src: `src/${file}`,
-      out: `${base}/${file.replace(/\.scss$/, ".css")}`,
+      out: `${base}/${file.replace(/\.scss$/, ".css")}`
-      optimize: true // TODO: wrap with commander
     }))
   )
 
+/* Transform scripts with ESBuild */
+const scripts$ = merge(
+
+  /* Transform application */
+  transformScript({
+    src: "src/assets/javascripts/index.ts",
+    out: `${base}/assets/javascripts/bundle.js`
+  }),
+
+  /* Transform application overrides */
+  transformScript({
+    src: "src/overrides/assets/javascripts/index.ts",
+    out: `${base}/overrides/assets/javascripts/bundle.js`
+  }),
+
+  /* Transform search worker */
+  transformScript({
+    src: "src/assets/javascripts/integrations/search/worker/main/index.ts",
+    out: `${base}/assets/javascripts/worker/search.js`
+  })
+)
+
 /* Compile everything */
 concat(
   dependencies$,
   assets$,
-  styles$
+  styles$,
+  scripts$
 )
-  .subscribe()
+  .subscribe(console.log)

tools/resolve/index.ts

@@ -55,7 +55,7 @@ export const base = "material2"
  * @param pattern - Pattern
  * @param options - Options
  *
- * @returns Files
+ * @returns File observable
  */
 export function resolve(
   pattern: string, options?: ResolveOptions

tools/transform/index.ts

@@ -20,6 +20,7 @@
  * IN THE SOFTWARE.
  */
 
+import { build } from "esbuild"
 import * as fs from "fs/promises"
 import * as path from "path"
 import postcss from "postcss"
@@ -27,6 +28,7 @@ import { Observable, defer, merge } from "rxjs"
 import {
   endWith,
   ignoreElements,
+  mapTo,
   switchMap,
   tap
 } from "rxjs/operators"
@@ -45,7 +47,6 @@ import { base, mkdir } from "../resolve"
 interface TransformOptions {
   src: string                          /* Source file */
   out: string                          /* Target file */
-  optimize?: boolean                   /* Optimize assets */
 }
 
 /* ----------------------------------------------------------------------------
@@ -69,7 +70,7 @@ const root = new RegExp(`file://${path.resolve(".")}/`, "g")
  * @returns File observable
  */
 export function transformStyle(
-  { src, out, optimize }: TransformOptions
+  { src, out }: TransformOptions
 ): Observable<string> {
   return defer(() => promisify(sass)({
     file: src,
@@ -92,7 +93,7 @@ export function transformStyle(
           ],
           encode: false
         }),
-        ...optimize ? [require("cssnano")] : []
+        require("cssnano")
       ])
         .process(css, {
           from: src,
@@ -112,3 +113,25 @@ export function transformStyle(
       endWith(out)
     )
 }
+
+/**
+ * Transform a script
+ *
+ * @param options - Options
+ *
+ * @returns File observable
+ */
+export function transformScript(
+  { src, out }: TransformOptions
+): Observable<string> {
+  return defer(() => build({
+    entryPoints: [src],
+    outfile: out,
+    bundle: true,
+    sourcemap: true,
+    minify: true
+  }))
+    .pipe(
+      mapTo(out)
+    )
+}