@elliemae/pui-cli 9.0.0-next.5 → 9.0.0-next.51

package/dist/esm/testing/extended/axe-core/reporter.js

@@ -0,0 +1,30 @@
+import { printReceived } from "jest-matcher-utils";
+const colorYellow = (arg) => `\x1B[93m ${arg ?? ""} \x1B[0m`;
+const colorGrey = (arg) => `\x1B[90m ${arg ?? ""} \x1B[0m`;
+const colorBlue = (arg) => `\x1B[34m ${arg ?? ""} \x1B[0m`;
+const reporter = (violToFormat) => {
+  if (violToFormat.length === 0) return "";
+  const lineBreak = "\n\n";
+  const horizontalLine = "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500";
+  return violToFormat.map((violation) => {
+    const errorBody = violation.nodes.map((node) => {
+      const selector = node.target.join(", ");
+      const expectedText = `Expected the HTML found at $('${selector}') to have no violations:${lineBreak}`;
+      let violationHelpUrl = "";
+      if (violation.helpUrl)
+        violationHelpUrl = `You can find more information on this issue here: 
+${colorBlue(
+          violation.helpUrl
+        )}`;
+      return `${expectedText + colorGrey(node.html) + lineBreak}Received:${lineBreak}${printReceived(
+        `${violation.help} (${violation.id})`
+      )}${lineBreak}${colorYellow(
+        node.failureSummary
+      )}${lineBreak}${violationHelpUrl}`;
+    }).join(lineBreak);
+    return errorBody;
+  }).join(lineBreak + horizontalLine + lineBreak);
+};
+export {
+  reporter
+};

package/dist/esm/testing/extended/axe-core/shouldIgnoreNodeViolation.js

