chore: Add prettier, mirroring the stackable-apps configuration

Scoped away from the inherited upstream src/ files until the planned
upstream re-sync, so the diff against antora-ui-default stays readable.
prettier --check runs as part of npm run lint (and therefore in CI).

knip is deliberately not added: handlebars templates and classic
browser scripts have no import graph, and most dependencies are
referenced from playbook YAML or css, so it would need to ignore
nearly everything to stay quiet.

Author: lfrancke

package-lock.json

@@ -0,0 +1,5 @@
+build/
+node_modules/
+# inherited upstream files stay untouched until the upstream re-sync,
+# so the diff against antora-ui-default remains readable
+src/

ui/.prettierignore

@@ -0,0 +1,6 @@
+{
+  "useTabs": false,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "printWidth": 100
+}

ui/.prettierrc

@@ -5,22 +5,22 @@
 // The scripts are consumed as classic <script src> tags, so every js entry is
 // built as a self-contained IIFE in its own vite pass (rollup cannot code-split
 // iife output, which is exactly what we want here).
-import { build } from 'vite'
-import { copyFileSync, cpSync, createWriteStream, mkdirSync, readdirSync, rmSync } from 'node:fs'
-import { resolve, basename } from 'node:path'
-import { ZipArchive } from 'archiver'
+import { build } from 'vite';
+import { copyFileSync, cpSync, createWriteStream, mkdirSync, readdirSync, rmSync } from 'node:fs';
+import { resolve, basename } from 'node:path';
+import { ZipArchive } from 'archiver';
 
-const root = import.meta.dirname
-const src = resolve(root, 'src')
-const staged = resolve(root, 'build/ui')
+const root = import.meta.dirname;
+const src = resolve(root, 'src');
+const staged = resolve(root, 'build/ui');
 
 // js/site.js is the concatenation of the numbered scripts, in order. They are
 // self-contained IIFEs, so a virtual entry with side-effect imports preserves
 // the behaviour.
 const siteScripts = readdirSync(resolve(src, 'js'))
   .filter((name) => /^\d+-.+\.js$/.test(name))
-  .sort()
-const virtualSiteId = 'virtual:site.js'
+  .sort();
+const virtualSiteId = 'virtual:site.js';
 
 // Every js/vendor/*.bundle.js becomes js/vendor/<name>.js with its CommonJS
 // requires bundled in (this replaces browserify).
@@ -30,11 +30,11 @@ const jsEntries = [
     .filter((name) => name.endsWith('.bundle.js'))
     .map((name) => ({
       name: `vendor/${basename(name, '.bundle.js')}`,
-      input: resolve(src, 'js', 'vendor', name),
-    })),
-]
+      input: resolve(src, 'js', 'vendor', name)
+    }))
+];
 
-function config (overrides) {
+function config(overrides) {
   return {
     configFile: false,
     root,
@@ -49,71 +49,75 @@ function config (overrides) {
         load: (id) =>
           id === virtualSiteId
             ? siteScripts.map((name) => `import '${resolve(src, 'js', name)}'`).join('\n')
-            : undefined,
-      },
+            : undefined
+      }
     ],
-    ...overrides,
-  }
+    ...overrides
+  };
 }
 
