@ixon-cdk/core 1.21.0-next.2 → 1.22.0-next.0

package/api/api.utils.js

@@ -1,4 +1,4 @@
-function whileMoreAfter(reqFn) {
+export function whileMoreAfter(reqFn) {
   const fetcher = async (seed, moreAfter) => {
     const response = await reqFn(moreAfter);
     const data = [...seed, ...response.data.data];
@@ -12,7 +12,3 @@ function whileMoreAfter(reqFn) {
     status: 'success',
   }));
 }
-
-module.exports = {
-  whileMoreAfter,
-};

package/api/auth.service.js

@@ -1,8 +1,8 @@
-const fs = require('fs');
-const ApiBaseService = require('./base.service');
-const httpRequest = require('../http-request');
+import fs from 'node:fs';
+import { ApiBaseService } from './base.service.js';
+import httpRequest from '../http-request.js';
 
-module.exports = class AuthService extends ApiBaseService {
+export class AuthService extends ApiBaseService {
   logIn(credentials) {
     const c = credentials;
     const expiresIn = 2592000; // 30 days
@@ -42,7 +42,7 @@ module.exports = class AuthService extends ApiBaseService {
 
   remember(secretId) {
     fs.writeFileSync(this._getAccessTokenFilePath(), secretId, {
-      encoding: 'utf8',
+      encoding: 'utf-8',
       flag: 'w',
     });
   }
@@ -52,4 +52,4 @@ module.exports = class AuthService extends ApiBaseService {
       fs.rmSync(this._getAccessTokenFilePath());
     }
   }
-};
+}

package/api/base.service.js

@@ -1,8 +1,9 @@
-const fs = require('fs');
-const path = require('path');
-const ConfigService = require('../config/config.service');
+import fs from 'node:fs';
+import path from 'node:path';
+import { ConfigService } from '../config/config.service.js';
+import { getRootDir } from '../utils.js';
 
-module.exports = class ApiBaseService {
+export class ApiBaseService {
   _configSrv = new ConfigService();
 
   /**
@@ -19,7 +20,7 @@ module.exports = class ApiBaseService {
 
   /** Returns an absolute path to the `.accesstoken` file. */
   _getAccessTokenFilePath() {
-    return path.join(require('../utils').getRootDir(), '.accesstoken');
+    return path.join(getRootDir(), '.accesstoken');
   }
 
   _getApiAuthHeaderValue() {
@@ -53,4 +54,4 @@ module.exports = class ApiBaseService {
     }
     return secretId;
   }
-};
+}

package/api/config.service.js

@@ -0,0 +1,119 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { merge } from 'lodash-es';
+import {
+  getArgv,
+  getRootDir,
+  logFileCrudMessage,
+  logErrorMessage,
+} from '../utils.js';
+
+export class ConfigService {
+  _config = { components: {} };
+
+  constructor(configFile) {
+    // When the CDK is part of a larger project workspace it may be desirable to have a more explicit config-file name. Therefore, unless
+    // a specific config file path was defined in the constructor, we'll first try to find `cdk.config.json`, before falling back to the
+    // default file name `config.json`.
+    if (configFile !== undefined) {
+      this._path = path.join(getRootDir(), configFile);
+    } else {
+      const argv = getArgv();
+      const argConfigPath = argv['config'] || argv['c'];
+      if (argConfigPath) {
+        if (fs.existsSync(path.join(getRootDir(), argConfigPath))) {
+          this._path = path.join(getRootDir(), argConfigPath);
+        } else {
+          logErrorMessage(
+            `Config file not found: ${path.join(getRootDir(), argConfigPath)}`,
+          );
+          process.exit(1);
+        }
+        this._path = path.join(getRootDir(), argConfigPath);
+      } else if (fs.existsSync(path.join(getRootDir(), 'cdk.config.json'))) {
+        this._path = path.join(getRootDir(), 'cdk.config.json');
+      } else {
+        this._path = path.join(getRootDir(), 'config.json');
+      }
+    }
+
+    if (!fs.existsSync(this._path)) {
+      this._path = path.join(getRootDir(), 'cdk.config.json');
+      fs.writeFileSync(
+        this._path,
+        `${JSON.stringify(
+          {
+            $schema: './node_modules/@ixon-cdk/core/config/schema.json',
+            prefix: 'pct',
+            components: {},
+          },
+          null,
+          2,
+        )}\n`,
+        { encoding: 'utf-8' },
+      );
+      logFileCrudMessage('CREATE', 'cdk.config.json');
+    }
+
+    try {
+      this._config = JSON.parse(fs.readFileSync(this._path, 'utf-8'));
+    } catch {
+      logErrorMessage("Couldn't parse config file.");
+      process.exit(1);
+    }
+  }
+
+  hasComponent(name) {
+    return name in this._config.components;
+  }
+
+  getComponent(name) {
+    return this._config.components[name];
+  }
+
+  getNewComponentRoot() {
+    return this._config.newComponentRoot || 'components';
+  }
+
+  getOutputPath() {
+    return this._config.outputPath || 'dist';
+  }
+
+  getPrefix() {
+    return this._config.prefix || null;
+  }
+
+  getApiApplication() {
+    return this._config.apiApplication || 'LtDdZKEPa5lK';
+  }
+
+  getApiBaseUrl() {
+    return this._config.apiBaseUrl || 'https://api.ayayot.com';
+  }
+
+  getApiVersion() {
+    return this._config.apiVersion || '2';
+  }
+
+  addComponent(name, config) {
+    this._config.components[name] = config;
+    this._sync();
+  }
+
+  extendComponent(name, config) {
+    this._config.components[name] = merge(
+      {},
+      this._config.components[name],
+      config,
+    );
+    this._sync();
+  }
+
+  _sync() {
+    fs.writeFileSync(this._path, `${JSON.stringify(this._config, null, 2)}\n`, {
+      encoding: 'utf-8',
+      flag: 'w',
+    });
+    logFileCrudMessage('UPDATE', path.basename(this._path));
+  }
+}

package/api/deploy.service.js

@@ -1,15 +1,14 @@
-const fs = require('fs');
-const path = require('path');
-const ApiBaseService = require('./base.service');
-const httpRequest = require('../http-request');
-const { whileMoreAfter } = require('./api.utils');
+import fs from 'node:fs';
+import path from 'node:path';
+import { ApiBaseService } from './base.service.js';
+import httpRequest from '../http-request.js';
+import { whileMoreAfter } from './api.utils.js';
+import { generatePreviewHash, getRootDir } from '../utils.js';
 
-module.exports = class DeployService extends ApiBaseService {
+export class DeployService extends ApiBaseService {
   deploy(companyId, templateId, file) {
     const url = `${this._getApiBaseUrl()}/page-component-templates/${templateId}/version-upload`;
-    const body = fs.readFileSync(
-      path.join(require('../utils').getRootDir(), file),
-    );
+    const body = fs.readFileSync(path.join(getRootDir(), file));
     const headers = {
       ...this._getApiDefaultHeaders(),
       'Content-Type': 'application/x-www-form-urlencoded',
@@ -49,7 +48,7 @@ module.exports = class DeployService extends ApiBaseService {
         ),
       )
       .then(([fqdn, version, template]) => {
-        const hash = require('../utils').generatePreviewHash(
+        const hash = generatePreviewHash(
           template.publicId,
           template.name,
           version.publicId,
@@ -180,4 +179,4 @@ module.exports = class DeployService extends ApiBaseService {
     };
     return httpRequest({ method: 'PATCH', url, data: body, headers });
   }
-};
+}

package/config/config.service.js

@@ -1,14 +1,14 @@
-const fs = require('fs');
-const { merge } = require('lodash');
-const path = require('path');
-const {
+import fs from 'node:fs';
+import path from 'node:path';
+import { merge } from 'lodash-es';
+import {
   getArgv,
   getRootDir,
   logFileCrudMessage,
   logErrorMessage,
-} = require('../utils');
+} from '../utils.js';
 
-module.exports = class ConfigService {
+export class ConfigService {
   _config = { components: {} };
 
   constructor(configFile) {
@@ -58,7 +58,7 @@ module.exports = class ConfigService {
     }
 
     try {
-      config = require(this._path);
+      config = JSON.parse(fs.readFileSync(this._path, 'utf-8'));
     } catch {
       logErrorMessage("Couldn't parse config file.");
       process.exit(1);
@@ -115,9 +115,9 @@ module.exports = class ConfigService {
 
   _sync() {
     fs.writeFileSync(this._path, `${JSON.stringify(this._config, null, 2)}\n`, {
-      encoding: 'utf8',
+      encoding: 'utf-8',
       flag: 'w',
     });
     logFileCrudMessage('UPDATE', path.basename(this._path));
   }
-};
+}

package/http-request.js

@@ -1,13 +1,17 @@
-const fs = require('fs');
-const path = require('path');
-const axios = require('axios');
-const { getRootDir, logErrorMessage } = require('./utils');
+import fs from 'node:fs';
+import path from 'node:path';
+import axios from 'axios';
+import { getRootDir, logErrorMessage } from './utils.js';
 
-module.exports = function request(options) {
+export default async function request(options) {
   const customPath = path.join(getRootDir(), 'http-request.js');
 
   if (fs.existsSync(customPath)) {
-    const customRequest = require(customPath);
+    let customRequest = await import(customPath);
+
+    if (typeof customRequest === 'object' && 'default' in customRequest) {
+      customRequest = customRequest.default;
+    }
 
     if (typeof customRequest !== 'function') {
       logErrorMessage(
@@ -29,4 +33,4 @@ module.exports = function request(options) {
   }
 
   return axios.request(options);
-};
+}

package/index.js

@@ -1,10 +1,8 @@
-module.exports = {
-  AuthService: require('./api/auth.service'),
-  DeployService: require('./api/deploy.service'),
-  ConfigService: require('./config/config.service'),
-  Server: require('./server'),
-  TemplateService: require('./template/template.service'),
-  ...require('./meta-files'),
-  ...require('./prompts'),
-  ...require('./utils'),
-};
+export { AuthService } from './api/auth.service.js';
+export { DeployService } from './api/deploy.service.js';
+export { ConfigService } from './config/config.service.js';
+export { Server } from './server/index.js';
+export { TemplateService } from './template/template.service.js';
+export * from './meta-files.js';
+export * from './prompts.js';
+export * from './utils.js';

package/meta-files.js

@@ -1,10 +1,10 @@
-const fs = require('fs');
-const fse = require('fs-extra');
-const path = require('path');
-const { watch } = require('chokidar');
-const { globSync } = require('glob');
-const { debounce, isEqual, uniqWith } = require('lodash');
-const { getRootDir } = require('./utils');
+import fs from 'node:fs';
+import fse from 'fs-extra';
+import path from 'node:path';
+import { watch } from 'chokidar';
+import { globSync } from 'glob';
+import { debounce, isEqual, uniqWith } from 'lodash-es';
+import { getRootDir } from './utils.js';
 
 const ICON_FILE_NAME = 'icon.svg';
 const MANIFEST_FILE_NAME = 'manifest.json';
@@ -20,78 +20,78 @@ const WATCH_OPTIONS = {
  * @property {String} [output] - A path relative to outputPath (default is dist/component-name).
  */
 
-module.exports = {
-  cleanDir(dir) {
-    fse.emptyDirSync(dir);
-  },
-  /**
-   * @param {Array<String | Asset>} assets
-   * @param {String} inputDir
-   * @param {String} outputDir
-   */
-  copyAssets(assets, inputDir, outputDir) {
-    _getAssetSpecs(assets, inputDir, outputDir).forEach(
-      ({ glob, input, output }) => {
-        const globFilePath = path.join(input, glob).replaceAll('\\', '/');
-        globSync(globFilePath).forEach(file => {
-          const filePath = file.slice(input.length + 1);
-          _copyFromToSync(filePath, input, output);
-        });
-      },
-    );
-  },
-  watchAssets(assets, inputDir, outputDir) {
-    const root = getRootDir();
-    return Promise.all(
-      _getAssetSpecs(assets, inputDir, outputDir).map(asset => {
-        return watch(path.join(asset.input, asset.glob), WATCH_OPTIONS).on(
-          'all',
-          (type, file) => {
-            const filePath = path
-              .join(root, file)
-              .slice(asset.input.length + 1);
-            switch (type) {
-              case 'add':
-              case 'addDir':
-              case 'change':
-              case 'changeDir':
-                _copyFromToSync(filePath, asset.input, asset.output);
-                break;
-              case 'unlink':
-              case 'unlinkDir':
-                fse.removeSync(path.join(asset.output, filePath));
-                break;
-              default:
-                break;
-            }
-          },
-        );
-      }),
-    );
-  },
-  watchInputDir(dir, watchCallback) {
-    const _debouncedCallback = debounce(() => watchCallback(), 300);
-    watch([`${dir}/**`], WATCH_OPTIONS).on('all', (_, _path) => {
-      if (
-        _path.endsWith(path.join(dir, MANIFEST_FILE_NAME)) ||
-        _path.endsWith(path.join(dir, ICON_FILE_NAME))
-      ) {
-        watchCallback(true);
-      } else {
-        _debouncedCallback();
-      }
-    });
-  },
-  writeDemoFile(tag, outputDir, outputFile) {
-    const demoFileContent = `<meta charset="utf-8">\n<title>${tag} demo</title>\n<script src="./${path.basename(
-      outputFile,
-    )}"></script>\n\n\n<${tag}></${tag}>\n\n`;
-    fs.writeFileSync(`${outputDir}/demo.html`, demoFileContent, {
-      encoding: 'utf8',
-      flag: 'w',
-    });
-  },
-};
+export function cleanDir(dir) {
+  fse.emptyDirSync(dir);
+}
+
+/**
+ * @param {Array<String | Asset>} assets
+ * @param {String} inputDir
+ * @param {String} outputDir
+ */
+export function copyAssets(assets, inputDir, outputDir) {
+  _getAssetSpecs(assets, inputDir, outputDir).forEach(
+    ({ glob, input, output }) => {
+      const globFilePath = path.join(input, glob).replaceAll('\\', '/');
+      globSync(globFilePath).forEach(file => {
+        const filePath = file.slice(input.length + 1);
+        _copyFromToSync(filePath, input, output);
+      });
+    },
+  );
+}
+
+export function watchAssets(assets, inputDir, outputDir) {
+  const root = getRootDir();
+  return Promise.all(
+    _getAssetSpecs(assets, inputDir, outputDir).map(asset => {
+      return watch(path.join(asset.input, asset.glob), WATCH_OPTIONS).on(
+        'all',
+        (type, file) => {
+          const filePath = path.join(root, file).slice(asset.input.length + 1);
+          switch (type) {
+            case 'add':
+            case 'addDir':
+            case 'change':
+            case 'changeDir':
+              _copyFromToSync(filePath, asset.input, asset.output);
+              break;
+            case 'unlink':
+            case 'unlinkDir':
+              fse.removeSync(path.join(asset.output, filePath));
+              break;
+            default:
+              break;
+          }
+        },
+      );
+    }),
+  );
+}
+
+export function watchInputDir(dir, watchCallback) {
+  const _debouncedCallback = debounce(() => watchCallback(), 300);
+  watch([`${dir}/**`], WATCH_OPTIONS).on('all', (_, _path) => {
+    if (
+      _path.endsWith(path.join(dir, MANIFEST_FILE_NAME)) ||
+      _path.endsWith(path.join(dir, ICON_FILE_NAME))
+    ) {
+      watchCallback(true);
+    } else {
+      _debouncedCallback();
+    }
+  });
+}
+
+export function writeDemoFile(tag, outputDir, outputFile) {
+  const demoFileContent = `<meta charset="utf-8">\n<title>${tag} demo</title>\n<script src="./${path.basename(
+    outputFile,
+  )}"></script>\n\n\n<${tag}></${tag}>\n\n`;
+  fs.writeFileSync(`${outputDir}/demo.html`, demoFileContent, {
+    encoding: 'utf8',
+    flag: 'w',
+  });
+}
 
 /**
  * Copies an asset file or directory from the source directory to a destination directory.

package/package.json

@@ -1,23 +1,27 @@
 {
   "name": "@ixon-cdk/core",
-  "version": "1.21.0-next.2",
+  "version": "1.22.0-next.0",
   "description": "",
+  "type": "module",
   "main": "index.js",
+  "exports": {
+    ".": "./index.js"
+  },
   "author": "",
   "license": "ISC",
   "dependencies": {
     "app-root-dir": "^1.0.2",
     "archiver": "^7.0.1",
-    "axios": "^1.11.0",
-    "chalk": "^4.1.2",
+    "axios": "^1.13.2",
+    "chalk": "^5.6.2",
     "chokidar": "^3.6.0",
     "cors": "^2.8.5",
     "crypto-js": "^4.2.0",
-    "express": "^4.19.2",
-    "fs-extra": "^11.2.0",
-    "glob": "^9.3.5",
-    "livereload": "^0.9.3",
-    "lodash": "^4.17.21",
+    "express": "^5.2.1",
+    "fs-extra": "^11.3.2",
+    "glob": "^13.0.0",
+    "livereload": "^0.10.3",
+    "lodash-es": "^4.17.21",
     "opener": "^1.5.2",
     "prompts": "^2.4.2",
     "yargs": "^17.7.2"

package/prompts.js

@@ -1,34 +1,33 @@
-module.exports = {
-  promptCompanyId(name) {
-    return {
-      type: 'text',
-      name,
-      message: 'What is the ID of your Company?',
-      validate: value => {
-        if (!value) {
-          return 'Company ID is required.';
-        }
-        if (!/^[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}$/.test(value)) {
-          return 'Invalid company ID.';
-        }
-        return true;
-      },
-    };
-  },
-  promptPageComponentTemplateId(name) {
-    return {
-      type: 'text',
-      name,
-      message: 'What is the ID of the UI Component?',
-      validate: value => {
-        if (!value) {
-          return 'UI Component ID is required.';
-        }
-        if (!/^[a-zA-Z0-9]{12}$/.test(value)) {
-          return 'Invalid UI Component ID.';
-        }
-        return true;
-      },
-    };
-  },
-};
+export function promptCompanyId(name) {
+  return {
+    type: 'text',
+    name,
+    message: 'What is the ID of your Company?',
+    validate: value => {
+      if (!value) {
+        return 'Company ID is required.';
+      }
+      if (!/^[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}$/.test(value)) {
+        return 'Invalid company ID.';
+      }
+      return true;
+    },
+  };
+}
+
+export function promptPageComponentTemplateId(name) {
+  return {
+    type: 'text',
+    name,
+    message: 'What is the ID of the UI Component?',
+    validate: value => {
+      if (!value) {
+        return 'UI Component ID is required.';
+      }
+      if (!/^[a-zA-Z0-9]{12}$/.test(value)) {
+        return 'Invalid UI Component ID.';
+      }
+      return true;
+    },
+  };
+}

package/server/index.js

@@ -1,17 +1,22 @@
-const path = require('path');
-const express = require('express');
-const cors = require('cors');
-const liveReload = require('livereload');
-const ApiBaseService = require('../api/base.service');
-const ConfigService = require('../config/config.service');
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import express from 'express';
+import cors from 'cors';
+import liveReload from 'livereload';
+import opener from 'opener';
+import { debounce } from 'lodash-es';
+import { ApiBaseService } from '../api/base.service.js';
+import { ConfigService } from '../config/config.service.js';
+import { getRootDir } from '../utils.js';
 
 const LR_PORT_DEFAULT = 35729;
 
-module.exports = class Server {
+export class Server {
   constructor(opts) {
     this._apiSrv = new ApiBaseService();
     this._configSrv = new ConfigService();
-    this._rootDir = require('../utils').getRootDir();
+    this._rootDir = getRootDir();
     this._opts = {
       port: 8000,
       componentBasePath: 'components',
@@ -57,30 +62,33 @@ module.exports = class Server {
       port: this._opts.liveReloadPort,
     });
     const _refresh = () => lrServer.refresh('/');
-    const _debouncedRefresh = require('lodash/debounce')(_refresh, 250);
+    const _debouncedRefresh = debounce(_refresh, 250);
     names
       .flatMap(name => [
         [path.join(this._rootDir, this._getOutput(name)), 100],
         [path.join(this._rootDir, `dist/${name}/manifest.json`), 500],
       ])
       .forEach(([filename, interval]) =>
-        require('fs').watchFile(filename, { interval }, _debouncedRefresh),
+        fs.watchFile(filename, { interval }, _debouncedRefresh),
       );
 
     // Simulator app
     let appDir;
     try {
-      appDir = path.dirname(require.resolve('@ixon-cdk/simulator'));
+      appDir = path.dirname(
+        fileURLToPath(import.meta.resolve('@ixon-cdk/simulator')),
+      );
     } catch {
-      // If require.resolve is invoked immediately after the simulator is installed, it will return
-      // a "MODULE_NOT_FOUND" error. In that case (as a fallback) we'll find the simulator app dir
-      // relative to the core module (which should have already been installed).
+      // If import.meta.resolve is invoked immediately after the simulator is installed, it will
+      // return a "MODULE_NOT_FOUND" error. In that case (as a fallback) we'll find the simulator
+      // app dir relative to the core module (which should have already been installed).
       appDir = path.join(
-        require.resolve('@ixon-cdk/core'),
+        fileURLToPath(import.meta.resolve('@ixon-cdk/core')),
         '../../simulator/dist',
       );
     }
-    app.get(`/${this._opts.componentBasePath}/*`, (req, res) => {
+    app.use(express.static(appDir));
+    app.get(`/${this._opts.componentBasePath}/*splat`, (req, res) => {
       res.sendStatus(404);
     });
     app.get(
@@ -100,8 +108,7 @@ module.exports = class Server {
         },
       });
     });
-    app.get('*.*', express.static(appDir));
-    app.all('*', (req, res) => {
+    app.all('*splat', (req, res) => {
       res.status(200).sendFile('/index.html', { root: appDir });
     });
 
@@ -120,7 +127,7 @@ module.exports = class Server {
     }
     const queryString = params.toString();
     const openUrl = `${this._getBaseUrl()}/?${queryString}`;
-    require('opener')(openUrl);
+    opener(openUrl);
     return openUrl;
   }
 
@@ -155,4 +162,4 @@ module.exports = class Server {
   _getOutputDir(name) {
     return name ? `${this._configSrv.getOutputPath()}/${name}` : null;
   }
-};
+}

package/template/template.service.js

@@ -1,18 +1,19 @@
-const fs = require('fs');
-const path = require('path');
-const prompts = require('prompts');
-
-const {
+import { execSync } from 'node:child_process';
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import prompts from 'prompts';
+import { ConfigService } from '../config/config.service.js';
+import {
   getFiles,
   getRootDir,
   ensureModule,
   logErrorMessage,
   logFileCrudMessage,
   pascalCase,
-} = require('../utils');
-const ConfigService = require('../config/config.service');
+} from '../utils.js';
 
-module.exports = class TemplateService {
+export class TemplateService {
   _configSrv = new ConfigService();
 
   _rootDir = getRootDir();
@@ -136,8 +137,8 @@ module.exports = class TemplateService {
     files.forEach(file => {
       if (/\.(jsx?|tsx?|svelte|vue)$/i.test(file)) {
         const fileContents = fs.readFileSync(file);
-        const { dependencies } = require(
-          path.join(examplesRoot, 'package.json'),
+        const { dependencies } = JSON.parse(
+          fs.readFileSync(path.join(examplesRoot, 'package.json'), 'utf-8'),
         );
         this._checkDependencies(fileContents, dependencies || {});
       }
@@ -317,7 +318,9 @@ module.exports = class TemplateService {
     if (file.interpolateContent) {
       const text = fs.readFileSync(
         path.join(
-          path.dirname(require.resolve('@ixon-cdk/templates')),
+          path.dirname(
+            fileURLToPath(import.meta.resolve('@ixon-cdk/templates')),
+          ),
           file.source,
         ),
         { encoding: 'utf-8' },
@@ -329,7 +332,9 @@ module.exports = class TemplateService {
     } else {
       fs.copyFileSync(
         path.join(
-          path.dirname(require.resolve('@ixon-cdk/templates')),
+          path.dirname(
+            fileURLToPath(import.meta.resolve('@ixon-cdk/templates')),
+          ),
           file.source,
         ),
         path.join(this._rootDir, file.dest),
@@ -341,17 +346,20 @@ module.exports = class TemplateService {
   /**
    * This script loops over a dependencies object and will check if the provided file contents is
    * importing any. When that is the case, it will first check for that package whether it could
-   * already be a depencency in your workspace. If not, the package will get installed and saved.
+   * already be a dependency in your workspace. If not, the package will get installed and saved.
    */
   _checkDependencies(fileContents, dependencies) {
-    const rootDeps =
-      require(path.join(this._rootDir, 'package.json')).dependencies || {};
+    const rootPkgJsonRaw = fs.readFileSync(
+      path.join(this._rootDir, 'package.json'),
+      'utf-8',
+    );
+    const rootDeps = JSON.parse(rootPkgJsonRaw).dependencies || {};
     Object.keys(dependencies).forEach(pkg => {
       const matcher = new RegExp(`^\\s*import.*\\s['"]${pkg}\\S*['"]`, 'gm');
       if (matcher.test(fileContents) && !(pkg in rootDeps)) {
         const version = dependencies[pkg];
         console.log(`Installing package '${pkg}'...`);
-        require('child_process').execSync(`npm i ${pkg}@${version} --save`);
+        execSync(`npm i ${pkg}@${version} --save`);
       }
     });
   }
@@ -370,7 +378,7 @@ module.exports = class TemplateService {
    * This script will find and replace the component class definition and the arguments for the
    * custom element define method in a static input file.
    *
-   * Given the example input file has the follwing contents:
+   * Given the example input file has the following contents:
    *
    * ```js
    * class PctExample extends HTMLElement {
@@ -420,7 +428,9 @@ module.exports = class TemplateService {
   }
 
   _discover() {
-    const dir = path.dirname(require.resolve('@ixon-cdk/templates'));
+    const dir = path.dirname(
+      fileURLToPath(import.meta.resolve('@ixon-cdk/templates')),
+    );
     const files = fs.readdirSync(dir);
     const tail = ['iframe-wrapper'];
     files
@@ -485,4 +495,4 @@ module.exports = class TemplateService {
       .replace(/<%=\s*tag\s*%>/g, params.tag)
       .replace(/<%=\s*classify\(\s*tag\s*\)\s*%>/g, pascalCase(params.tag));
   }
-};
+}

package/utils.js

@@ -1,87 +1,17 @@
-const fs = require('fs');
-const fse = require('fs-extra');
-const path = require('path');
-const chalk = require('chalk');
-const { globSync } = require('glob');
-const flow = require('lodash/flow');
-const camelCase = require('lodash/camelCase');
-const upperFirst = require('lodash/upperFirst');
+import fs from 'node:fs';
+import net from 'node:net';
+import path from 'node:path';
+import { execSync } from 'node:child_process';
+import { get as getAppRootDir } from 'app-root-dir';
+import archiver from 'archiver';
+import chalk from 'chalk';
+import CryptoJS from 'crypto-js';
+import fse from 'fs-extra';
+import { globSync } from 'glob';
+import { camelCase, flow, upperFirst } from 'lodash-es';
+import yargs from 'yargs/yargs';
 
-function dirContains(dir, globPattern) {
-  const files = globSync(path.join(dir, globPattern));
-  return !!files.length;
-}
-
-function getArgv() {
-  const remain = process.argv.slice(2);
-  const { argv } = require('yargs/yargs')(remain).version(false);
-
-  return argv;
-}
-
-function getRootDir() {
-  return require('app-root-dir').get();
-}
-
-function logErrorMessage(message) {
-  console.log(chalk.redBright.bold(message));
-}
-
-function logFileCrudMessage(crud, file) {
-  switch (crud) {
-    case 'CREATE':
-    case 'UPDATE':
-      console.log(`${chalk.green(crud)} ${file}`);
-      break;
-    default:
-      break;
-  }
-}
-
-function logSuccessMessage(message) {
-  console.log(chalk.green(message));
-}
-
-function moduleExists(moduleName) {
-  let exists = true;
-  try {
-    require.resolve(moduleName);
-  } catch {
-    exists = false;
-  }
-  return exists;
-}
-
-function ensureModule(moduleName, moduleVersion = null, dev = true) {
-  if (!moduleExists(moduleName)) {
-    if (moduleName.startsWith('@ixon-cdk/')) {
-      moduleVersion = require('./package.json').version;
-    }
-    const v = moduleVersion ? '@' + moduleVersion : '';
-    console.log(`Installing package '${moduleName}${v}...`);
-    require('child_process').execSync(
-      `npm install --save${dev ? '-dev' : ''} ${moduleName}${v}`,
-    );
-  }
-}
-
-function zip(output, callback) {
-  const outputDir = path.dirname(output);
-  const zipFile = path.join(`${outputDir}.zip`);
-  const stream = fs.createWriteStream(zipFile);
-  stream.on('close', () => {
-    fse.removeSync(outputDir);
-    callback(zipFile);
-  });
-  const archive = require('archiver')('zip', { zlib: { level: 9 } });
-  archive.pipe(stream);
-  archive.directory(outputDir, path.basename(outputDir));
-  archive.finalize();
-}
-
-const pascalCase = flow(camelCase, upperFirst);
-
-function apiHttpErrorToMessage(error, exit = true) {
+export function apiHttpErrorToMessage(error, exit = true) {
   if (typeof error === 'string') {
     logErrorMessage(error);
     exit && process.exit(1);
@@ -108,7 +38,42 @@ function apiHttpErrorToMessage(error, exit = true) {
   exit && process.exit(1);
 }
 
-function generatePreviewHash(
+export function checkPortAvailable(port) {
+  return new Promise((resolve, reject) => {
+    const server = net.createServer();
+    server
+      .once('error', err => {
+        server.close();
+        return reject(err);
+      })
+      .once('listening', () => {
+        server.close();
+        return resolve(port);
+      })
+      .listen(port);
+  });
+}
+
+export function dirContains(dir, globPattern) {
+  const files = globSync(path.join(dir, globPattern));
+  return !!files.length;
+}
+
+export function ensureModule(moduleName, moduleVersion = null, dev = true) {
+  if (!moduleExists(moduleName)) {
+    if (moduleName.startsWith('@ixon-cdk/')) {
+      const modulePkgJson = JSON.parse(
+        fs.readFileSync('./package.json', 'utf-8'),
+      );
+      moduleVersion = modulePkgJson.version;
+    }
+    const v = moduleVersion ? '@' + moduleVersion : '';
+    console.log(`Installing package '${moduleName}${v}...`);
+    execSync(`npm install --save${dev ? '-dev' : ''} ${moduleName}${v}`);
+  }
+}
+
+export function generatePreviewHash(
   templateId,
   templateName,
   versionId,
@@ -123,10 +88,33 @@ function generatePreviewHash(
     vmp: versionMainPath,
   };
   const salt = 'A9qJ03jh';
-  return require('crypto-js').AES.encrypt(JSON.stringify(ref), salt).toString();
+  return CryptoJS.AES.encrypt(JSON.stringify(ref), salt).toString();
 }
 
-async function getFiles(dir) {
+export function getArgv() {
+  const remain = process.argv.slice(2);
+  const { argv } = yargs(remain).version(false);
+  return argv;
+}
+
+export function getAvailablePort() {
+  return new Promise((resolve, reject) => {
+    const server = net.createServer();
+    server
+      .once('error', err => {
+        server.close();
+        return reject(err);
+      })
+      .once('listening', () => {
+        const { port } = server.address();
+        server.close();
+        return resolve(port);
+      })
+      .listen();
+  });
+}
+
+export async function getFiles(dir) {
   const dirents = await fs.promises.readdir(dir, { withFileTypes: true });
   const files = await Promise.all(
     dirents.map(dirent => {
@@ -137,18 +125,46 @@ async function getFiles(dir) {
   return Array.prototype.concat(...files);
 }
 
-module.exports = {
-  dirContains,
-  getArgv,
-  getRootDir,
-  logErrorMessage,
-  getFiles,
-  logFileCrudMessage,
-  logSuccessMessage,
-  moduleExists,
-  ensureModule,
-  zip,
-  pascalCase,
-  apiHttpErrorToMessage,
-  generatePreviewHash,
-};
+export function getRootDir() {
+  return getAppRootDir();
+}
+
+export function logErrorMessage(message) {
+  console.log(chalk.redBright.bold(message));
+}
+
+export function logFileCrudMessage(crud, file) {
+  if (['CREATE', 'UPDATE'].includes(crud)) {
+    console.log(`${chalk.green(crud)} ${file}`);
+  }
+}
+
+export function logSuccessMessage(message) {
+  console.log(chalk.green(message));
+}
+
+export function moduleExists(moduleName) {
+  let exists = true;
+  try {
+    import.meta.resolve(moduleName);
+  } catch {
+    exists = false;
+  }
+  return exists;
+}
+
+export const pascalCase = flow(camelCase, upperFirst);
+
+export function zip(output, callback) {
+  const outputDir = path.dirname(output);
+  const zipFile = path.join(`${outputDir}.zip`);
+  const stream = fs.createWriteStream(zipFile);
+  stream.on('close', () => {
+    fse.removeSync(outputDir);
+    callback(zipFile);
+  });
+  const archive = archiver('zip', { zlib: { level: 9 } });
+  archive.pipe(stream);
+  archive.directory(outputDir, path.basename(outputDir));
+  archive.finalize();
+}