@@ -0,0 +1,11 @@
+const dataAttributeRegexp = /(data-[\S]*)=["']([\S]*)["']/gm;
+const shouldIgnoreNodeViolation = (node, violation) => [...node.html.matchAll(dataAttributeRegexp)].map(([fullMatch, dataKey, dataValue]) => ({
+  fullMatch,
+  dataKey,
+  dataValue
+})).some(
+  ({ dataKey, dataValue }) => dataKey === `data-axe-ignore-${violation.id}` && dataValue === "true"
+);
+export {
+  shouldIgnoreNodeViolation
+};

package/dist/esm/testing/extended/axe-core/toHaveNoViolations.js

@@ -0,0 +1,22 @@
+import { getMessageAndPass } from "./getMessageAndPass.js";
+import { shouldIgnoreNodeViolation } from "./shouldIgnoreNodeViolation.js";
+const toHaveNoViolations = {
+  toHaveNoViolations(results) {
+    const { violations } = results;
+    const finalViolations = [];
+    violations.forEach((violation) => {
+      const { nodes } = violation;
+      const newNodes = [];
+      nodes.forEach((node) => {
+        if (!shouldIgnoreNodeViolation(node, violation)) newNodes.push(node);
+      });
+      if (newNodes.length > 0) {
+        finalViolations.push({ ...violation, nodes: newNodes });
+      }
+    });
+    return { actual: violations, ...getMessageAndPass(finalViolations) };
+  }
+};
+export {
+  toHaveNoViolations
+};

package/dist/esm/testing/jest.config.cjs

@@ -57,6 +57,8 @@ const jestConfig = {
   coverageReporters: ['lcov', 'html', 'text-summary'],
   moduleDirectories: ['node_modules', 'app', 'lib'],
   moduleNameMapper: {
+    d3: '<rootDir>/node_modules/d3/dist/d3.min.js',
+    '^d3-(.*)$': '<rootDir>/node_modules/d3-$1/dist/d3-$1.min.js',
     '.*\\webpack-hmr(.[t|j]s)?$': getMockFilePath('webpack-hmr.js'),
     '.*\\.(css|scss)$': getMockFilePath('cssModule.js'),
     '.*\\.(jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|ico)$':
@@ -73,7 +75,7 @@ const jestConfig = {
   },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
   setupFilesAfterEnv: [path.resolve(__dirname, './setup-tests.js')],
-  setupFiles: ['raf/polyfill', 'whatwg-fetch'],
+  setupFiles: ['raf/polyfill', path.resolve(__dirname, './jest.polyfills.cjs')],
   testRegex: '(app|lib).*/tests/.*\\.test\\.[jt]sx?$',
   snapshotSerializers: [],
   testResultsProcessor: 'jest-sonar-reporter',
@@ -91,13 +93,15 @@ const jestConfig = {
   testEnvironmentOptions: {
     url: `http://localhost:3111${basePath}`,
     resources: 'usable',
+    customExportConditions: [''],
   },
-  testEnvironment: 'jsdom',
+  testEnvironment: path.resolve(__dirname, './ExtendedJSDomEnv.cjs'),
   watchPlugins: [
     'jest-watch-typeahead/filename',
     'jest-watch-typeahead/testname',
   ],
   testTimeout: 5000,
+  prettierPath: null,
 };
 
 if (isReactModule && jestConfig.setupFilesAfterEnv)

package/dist/esm/testing/jest.polyfills.cjs

@@ -0,0 +1,30 @@
+/**
+ * @note The block below contains polyfills for Node.js globals
+ * required for Jest to function when running JSDOM tests.
+ * These HAVE to be require's and HAVE to be in this exact
+ * order, since "undici" depends on the "TextEncoder" global API.
+ *
+ * Consider migrating to a more modern test runner if
+ * you don't want to deal with this.
+ */
+const { TextDecoder, TextEncoder } = require('node:util');
+const { ReadableStream } = require('node:stream/web');
+
+Object.defineProperties(globalThis, {
+  TextDecoder: { value: TextDecoder },
+  TextEncoder: { value: TextEncoder },
+  ReadableStream: { value: ReadableStream },
+});
+
+const { Blob, File } = require('node:buffer');
+const { fetch, Headers, FormData, Request, Response } = require('undici');
+
+Object.defineProperties(globalThis, {
+  fetch: { value: fetch, writable: true },
+  Blob: { value: Blob },
+  File: { value: File },
+  Headers: { value: Headers },
+  FormData: { value: FormData },
+  Request: { value: Request },
+  Response: { value: Response },
+});

package/dist/esm/testing/setup-test-env.js

@@ -1,7 +1,5 @@
 import { afterEach } from "vitest";
-import "jest-styled-components";
 import { cleanup } from "@testing-library/react";
-import "@testing-library/jest-dom/extend-expect";
 afterEach(() => {
   cleanup();
 });

package/dist/esm/testing/setup-tests.js

@@ -1,8 +1,7 @@
-import "core-js/stable";
 import "regenerator-runtime/runtime";
-import "@testing-library/jest-dom/extend-expect";
-import jestAxe from "jest-axe";
+import "@testing-library/jest-dom/jest-globals";
 import ResizeObserver from "resize-observer-polyfill";
+import { toHaveNoViolations } from "./extended/axe-core";
 import { addMatchMedia } from "./mocks/matchMedia.js";
 import { logger } from "./mocks/pui-diagnostics.js";
 const originalError = console.error;
@@ -24,23 +23,19 @@ console.error = (...args) => {
     return false;
   return originalError(...args);
 };
-if (expect)
-  expect.extend(jestAxe.toHaveNoViolations);
+if (expect) expect.extend(toHaveNoViolations);
 const addElementToBody = (element) => {
   const documentEle = (window || {}).document;
-  if (!documentEle)
-    return null;
+  if (!documentEle) return null;
   const bodyEle = documentEle.body;
   const newEle = documentEle.createElement(...element);
-  if (!newEle)
-    return null;
+  if (!newEle) return null;
   bodyEle.appendChild(newEle);
   return newEle;
 };
 const addRootElement = (id) => {
   const rootEle = addElementToBody("div");
-  if (rootEle)
-    rootEle.id = id;
+  if (rootEle) rootEle.id = id;
 };
 addRootElement("root");
 addMatchMedia();
@@ -49,3 +44,26 @@ window.emui = {
   logger: logger(),
   _BASE_PATH: new URL(document.baseURI).pathname
 };
+let showCorejsWarn = false;
+afterAll(() => {
+  if (showCorejsWarn) {
+    console.warn(
+      `IMPORTANT: Try importing core-js/stable in your failed test files and retrying.
+Some tests might have failed because of it`
+    );
+  }
+});
+const originalTest = global.test;
+global.it = (name, fn, timeout = void 0) => {
+  const fnWrapper = async () => {
+    try {
+      await fn();
+    } catch (error) {
+      showCorejsWarn = true;
+      throw error;
+    }
+  };
+  originalTest(name, fnWrapper, timeout);
+};
+global.it.skip = originalTest.skip;
+global.it.only = originalTest.only;

package/dist/esm/testing/vitest.config.js

@@ -2,26 +2,26 @@ import path from "node:path";
 import { fileURLToPath } from "node:url";
 import { defineConfig, configDefaults } from "vitest/config";
 import react from "@vitejs/plugin-react";
+import tsconfigPaths from "vite-tsconfig-paths";
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const vitestConfig = defineConfig({
-  plugins: [react()],
+  plugins: [react(), tsconfigPaths()],
   test: {
     globals: true,
     root: process.cwd(),
-    environment: "jsdom",
+    environment: "happy-dom",
     setupFiles: [path.resolve(__dirname, "./setup-test-env.js")],
     include: ["./{app,lib}/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
     exclude: [...configDefaults.exclude, ".idea", ".git", ".cache", "e2e"],
-    // watchIgnore: [
-    //   '.*\\/node_modules\\/.*',
-    //   '.*\\/build\\/.*',
-    //   '.*\\/dist\\/.*',
-    // ],
     coverage: {
       reportsDirectory: "./reports/coverage"
     },
     deps: {
-      inline: [/app.config.json/]
+      optimizer: {
+        web: {
+          include: ["app.config.json", "@elliemae/pui-app-sdk"]
+        }
+      }
     }
   }
 });

package/dist/esm/transpile/.swcrc

@@ -6,6 +6,6 @@
       "tsx": true,
       "dynamicImport": true
     },
-    "target": "es2020"
+    "target": "es2022"
   }
 }

package/dist/esm/transpile/esbuild.js

@@ -1,15 +1,40 @@
 import path from "node:path";
 import { fileURLToPath } from "node:url";
-import fg from "fast-glob";
-import { build } from "esbuild";
 import { writeFile, copyFile, readFile, mkdir } from "node:fs/promises";
 import browserslistToEsbuild from "browserslist-to-esbuild";
+import fg from "fast-glob";
+import { build } from "esbuild";
 import lodashTransformer from "esbuild-plugin-lodash";
+const readPkgJson = async () => {
+  const pkgJsonPath = path.join(process.cwd(), "package.json");
+  const pkgJson = JSON.parse(await readFile(pkgJsonPath, "utf8"));
+  return pkgJson;
+};
+const writePkgJson = async (pkgJson) => {
+  const pkgJsonPath = path.join(process.cwd(), "package.json");
+  await writeFile(pkgJsonPath, JSON.stringify(pkgJson, null, 2));
+};
+const removeModuleType = async () => {
+  const pkgJson = await readPkgJson();
+  const prevModuleType = pkgJson.type;
+  if (pkgJson.type) {
+    delete pkgJson.type;
+    await writePkgJson(pkgJson);
+  }
+  return prevModuleType;
+};
+const restoreModuleType = async (typeValue) => {
+  if (typeValue) {
+    const pkgJson = await readPkgJson();
+    pkgJson.type = typeValue;
+    await writePkgJson(pkgJson);
+  }
+};
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const TARGETS = {
   browserslist: browserslistToEsbuild(),
-  web: "es2020",
-  node: "node18"
+  web: "es2022",
+  node: "node20"
 };
 const ESBUILD_FORMAT = {
   CJS: "cjs",
@@ -77,16 +102,24 @@ const esBuild = async ({
   if (!esmOnly) {
     const cjsOutdir = `${outdir}/cjs`;
     const commonJSEntryPoints = await fg(inputFiles);
-    await build({
-      entryPoints: commonJSEntryPoints,
-      ...getCommonConfig({ injectReactShim }),
+    const typeValue = await removeModuleType();
+    try {
+      await build({
+        entryPoints: commonJSEntryPoints,
+        ...getCommonConfig({ injectReactShim }),
+        outdir: cjsOutdir,
+        format: ESBUILD_FORMAT.CJS,
+        target,
+        plugins: [lodashTransformer()]
+      });
+    } finally {
+      await restoreModuleType(typeValue);
+    }
+    await copyFiles({ srcdir, outdir: cjsOutdir });
+    await createPackageJson({
       outdir: cjsOutdir,
-      format: ESBUILD_FORMAT.CJS,
-      target,
-      plugins: [lodashTransformer()]
+      type: NODE_MODULE_TYPES.CJS
     });
-    await copyFiles({ srcdir, outdir: cjsOutdir });
-    await createPackageJson({ outdir: cjsOutdir, type: NODE_MODULE_TYPES.CJS });
   }
   const esmOutdir = esmOnly ? outdir : `${outdir}/esm`;
   const entryPoints = await fg(

package/dist/esm/update-notifier.js

@@ -1,6 +1,6 @@
-import updateNotifier from "update-notifier";
 import path from "node:path";
 import fs from "node:fs/promises";
+import updateNotifier from "update-notifier";
 const notifyUpdates = async () => {
   const pkgFile = await fs.readFile(path.join(process.cwd(), "./package.json"));
   const pkg = JSON.parse(pkgFile);

package/dist/esm/utils.js

@@ -1,6 +1,6 @@
 import fs from "node:fs";
 import path from "node:path";
-const basePath = (process.env.BASE_PATH || "/").replace(/\/?$/, "/");
+const basePath = (process.env.BASE_PATH ?? "/").replace(/\/?$/, "/");
 const isApp = () => fs.existsSync(path.join(process.cwd(), "app"));
 const getAppConfig = () => {
   const appConfigPath = path.join(
@@ -8,8 +8,7 @@ const getAppConfig = () => {
     isApp() ? "app" : "lib",
     "app.config.json"
   );
-  if (!fs.existsSync(appConfigPath))
-    return "{}";
+  if (!fs.existsSync(appConfigPath)) return "{}";
   const appConfig = fs.readFileSync(appConfigPath);
   return appConfig || "{}";
 };

package/dist/esm/webpack/helpers.js

@@ -1,8 +1,8 @@
 import path from "node:path";
 import fs from "node:fs";
+import zlib from "zlib";
 import _ from "lodash";
 import CompressionPlugin from "compression-webpack-plugin";
-import zlib from "zlib";
 import { findMonoRepoRoot } from "../monorepo/utils.js";
 import { basePath, getAppConfig } from "../utils.js";
 let pathSep = path.sep;
@@ -16,9 +16,8 @@ const excludeNodeModulesExcept = (modules) => {
   const moduleRegExps = getNodeModulesRegEx(modules);
   return function(modulePath) {
     if (/node_modules/.test(modulePath)) {
-      for (let i = 0; i < moduleRegExps.length; i += 1)
-        if (moduleRegExps[i].test(modulePath))
-          return false;
+      for (const moduleRegExp of moduleRegExps)
+        if (moduleRegExp.test(modulePath)) return false;
       return true;
     }
     return false;
@@ -32,7 +31,7 @@ const getLibraryName = () => {
   const modifiedLibName = `emui-${libraryName.replace("@elliemae/", "").replace("pui-", "")}`;
   return _.camelCase(modifiedLibName);
 };
-const getLibraryVariableName = () => (process.env.LIBRARY_VARIABLE_NAME || getLibraryName()).split(".");
+const getLibraryVariableName = () => (process.env.LIBRARY_VARIABLE_NAME ?? getLibraryName()).split(".");
 const mapToFolder = (dependencies, folder) => dependencies.reduce(
   (acc, dependency) => ({
     [dependency]: path.resolve(`${folder}/${dependency.replace("$", "")}`),
@@ -41,7 +40,7 @@ const mapToFolder = (dependencies, folder) => dependencies.reduce(
   {}
 );
 const getAlias = () => {
-  const monorepoRoot = findMonoRepoRoot(process.cwd()) || "";
+  const monorepoRoot = findMonoRepoRoot(process.cwd()) ?? "";
   return mapToFolder(
     [
       "@babel/runtime",
@@ -55,6 +54,8 @@ const getAlias = () => {
       "styled-components",
       "immer",
       "react-dates",
+      "react-select",
+      "react-spring",
       "react-transition-group",
       "@elliemae/pui-cli",
       "@elliemae/pui-app-sdk$",
@@ -63,6 +64,15 @@ const getAlias = () => {
     path.join(monorepoRoot, "./node_modules")
   );
 };
+const getLibraryAlias = (name, alias) => {
+  const monorepoRoot = findMonoRepoRoot(process.cwd()) ?? "";
+  const aliasPath = path.resolve(
+    `${path.join(monorepoRoot, "./node_modules")}/${alias}`
+  );
+  return {
+    [name]: aliasPath
+  };
+};
 const modulesToTranspile = [
   "@elliemae/pui-*",
   "@elliemae/ds-*",
@@ -75,8 +85,7 @@ const getUserMonitoringFileName = () => {
     process.cwd(),
     "node_modules/@elliemae/pui-user-monitoring/dist/public/js"
   );
-  if (!fs.existsSync(userMonLibPath))
-    return `${libName}.js`;
+  if (!fs.existsSync(userMonLibPath)) return `${libName}.js`;
   const distJSFiles = fs.readdirSync(userMonLibPath);
   return distJSFiles.filter(
     (fName) => fName.match(/emuiUserMonitoring+((?!chunk).)*\.js$/)
@@ -88,8 +97,7 @@ const getAppLoaderFileName = () => {
     process.cwd(),
     "node_modules/@elliemae/pui-app-loader/dist/public/js"
   );
-  if (!fs.existsSync(appLoaderLibPath))
-    return `${libName}.js`;
+  if (!fs.existsSync(appLoaderLibPath)) return `${libName}.js`;
   const distJSFiles = fs.readdirSync(appLoaderLibPath);
   return distJSFiles.filter(
     (fName) => fName.match(/emuiAppLoader+((?!chunk).)*\.js$/)
@@ -101,8 +109,7 @@ const getDiagnosticsFileName = () => {
     process.cwd(),
     "node_modules/@elliemae/pui-diagnostics/dist/public/js"
   );
-  if (!fs.existsSync(libPath))
-    return `${libName}.js`;
+  if (!fs.existsSync(libPath)) return `${libName}.js`;
   const distJSFiles = fs.readdirSync(libPath);
   return distJSFiles.filter(
     (fName) => fName.match(/emuiDiagnostics+((?!chunk).)*\.js$/)
@@ -114,18 +121,16 @@ const getENCWLoaderFileName = () => {
     process.cwd(),
     "node_modules/@elliemae/encw-loader/dist/public/js"
   );
-  if (!fs.existsSync(appLoaderLibPath))
-    return `${libName}.js`;
+  if (!fs.existsSync(appLoaderLibPath)) return `${libName}.js`;
   const distJSFiles = fs.readdirSync(appLoaderLibPath);
   return distJSFiles.filter(
     (fName) => fName.match(/emuiEncwLoader+((?!chunk).)*\.js$/)
   )[0];
 };
 const getAppVersion = () => {
-  if (!process.env.APP_VERSION)
-    return LATEST_VERSION;
+  if (!process.env.APP_VERSION) return LATEST_VERSION;
   const match = process.env.APP_VERSION.match(/^v?(\d+\.\d+)\..*$/);
-  return match && match[1] || LATEST_VERSION;
+  return match?.[1] ?? LATEST_VERSION;
 };
 const getPaths = (latestVersion = true) => {
   const version = latestVersion ? LATEST_VERSION : getAppVersion();
@@ -160,9 +165,9 @@ const getCompressionPlugins = (isLibrary = false) => {
   ];
   const commonConfig = {
     test: /\.(js|css)$/,
-    exclude: !isLibrary ? excludeList : [],
     // we are compressing all files since in aws cloudfront edge lambda, we don't want to whitelist files that are not compressed due to below limits
-    minRatio: Infinity
+    minRatio: Infinity,
+    ...!isLibrary ? { exclude: excludeList } : {}
   };
   return [
     new CompressionPlugin({
@@ -202,6 +207,7 @@ export {
   getAlias,
   getAppVersion,
   getCompressionPlugins,
+  getLibraryAlias,
   getLibraryName,
   getLibraryVariableName,
   getMediaPath,

package/dist/esm/webpack/webpack.base.babel.js

@@ -102,14 +102,16 @@ const plugins = [
         noErrorOnMissing: true,
         globOptions: {
           ignore: ["readme.md"]
-        }
+        },
+        info: { minimized: true }
       },
       {
         from: "webroot",
         noErrorOnMissing: true,
         globOptions: {
           ignore: ["readme.md"]
-        }
+        },
+        info: { minimized: true }
       }
     ])
   }),
@@ -118,7 +120,7 @@ const plugins = [
     fileName: "./latest/manifest.json",
     publicPath: "",
     map: (file) => {
-      file.name = file.name.replace(/^latest\//, "");
+      file.name = file.name.replace(/^latest(\/|\\)/, "");
       return file;
     }
   }),
@@ -257,36 +259,20 @@ const baseConfig = (options) => ({
     mainFields: ["browser", "module", "main"],
     alias: {
       ...getAlias(),
-      ...(options.resolve || {}).alias || {}
+      ...options.resolve?.alias ?? {}
     }
   },
+  externalsPresets: {
+    web: true
+  },
   externals: {
     "@elliemae/pui-user-monitoring": "emuiUserMonitoring",
     "@elliemae/pui-app-loader": "emuiAppLoader",
-    "@elliemae/pui-diagnostics": "emuiDiagnostics",
-    react: "emuiAppReactDependencies.react",
-    "react-dom": "emuiAppReactDependencies.reactDOM",
-    "@reduxjs/toolkit": "emuiAppReactDependencies.rtk",
-    axios: "emuiAppReactDependencies.axios.default",
-    dompurify: "emuiAppReactDependencies.dompurify",
-    history: "emuiAppReactDependencies.history",
-    immer: "emuiAppReactDependencies.immer",
-    invariant: "emuiAppReactDependencies.invariant",
-    "pubsub-js": "emuiAppReactDependencies.pubsubjs",
-    "react-aria-live": "emuiAppReactDependencies.reactAriaLive",
-    "react-helmet": "emuiAppReactDependencies.reactHelmet",
-    "react-hook-form": "emuiAppReactDependencies.reactHookForm",
-    "react-redux": "emuiAppReactDependencies.reactRedux",
-    "react-router-dom": "emuiAppReactDependencies.reactRouterDOM",
-    reduxInjectors: "emuiAppReactDependencies.reduxInjectors",
-    reselect: "emuiAppReactDependencies.reselect",
-    // "styled-components": "emuiAppReactDependencies.styledComponents",
-    "styled-system": "emuiAppReactDependencies.styledSystem"
-    // "@xstyled/styled-components": "emuiAppReactDependencies.xstyled",
+    "@elliemae/pui-diagnostics": "emuiDiagnostics"
   },
-  devtool: options.devtool || "eval-source-map",
-  performance: options.performance || {},
-  devServer: options.devServer || {}
+  devtool: options.devtool ?? "eval-source-map",
+  performance: options.performance ?? {},
+  devServer: options.devServer ?? {}
 });
 export {
   baseConfig

package/dist/esm/webpack/webpack.dev.babel.js

@@ -14,6 +14,8 @@ import {
   isGoogleTagManagerEnabled
 } from "./helpers.js";
 import { baseConfig } from "./webpack.base.babel.js";
+import { wsPort } from "../server/utils.js";
+import { createWSServer } from "../server/wsServer.js";
 const __filename = fileURLToPath(import.meta.url);
 const {
   appVersion,
@@ -68,7 +70,7 @@ const devConfig = {
   // Add development plugins
   plugins: [
     new HtmlWebpackPlugin({
-      inject: !isAppLoaderEnabled(),
+      inject: !isAppLoaderEnabled() ? "head" : false,
       // Inject all files that are generated by webpack, e.g. bundle.js
       template: !isAppLoaderEnabled() ? "app/index.html" : "app/index-app-loader.html",
       emui: {
@@ -80,7 +82,8 @@ const devConfig = {
         diagnosticsScriptPath,
         encwLoaderScriptPath,
         googleTagManager: isGoogleTagManagerEnabled()
-      }
+      },
+      scriptLoading: "defer"
     }),
     new CircularDependencyPlugin({
       exclude: /a\.(js|ts|jsx|tsx)|node_modules/,
@@ -113,7 +116,7 @@ const devConfig = {
     },
     hot: true,
     open: [basePath],
-    port: process.env.PORT || "auto",
+    port: process.env.PORT ?? "auto",
     setupMiddlewares: (middlewares, devServer) => {
       if (devServer.app) {
         setupDefaultMiddlewares(devServer.app);
@@ -130,6 +133,13 @@ const devConfig = {
           }
           next();
         });
+        createWSServer({
+          port: wsPort
+        }).then(({ wsServer }) => {
+          if (devServer.app) devServer.app.locals.wsServer = wsServer;
+        }).catch((err) => {
+          console.error(err);
+        });
       }
       return middlewares;
     }

package/dist/esm/webpack/webpack.lib.base.babel.js

@@ -57,14 +57,22 @@ const baseConfig = (options) => ({
   output: {
     clean: true,
     path: path.resolve(process.cwd(), "dist/umd"),
+    filename: "[name].js",
+    chunkFilename: "[name].[chunkhash].chunk.js",
+    assetModuleFilename: "assets/[name].[hash][ext][query]",
     publicPath: "auto",
     library: {
       name: getLibraryVariableName(),
-      type: "umd"
+      type: "var"
+      // type: 'module',
     },
+    // module: true,
     ...options.output
   },
   // Merge with env dependent settings
+  // experiments: {
+  //   outputModule: true,
+  // },
   optimization: options.optimization,
   module: {
     rules: [
@@ -112,6 +120,7 @@ const baseConfig = (options) => ({
             loader: "postcss-loader",
             options: {
               postcssOptions: {
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-call
                 plugins: [PostcssPresetEnv({ autoprefixer: { grid: true } })]
               },
               sourceMap: true
@@ -177,7 +186,7 @@ const baseConfig = (options) => ({
     mainFields: ["browser", "module", "main"],
     alias: {
       ...getAlias(),
-      ...(options.resolve || {}).alias || {}
+      ...options.resolve?.alias ?? {}
     },
     plugins: [new ResolveTypeScriptPlugin({})]
   },
@@ -186,9 +195,9 @@ const baseConfig = (options) => ({
     "@elliemae/pui-app-loader": "emuiAppLoader",
     "@elliemae/pui-diagnostics": "emuiDiagnostics"
   },
-  devtool: options.devtool || "eval-source-map",
-  performance: options.performance || {},
-  devServer: options.devServer || {}
+  devtool: options.devtool ?? "eval-source-map",
+  performance: options.performance ?? {},
+  devServer: options.devServer ?? {}
 });
 export {
   baseConfig