add autocomplete example (#67)

demos creating updated datasets compatible with https://github.com/jaywcjlove/nginx-editor.

Had to set the reference-lib package as a "module" to avoid `import` errors like:

> Named export 'Format' not found. The requested module '@nginxinc/reference-lib' is a CommonJS module, which may not support all module.exports as named exports

examples/autocomplete/.gitignore

@@ -0,0 +1,2 @@
+dist
+node_modules

examples/autocomplete/README.md

@@ -0,0 +1,11 @@
+# autocomplete
+
+This example generates a `dist/directives.json` formatted like the one in used in https://github.com/jaywcjlove/nginx-editor, but instead of web scraping it uses `nginx-directive-reference`.
+
+The result is a little more accurate, with up-to-date information and no false-positives where the web scraper is misinterperting the HTML and documenting non-existent NGINX directives.
+
+## Usage
+
+1. `npm ci`
+2. `npm run build`
+3. use the file in `dist/directives.json` as needed

examples/autocomplete/index.ts

@@ -0,0 +1,36 @@
+import { getDirectives, Format, Directive } from '@nginxinc/reference-lib'
+type autocomplete = {
+  /** name of the NGINX module */
+  m: string
+  /** name */
+  n: string
+  /** markdown-formatted description */
+  d: string
+  /** default value, as an unformatted string as if a human typed it into an
+   * nginx config */
+  v?: string
+  /** markdown CSV for valid contexts */
+  c: string
+  /** markdown-formatted syntax specifications, including directive name.
+   * Multiple syntaxes are seperated by newlines */
+  s: string
+}
+
+function toAutocomplete(d: Directive): autocomplete {
+  const ret: autocomplete = {
+    m: d.module,
+    n: d.name,
+    d: d.description,
+    c: d.contexts.map((c) => '`' + c + '`').join(', '),
+    s: d.syntax.map((s) => `**${d.name}** ${s};`).join('\n'),
+  }
+
+  if (d.default) {
+    ret.v = `${d.name} ${d.default};`
+  }
+
+  return ret
+}
+
+const formatted = getDirectives(Format.Markdown).map(toAutocomplete)
+console.log(JSON.stringify(formatted, undefined, 4))

examples/autocomplete/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "autocomplete",
+  "private": true,
+  "version": "0.0.0",
+  "description": "build autocomplete datasets",
+  "type": "module",
+  "scripts": {
+    "build": "mkdir -p dist && ts-node --esm index.ts > dist/directives.json"
+  },
+  "dependencies": {
+    "@nginxinc/reference-lib": "file:../../reference-lib",
+    "@types/node": "^20.8.7",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.2.2"
+  }
+}

examples/autocomplete/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "compilerOptions": {
+    "module": "ES2020",
+    "moduleResolution": "bundler"
+  },
+  "include": ["*.ts"]
+}

reference-lib/jest.config.js

@@ -1,9 +1,9 @@
-module.exports = {
-    transform: {'^.+\\.ts?$': 'ts-jest'},
-    testEnvironment: 'node',
-    testRegex: '/tests/.*\\.(test|spec)?\\.(ts|tsx)$',
-    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
-    moduleNameMapper: {
-      "reference.json": "./src/__mocks__/reference_mock.json"
-    }
-  };
+export default {
+  transform: { '^.+\\.ts?$': 'ts-jest' },
+  testEnvironment: 'node',
+  testRegex: '/tests/.*\\.(test|spec)?\\.(ts|tsx)$',
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
+  moduleNameMapper: {
+    'reference.json': './src/__mocks__/reference_mock.json',
+  },
+}

reference-lib/package.json

@@ -3,6 +3,7 @@
   "version": "1.0.7",
   "description": "",
   "main": "dist/index.js",
+  "type": "module",
   "scripts": {
     "build": "./node_modules/.bin/rollup -c",
     "test": "jest --coverage"