@pega/custom-dx-components 26.1.12-alpha.0.3 → 26.1.12-alpha.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/custom-dx-components",
-  "version": "26.1.12-alpha.0.3",
+  "version": "26.1.12-alpha.0.5",
   "description": "Utility for building custom UI components",
   "bin": {
     "custom-dx-components": "./bin/index.js"
@@ -37,7 +37,7 @@
     "@pega/constellation-dx-components-build-utils": "^2.0.18",
     "@pega/inquirer-fuzzy-path": "^4.0.0",
     "ajv": "^8.20.0",
-    "archiver": "^7.0.1",
+    "archiver": "^8.0.0",
     "arg": "^5.0.2",
     "chalk": "^6.0.1",
     "compression-webpack-plugin": "^12.0.0",
@@ -57,7 +57,6 @@
     "postcss": "^8.5.32",
     "postcss-loader": "8.2.1",
     "postcss-preset-env": "11.6.2",
-    "react-dev-utils": "^12.0.1",
     "resolve-url-loader": "^5.0.0",
     "sass-loader": "^17.1.0",
     "terser-webpack-plugin": "5.6.1",

package/src/tasks/build-all/helper.js

@@ -1,7 +1,8 @@
 import fs from 'fs';
 import path from 'path';
 
-import archiver from 'archiver';
+// archiver v8 has no default export; ZipArchive replaces the archiver('zip') factory.
+import { ZipArchive } from 'archiver';
 import chalk from 'chalk';
 
 import { getComponentDirectoryPath, getComponents, getPegaServerConfig, addDebugLog } from '../../util.js';
@@ -35,7 +36,7 @@ export const zipComponent = async (componentKey) => {
   const configJson = `${srcDirectory}/config.json`;
   const localizationJson = `${srcDirectory}/localizations.json`;
 
-  const archive = archiver('zip', { zlib: { level: 9 } });
+  const archive = new ZipArchive({ zlib: { level: 9 } });
   const zipChunks = [];
   archive.on('data', (chunk) => zipChunks.push(chunk));
 

package/src/tasks/build-comp/helper.js

@@ -1,7 +1,8 @@
 import fs from 'fs';
 import path from 'path';
 
-import archiver from 'archiver';
+// archiver v8 has no default export; ZipArchive replaces the archiver('zip') factory.
+import { ZipArchive } from 'archiver';
 import chalk from 'chalk';
 
 import { constructCompleteUrl, getComponentDirectoryPath, getComponents, getPegaServerConfig, getFetchAgent, getLibraryBased } from '../../util.js';
@@ -55,7 +56,7 @@ export const zipComponent = async (componentKey) => {
 
   const localizationJson = `${srcDirectory}/localizations.json`;
 
-  const archive = archiver('zip', { zlib: { level: 9 } });
+  const archive = new ZipArchive({ zlib: { level: 9 } });
   const zipChunks = [];
   archive.on('data', (chunk) => zipChunks.push(chunk));
 

package/src/tasks/bundle/builder/index.js

@@ -1,7 +1,5 @@
 import chalk from 'chalk';
 import webpack from 'webpack';
-import FileSizeReporter from 'react-dev-utils/FileSizeReporter.js';
-import printBuildError from 'react-dev-utils/printBuildError.js';
 import { getUseWebPackPromotion, addDebugLog, emptyDirSync } from '../../../util.js';
 
 import paths from './paths.js';
@@ -27,22 +25,11 @@ process.on('unhandledRejection', (err) => {
   // process.exit(1);
 });
 
-const measureFileSizesBeforeBuild = FileSizeReporter.measureFileSizesBeforeBuild;
-const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
-
-// These sizes are pretty large. We'll warn for bundles exceeding them.
-const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024;
-const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
-
 let compilationErrors = null;
 
 // Create the build and print the deployment instructions.
-function build(config, previousFileSizes, showStats = true) {
-  addDebugLog(
-    'bundle build',
-    `config: ${JSON.stringify(config)}, \npreviousFileSizes: ${JSON.stringify(previousFileSizes)}, showStats: ${showStats}`,
-    '',
-  );
+function build(config, showStats = true) {
+  addDebugLog('bundle build', `config: ${JSON.stringify(config)}, showStats: ${showStats}`, '');
 
   if (showStats) {
     console.log(`Creating a ${Env} build...`);
@@ -108,7 +95,6 @@ function build(config, previousFileSizes, showStats = true) {
 
       const resolveArgs = {
         stats,
-        previousFileSizes,
         warnings: messages.warnings,
       };
       return resolve(resolveArgs);
@@ -137,16 +123,16 @@ export default async ({ inputFile, outputFile, componentKey, externals, globals,
   }
 
   return new Promise((resolve, reject) => {
-    measureFileSizesBeforeBuild(paths.appBuild)
-      .then((previousFileSizes) => {
+    Promise.resolve()
+      .then(() => {
         // Remove all content but keep the directory so that
         // if you're in it, you don't end up in Trash
         emptyDirSync(paths.appBuild);
         // Start the webpack build
-        return build(config, previousFileSizes, showStats);
+        return build(config, showStats);
       })
       .then(
-        ({ stats, previousFileSizes, warnings }) => {
+        ({ warnings }) => {
           if (showStats) {
             if (warnings.length) {
               // console.log(chalk.yellow('Compiled with warnings.\n'), warnings[0].message);
@@ -157,9 +143,6 @@ export default async ({ inputFile, outputFile, componentKey, externals, globals,
             } else {
               console.log(chalk.green('Compiled successfully.\n'));
             }
-
-            console.log('File sizes after gzip:\n');
-            printFileSizesAfterBuild(stats, previousFileSizes, paths.appBuild, WARN_AFTER_BUNDLE_GZIP_SIZE, WARN_AFTER_CHUNK_GZIP_SIZE);
           }
 
           resolve('done emitting');
@@ -169,7 +152,7 @@ export default async ({ inputFile, outputFile, componentKey, externals, globals,
           const tscCompileOnError = process.env.TSC_COMPILE_ON_ERROR === 'true';
           if (tscCompileOnError) {
             console.log(chalk.yellow('Compiled with the following type errors (you may want to check these before deploying your app):\n'));
-            printBuildError(err);
+            console.log(err);
           } else if (compilationErrors != null) {
             if (compilationErrors.length == undefined) {
               console.log(chalk.red('Error...'), compilationErrors.message);
@@ -182,7 +165,7 @@ export default async ({ inputFile, outputFile, componentKey, externals, globals,
             // process.exit(1);
           } else {
             console.log(chalk.red('Failed to compile.\n'));
-            printBuildError(JSON.stringify(err));
+            console.log(JSON.stringify(err));
           }
         },
       )

package/src/tasks/bundle/builder/webpack.config.js

@@ -4,8 +4,6 @@ import webpack from 'webpack';
 import TerserPlugin from 'terser-webpack-plugin';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
-import getCSSModuleLocalIdent from 'react-dev-utils/getCSSModuleLocalIdent.js';
-import ModuleNotFoundPlugin from 'react-dev-utils/ModuleNotFoundPlugin.js';
 import CompressionPlugin from 'compression-webpack-plugin';
 
 import paths from './paths.js';
@@ -200,9 +198,6 @@ export default (
               use: getStyleLoaders({
                 importLoaders: 1,
                 sourceMap: isEnvProduction ? shouldUseSourceMap : isEnvDevelopment,
-                modules: {
-                  getLocalIdent: getCSSModuleLocalIdent,
-                },
               }),
             },
             // Opt-in support for SASS (using .scss or .sass extensions).
@@ -232,9 +227,6 @@ export default (
                 {
                   importLoaders: 3,
                   sourceMap: isEnvProduction ? shouldUseSourceMap : isEnvDevelopment,
-                  modules: {
-                    getLocalIdent: getCSSModuleLocalIdent,
-                  },
                 },
                 'sass-loader',
               ),
@@ -262,9 +254,6 @@ export default (
       ],
     },
     plugins: [
-      // This gives some necessary context to module not found errors, such as
-      // the requesting resource.
-      new ModuleNotFoundPlugin(paths.appPath),
       // Makes some environment variables available to the JS code, for example:
       // if (process.env.NODE_ENV === 'production') { ... }. See `./env.js`.
       // It is absolutely essential that NODE_ENV is set to production

package/src/tasks/create/index.js

@@ -27,6 +27,7 @@ import {
   getStandaloneMaxLibraryCount,
   getStandaloneMaxComponentNameCount,
   getStandaloneMaxLibraryFromPrefixCount,
+  normalizeOrganization,
 } from '../../util.js';
 import { COMPONENT_SCHEMA, SHARED_FILE_NAMES } from '../../constants.js';
 
@@ -203,6 +204,7 @@ const validateCompile = async ({ componentName, componentLabel, library, version
   if (organization == null) {
     ({ organization } = JSON.parse(fs.readFileSync(path.resolve('package.json'), 'utf8')));
   }
+  organization = normalizeOrganization(organization);
 
   const componentKey = `${organization}_${library}_${componentName}`;
   const targetDirectory = await getComponentDirectoryPath(componentKey);

package/src/tasks/export-rc/helper.js

@@ -1,7 +1,8 @@
 import chalk from 'chalk';
 import path from 'path';
 import { join } from 'path';
-import archiver from 'archiver';
+// archiver v8 has no default export; ZipArchive replaces the archiver('zip') factory.
+import { ZipArchive } from 'archiver';
 import fs from 'fs';
 import {
   addDebugLog,
@@ -200,7 +201,7 @@ export const zipComponent = async (componentKey) => {
   const configJson = `${srcDirectory}/config.json`;
   const localizationJson = `${srcDirectory}/localizations.json`;
 
-  const archive = archiver('zip', { zlib: { level: 9 } });
+  const archive = new ZipArchive({ zlib: { level: 9 } });
   const zipChunks = [];
   archive.on('data', (chunk) => zipChunks.push(chunk));
 
@@ -263,7 +264,7 @@ export const zipRC = async (content, archiveDirectory, archiveFileName) => {
   const archiveFile = join(archiveDirectory, archiveFileName);
 
   const output = fs.createWriteStream(archiveFile);
-  const archive = archiver('zip', {
+  const archive = new ZipArchive({
     zlib: { level: 9 }, // Sets the compression level.
   });
 

package/src/tasks/init/index.js

@@ -5,7 +5,7 @@ import chalk from 'chalk';
 import { execa } from 'execa';
 import { Listr, PRESET_TIMER } from 'listr2';
 import inquirer from 'inquirer';
-import { compileMustacheTemplate, isPascalCase, convertIntoPascalCase, sanitize } from '../../util.js';
+import { compileMustacheTemplate, normalizeOrganization, sanitize } from '../../util.js';
 import { getInitProjectQuestions } from './helper.js';
 import { enableAgentFiles } from '../../ai/index.js';
 
@@ -37,10 +37,7 @@ const copyProjectTemplate = async (options) => {
 
   let { organization, projectName } = options;
   projectName = sanitize(projectName).toLowerCase();
-  organization = sanitize(organization);
-  if (!isPascalCase(organization)) {
-    organization = convertIntoPascalCase(organization);
-  }
+  organization = normalizeOrganization(organization);
   options = { ...options, organization, projectName };
 
   // Compile and write package.json in one go

package/src/tasks/init/template/eslint.config.mjs

@@ -10,6 +10,10 @@ export default defineConfig([
   eslintReact.configs['recommended-typescript'],
   globalIgnores([
     '**/node_modules',
+    // generated by jest --coverage, not source
+    '**/coverage/**',
+    // buildAllComponents writes bundles to <org>_<library>/ at the project root
+    '*_*/**',
     // agent skills ship sample assets that are not part of the TypeScript project
     '.claude/**',
     'packages/*/lib',