feat(custom-element): new es build module

.gitignore

@@ -5,6 +5,7 @@ packages/*/build/
 packages/*/examples/*/build/
 packages/*/scss
 es
+es-custom
 lib
 dist
 umd

packages/ibm-products-web-components/package.json

@@ -15,6 +15,7 @@
   "files": [
     "custom-elements.json",
     "es/**/*",
+    "es-custom/**/*",
     "lib/**/*",
     "scss/**/*"
   ],
@@ -24,6 +25,7 @@
   },
   "exports": {
     "./es/*": "./es/*",
+    "./es-custom/*": "./es-custom/*",
     "./lib/*": "./lib/*",
     "./dist/*": "./dist/*",
     "./scss/*": "./scss/*",

packages/ibm-products-web-components/tasks/build.js

@@ -21,6 +21,7 @@ import path from 'path';
 import postcss from 'postcss';
 import typescript from '@rollup/plugin-typescript';
 import json from '@rollup/plugin-json';
+import fs from 'fs-extra';
 
 import * as packageJson from '../package.json' assert { type: 'json' };
 
@@ -55,14 +56,8 @@ async function build() {
   };
 
   const formats = [
-    {
-      type: 'esm',
-      directory: 'es',
-    },
-    {
-      type: 'commonjs',
-      directory: 'lib',
-    },
+    { type: 'esm', directory: 'es' },
+    { type: 'commonjs', directory: 'lib' },
   ];
 
   for (const format of formats) {
@@ -90,6 +85,8 @@ async function build() {
       sourcemap: true,
     });
   }
+
+  await postBuild();
 }
 
 const banner = `/**
@@ -131,9 +128,7 @@ function getRollupConfig(input, rootDir, outDir, iconInput) {
         mainFields: ['jsnext', 'module', 'main'],
         extensions: ['.js', '.ts'],
       }),
-      commonjs({
-        include: [/node_modules/],
-      }),
+      commonjs({ include: [/node_modules/] }),
       litSCSS({
         includePaths: [
           path.resolve(__dirname, '../node_modules'),
@@ -147,13 +142,7 @@ function getRollupConfig(input, rootDir, outDir, iconInput) {
           ).css;
         },
       }),
-      typescript({
-        noEmitOnError: true,
-        compilerOptions: {
-          rootDir,
-          outDir,
-        },
-      }),
+      typescript({ noEmitOnError: true, compilerOptions: { rootDir, outDir } }),
     ],
   };
 }
@@ -162,3 +151,30 @@ build().catch((error) => {
   console.log(error);
   process.exit(1);
 });
+
+async function postBuild() {
+  const sourceDir = path.resolve(__dirname, '../es');
+
+  if (sourceDir) {
+    const targetDir = path.resolve(__dirname, '../es-custom');
+
+    // Copy `es` directory to `es-custom`
+    await fs.copy(sourceDir, targetDir);
+
+    // Find all files in the `es-custom` directory
+    const files = await globby([`${targetDir}/**/*`], { onlyFiles: true });
+
+    // Replace "cds" with "cds-custom" in all files
+    await Promise.all(
+      files.map(async (file) => {
+        let content = await fs.promises.readFile(file, 'utf8');
+        content = content.replace(/cds/g, 'cds-custom');
+        content = content.replace(
+          /import\s+['"]@carbon\/web-components\/es\/components\/(.*?)['"]/g,
+          "import '@carbon/web-components/es-custom/components/$1'"
+        );
+        await fs.promises.writeFile(file, content);
+      })
+    );
+  }
+}