Add highlight.ts to generate monarch-highlight-token file (#168)

Uses the directive export to generate accurate syntax highlighting rules for monaco editors.

Author: xynicole

examples/autocomplete/README.md

@@ -9,3 +9,5 @@ The result is a little more accurate, with up-to-date information and no false-p
 1. `npm ci`
 2. `npm run build`
 3. use the file in `dist/directives.json` as needed
+4. `npm run highlight`
+5. Copy the content from the `dist/highlight.ts` to the `tokenizer: { root: [...]}` section in `monarch-token-provider.ts`

examples/autocomplete/highlight.ts

@@ -0,0 +1,48 @@
+import { getDirectives, Directive } from '@nginxinc/reference-lib'
+
+/** kinds of tokens used for highlighting */
+type token =
+  | 'nginx.toplevel'
+  | 'nginx.top.block'
+  | 'nginx.block'
+  | 'nginx.directives'
+
+function toToken(d: Directive): token {
+  if (d.contexts.includes('main')) {
+    if (d.isBlock) {
+      return 'nginx.top.block'
+    }
+    return 'nginx.toplevel'
+  } else if (d.isBlock) {
+    return 'nginx.block'
+  }
+  return 'nginx.directives'
+}
+
+function toRegex(directiveNames: Set<string>): RegExp {
+  const escapedNames = Array.from(directiveNames)
+
+  return new RegExp(`^\\s*(${escapedNames.join('|')})\\b`)
+}
+
+const dataset: Record<token, Set<string>> = {
+  'nginx.toplevel': new Set<string>(),
+  'nginx.top.block': new Set<string>(),
+  'nginx.block': new Set<string>(),
+  'nginx.directives': new Set<string>(),
+}
+
+for (const directive of getDirectives()) {
+  const token = toToken(directive)
+  dataset[token].add(directive.name)
+}
+
+const formatted: [RegExp, token][] = Object.entries(dataset).map(
+  ([key, value]) => {
+    return [toRegex(value), key as token]
+  }
+)
+
+formatted.forEach(([regex, token]) => {
+  console.log(`[${regex}, "${token}"],`)
+})

examples/autocomplete/package.json

@@ -5,7 +5,8 @@
   "description": "build autocomplete datasets",
   "type": "module",
   "scripts": {
-    "build": "mkdir -p dist && node --loader=ts-node/esm index.ts > dist/directives.json"
+    "build": "mkdir -p dist && node --loader=ts-node/esm index.ts > dist/directives.json",
+    "highlight": "mkdir -p dist && node --loader=ts-node/esm highlight.ts > dist/highlight.ts"
   },
   "dependencies": {
     "@nginxinc/reference-lib": "file:../../reference-lib",