-rmSync(resolve(root, 'build'), { recursive: true, force: true })
+rmSync(resolve(root, 'build'), { recursive: true, force: true });
 
 for (const entry of jsEntries) {
-  await build(config({
+  await build(
+    config({
+      build: {
+        outDir: staged,
+        emptyOutDir: false,
+        rollupOptions: {
+          input: entry.input,
+          output: {
+            format: 'iife',
+            entryFileNames: `js/${entry.name}.js`,
+            inlineDynamicImports: true
+          }
+        }
+      }
+    })
+  );
+}
+
+await build(
+  config({
     build: {
       outDir: staged,
       emptyOutDir: false,
+      assetsInlineLimit: 0,
       rollupOptions: {
-        input: entry.input,
+        input: resolve(src, 'css', 'site.css'),
         output: {
-          format: 'iife',
-          entryFileNames: `js/${entry.name}.js`,
-          inlineDynamicImports: true,
-        },
-      },
-    },
-  }))
-}
-
-await build(config({
-  build: {
-    outDir: staged,
-    emptyOutDir: false,
-    assetsInlineLimit: 0,
-    rollupOptions: {
-      input: resolve(src, 'css', 'site.css'),
-      output: {
-        assetFileNames: (asset) => {
-          const name = asset.names[0] ?? ''
-          if (name === 'site.css') return 'css/site.css'
-          if (/^fa-.+\.(woff2?|ttf)$/.test(name)) return 'webfonts/[name][extname]'
-          if (/\.(woff2?|ttf)$/.test(name)) return 'font/[name][extname]'
-          if (/\.(svg|png|gif|ico|jpg)$/.test(name)) return 'img/[name][extname]'
-          return 'css/[name][extname]'
-        },
-      },
-    },
-  },
-}))
+          assetFileNames: (asset) => {
+            const name = asset.names[0] ?? '';
+            if (name === 'site.css') return 'css/site.css';
+            if (/^fa-.+\.(woff2?|ttf)$/.test(name)) return 'webfonts/[name][extname]';
+            if (/\.(woff2?|ttf)$/.test(name)) return 'font/[name][extname]';
+            if (/\.(svg|png|gif|ico|jpg)$/.test(name)) return 'img/[name][extname]';
+            return 'css/[name][extname]';
+          }
+        }
+      }
+    }
+  })
+);
 
 // webfonts/ ships as-is: the Font Awesome css references it with
 // runtime-relative urls that vite cannot (and must not) rewrite
 for (const dir of ['helpers', 'layouts', 'partials', 'img', 'webfonts']) {
-  cpSync(resolve(src, dir), resolve(staged, dir), { recursive: true })
+  cpSync(resolve(src, dir), resolve(staged, dir), { recursive: true });
 }
 for (const file of ['NOTICE', 'LICENSE']) {
-  copyFileSync(resolve(root, file), resolve(staged, file))
+  copyFileSync(resolve(root, file), resolve(staged, file));
 }
 
-const zipPath = resolve(root, 'build/ui-bundle.zip')
-mkdirSync(resolve(root, 'build'), { recursive: true })
+const zipPath = resolve(root, 'build/ui-bundle.zip');
+mkdirSync(resolve(root, 'build'), { recursive: true });
 await new Promise((resolvePromise, reject) => {
-  const output = createWriteStream(zipPath)
-  const archive = new ZipArchive()
-  output.on('close', resolvePromise)
-  archive.on('error', reject)
-  archive.pipe(output)
-  archive.directory(staged, false)
-  archive.finalize()
-})
-console.log(`bundled ${zipPath}`)
+  const output = createWriteStream(zipPath);
+  const archive = new ZipArchive();
+  output.on('close', resolvePromise);
+  archive.on('error', reject);
+  archive.pipe(output);
+  archive.directory(staged, false);
+  archive.finalize();
+});
+console.log(`bundled ${zipPath}`);

ui/build.mjs

@@ -1,30 +1,30 @@
-import js from '@eslint/js'
-import globals from 'globals'
+import js from '@eslint/js';
+import globals from 'globals';
 
 export default [
   js.configs.recommended,
   {
-    ignores: ['build/**', 'node_modules/**'],
+    ignores: ['build/**', 'node_modules/**']
   },
   {
     files: ['src/js/**/*.js', 'src/helpers/*.js'],
     ignores: ['src/js/vendor/*.bundle.js'],
     languageOptions: {
       sourceType: 'commonjs',
-      globals: { ...globals.browser, ...globals.commonjs },
-    },
+      globals: { ...globals.browser, ...globals.commonjs }
+    }
   },
   {
     files: ['src/js/vendor/*.bundle.js'],
     languageOptions: {
       sourceType: 'module',
-      globals: globals.browser,
-    },
+      globals: globals.browser
+    }
   },
   {
     files: ['build.mjs', 'vite.config.js'],
     languageOptions: {
-      globals: globals.node,
-    },
-  },
-]
+      globals: globals.node
+    }
+  }
+];

ui/eslint.config.js

@@ -1,4 +1,4 @@
-'use strict'
+'use strict';
 
 // This placeholder script allows this package to be discovered using require.resolve.
 // It may be used in the future to export information about the files in this UI.

ui/index.js

@@ -6,7 +6,8 @@
   "type": "module",
   "scripts": {
     "bundle": "node build.mjs",
-    "lint": "eslint . && stylelint 'src/css/*.css'"
+    "lint": "eslint . && stylelint 'src/css/*.css' && prettier --check .",
+    "format": "prettier --write ."
   },
   "engines": {
     "node": ">= 24.0.0"
@@ -24,6 +25,7 @@
     "eslint": "^10.7.0",
     "globals": "^17.7.0",
     "highlight.js": "^10.7",
+    "prettier": "^3.9.5",
     "stylelint": "^17.14.0",
     "stylelint-config-standard": "^40.0.0",
     "vite": "^8.1.4"

ui/package.json

@@ -1,6 +1,4 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "local>stackabletech/.github:renovate-config"
-  ]
+  "extends": ["local>stackabletech/.github:renovate-config"]
 }