@zohodesk/client_build_tool 0.0.13-exp.5 → 0.0.14

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog and Release Notes
 
+# v0.0.14 (06-10-2025)
+
+**Feature:-**
+- Added integrity and crossorigin attributes for all the js and css files in index.html 
+
+```enableSubResourceIntegrity: true
+```
+**Adjustments:-** 
+- add ts-loader to parse tsx and ts files
+
 # v0.0.13 (02-09-2025)
 
 **Adjustments:-**

package/README.md

@@ -306,6 +306,16 @@ First Release
 - 'templates' command to create es for react library
 # Changelog and Release Notes
 
+# v0.0.14 (06-10-2025)
+
+**Feature:-**
+- Added integrity and crossorigin attributes for all the js and css files in index.html 
+
+```enableSubResourceIntegrity: true
+```
+**Adjustments:-** 
+- add ts-loader to parse tsx and ts files
+
 # v0.0.13 (02-09-2025)
 
 **Adjustments:-**

package/lib/shared/bundler/webpack/common/i18nOptionsValidator.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.validateI18nChunkSplitOptions = validateI18nChunkSplitOptions;
+exports.validateI18nIndexingOptions = validateI18nIndexingOptions;
+exports.validateI18nOptions = validateI18nOptions;
+exports.validateRequiredFields = validateRequiredFields;
+exports.validateTemplateFormat = validateTemplateFormat;
+const LOCALE_PLACEHOLDER = '[locale]';
+const REQUIRED_OPTIONS = ['jsResourcePath', 'propertiesFolderPath', 'numericMapPath'];
+
+function validateRequiredFields(options, requiredFields) {
+  const missingOptions = requiredFields.filter(opt => {
+    const value = options[opt];
+    return value === undefined || value === null || typeof value === 'string' && value.trim() === '';
+  });
+
+  if (missingOptions.length > 0) {
+    throw new Error(`[I18nOptionsValidator] Missing required i18n options: ${missingOptions.join(', ')}`);
+  }
+}
+
+function validateTemplateFormat(template, templateName) {
+  if (!template || typeof template !== 'string') {
+    throw new Error(`[I18nOptionsValidator] ${templateName} must be a non-empty string`);
+  }
+
+  if (!template.includes(LOCALE_PLACEHOLDER)) {
+    throw new Error(`[I18nOptionsValidator] ${templateName} must include ${LOCALE_PLACEHOLDER} placeholder`);
+  }
+}
+
+function validateI18nIndexingOptions(i18nOpts) {
+  if (!i18nOpts || typeof i18nOpts !== 'object') {
+    throw new Error('[I18nOptionsValidator] i18nIndexing configuration must be a valid object');
+  }
+
+  if (!i18nOpts.enable) {
+    return {
+      skipValidation: true
+    };
+  }
+
+  validateRequiredFields(i18nOpts, REQUIRED_OPTIONS);
+  const numericTemplate = i18nOpts.numericFilenameTemplate || '[locale]/numeric.i18n.js';
+  const dynamicTemplate = i18nOpts.dynamicFilenameTemplate || '[locale]/dynamic.i18n.js';
+  validateTemplateFormat(numericTemplate, 'numericFilenameTemplate');
+  validateTemplateFormat(dynamicTemplate, 'dynamicFilenameTemplate');
+
+  if (i18nOpts.singleFileTemplate) {
+    validateTemplateFormat(i18nOpts.singleFileTemplate, 'singleFileTemplate');
+  }
+
+  const includeContentHash = i18nOpts.includeContentHash;
+  const injectHtml = i18nOpts.injectI18nUrlInIndex !== undefined ? i18nOpts.injectI18nUrlInIndex : true;
+
+  if (includeContentHash && injectHtml) {
+    throw new Error('[I18nOptionsValidator] includeContentHash and injectI18nUrlInIndex cannot both be true - content hash changes filenames dynamically but HTML injection needs static filenames');
+  }
+
+  return {
+    skipValidation: false
+  };
+}
+
+function validateI18nChunkSplitOptions(chunkSplitOpts) {
+  if (!chunkSplitOpts || typeof chunkSplitOpts !== 'object') {
+    throw new Error('[I18nOptionsValidator] i18nChunkSplit configuration must be a valid object');
+  }
+
+  if (!chunkSplitOpts.chunkSplitEnable || !chunkSplitOpts.useNumericIndexing) {
+    return {
+      skipValidation: true
+    };
+  }
+
+  if (!chunkSplitOpts.jsResource) {
+    throw new Error('[I18nOptionsValidator] Missing required jsResource in i18nChunkSplit options');
+  }
+
+  if (!chunkSplitOpts.numericMapPath) {
+    throw new Error('[I18nOptionsValidator] Missing required numericMapPath in i18nChunkSplit options');
+  }
+
+  return {
+    skipValidation: false
+  };
+}
+
+function validateI18nOptions(options) {
+  if (!options || typeof options !== 'object') {
+    throw new Error('[I18nOptionsValidator] Options must be a valid object');
+  }
+
+  const hasIndexing = options.i18nIndexing && options.i18nIndexing.enable;
+  const hasChunkSplit = options.i18nChunkSplit && options.i18nChunkSplit.chunkSplitEnable && options.i18nChunkSplit.useNumericIndexing;
+
+  if (!hasIndexing && !hasChunkSplit) {
+    throw new Error('[I18nOptionsValidator] i18n validation requires either i18nIndexing to be enabled or i18nChunkSplit with useNumericIndexing');
+  }
+
+  if (hasIndexing) {
+    const result = validateI18nIndexingOptions(options.i18nIndexing);
+
+    if (result.skipValidation) {
+      throw new Error('[I18nOptionsValidator] i18nIndexing is not properly enabled');
+    }
+  }
+
+  if (hasChunkSplit) {
+    const result = validateI18nChunkSplitOptions(options.i18nChunkSplit);
+
+    if (result.skipValidation) {
+      throw new Error('[I18nOptionsValidator] i18nChunkSplit is not properly configured');
+    }
+  }
+
+  return true;
+}

package/lib/shared/bundler/webpack/custom_plugins/I18nNumericIndexPlugin/I18nGroupRuntimeModule.js

@@ -0,0 +1,199 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.I18nGroupRuntimeModule = void 0;
+
+var _webpack = require("webpack");
+
+class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
+  constructor(options) {
+    super('i18n-group-loader');
+    this.options = { ...options
+    };
+  }
+
+  generate() {
+    const {
+      customGroups,
+      chunkIdToGroupMapping,
+      localeVarName,
+      groupAssetUrls,
+      publicPathPrefix,
+      publicPathRuntimeExpression
+    } = this.options;
+    const chunkIdToGroup = chunkIdToGroupMapping || {};
+    return `
+    // I18n Group Loading Runtime
+    (function() {
+      var loadedGroups = {};
+      var chunkIdToGroup = ${JSON.stringify(chunkIdToGroup)};
+      var groupAssetUrls = ${JSON.stringify(groupAssetUrls || {})};
+      var cachedI18nBase;
+      var scriptCache = null;
+      var runtimePublicPathPrefixResolver = ${publicPathRuntimeExpression ? `function(){ try { return ${publicPathRuntimeExpression}; } catch (err) { return undefined; } }` : 'function(){ return undefined; }'};
+      var runtimePublicPathPrefix = runtimePublicPathPrefixResolver();
+      if (runtimePublicPathPrefix === undefined || runtimePublicPathPrefix === null || runtimePublicPathPrefix === '') {
+        runtimePublicPathPrefix = ${JSON.stringify(publicPathPrefix || '')};
+      }
+      if (typeof runtimePublicPathPrefix !== 'string') {
+        runtimePublicPathPrefix = runtimePublicPathPrefix != null ? String(runtimePublicPathPrefix) : '';
+      }
+
+      function ensureTrailingSlash(path) {
+        if (!path) return '';
+        return path.charAt(path.length - 1) === '/' ? path : path + '/';
+      }
+
+      runtimePublicPathPrefix = ensureTrailingSlash(runtimePublicPathPrefix);
+
+      function resolveI18nBase() {
+        if (cachedI18nBase !== undefined) {
+          return cachedI18nBase;
+        }
+
+        var base = __webpack_require__.p || '';
+        cachedI18nBase = ensureTrailingSlash(base);
+        return cachedI18nBase;
+      }
+
+      function buildI18nUrl(relativePath) {
+        if (!relativePath) {
+          return runtimePublicPathPrefix || resolveI18nBase();
+        }
+
+        var normalizedPath = relativePath;
+        if (normalizedPath.charAt(0) === '/') {
+          normalizedPath = normalizedPath.slice(1);
+        }
+
+        if (runtimePublicPathPrefix) {
+          return runtimePublicPathPrefix + normalizedPath;
+        }
+
+        var base = resolveI18nBase();
+        return base + normalizedPath;
+      }
+
+      function loadI18nGroup(groupName, loadReason) {
+        if (loadedGroups[groupName]) {
+          return Promise.resolve();
+        }
+
+        var locale = ${localeVarName} || 'en_US';
+        var groupConfig = ${JSON.stringify(customGroups)};
+        var config = groupConfig[groupName];
+
+        if (!config) {
+          return Promise.resolve();
+        }
+
+
+        return new Promise(function(resolve, reject) {
+          var relativePath;
+
+          if (groupAssetUrls[groupName] && groupAssetUrls[groupName][locale]) {
+            relativePath = groupAssetUrls[groupName][locale];
+          } else {
+            relativePath = config.filenameTemplate.replace('[locale]', locale);
+          }
+
+          var i18nUrl = buildI18nUrl(relativePath);
+
+          var script = document.createElement('script');
+          script.src = i18nUrl;
+          script.async = true;
+
+          var cleanup = function() {
+            if (script.parentNode) {
+              script.parentNode.removeChild(script);
+            }
+          };
+
+          script.onload = function() {
+            loadedGroups[groupName] = true;
+            cleanup();
+            resolve();
+          };
+
+          script.onerror = function() {
+            cleanup();
+            loadedGroups[groupName] = true;
+            resolve();
+          };
+
+          document.head.appendChild(script);
+        });
+      }
+
+      function findGroupByChunkId(chunkId) {
+        return chunkIdToGroup[chunkId];
+      }
+
+      var originalEnsureChunk = __webpack_require__.e;
+
+      if (originalEnsureChunk) {
+        __webpack_require__.e = function(chunkId) {
+          var args = arguments;
+          var self = this;
+          var groupName = findGroupByChunkId(chunkId);
+
+          if (groupName && !loadedGroups[groupName]) {
+            var i18nPromise = loadI18nGroup(groupName, 'require');
+
+            return i18nPromise.then(function() {
+              return originalEnsureChunk.apply(self, args);
+            }).catch(function(err) {
+              return originalEnsureChunk.apply(self, args);
+            });
+          } else {
+            return originalEnsureChunk.apply(this, arguments);
+          }
+        };
+      }
+
+      // Simple URL-based detection for setup pages
+      function detectGroupFromUrl() {
+        if (typeof window === 'undefined') return null;
+
+        var url = window.location.href;
+        var groupConfig = ${JSON.stringify(customGroups)};
+
+        for (var groupName in groupConfig) {
+          var config = groupConfig[groupName];
+          if (config.urlPatterns && Array.isArray(config.urlPatterns)) {
+            for (var i = 0; i < config.urlPatterns.length; i++) {
+              var pattern = config.urlPatterns[i];
+              if (url.includes(pattern)) {
+                return groupName;
+              }
+            }
+          }
+        }
+
+        return null;
+      }
+
+      function checkAndLoadGroupFromUrl() {
+        try {
+          var detectedGroup = detectGroupFromUrl();
+          if (detectedGroup && !loadedGroups[detectedGroup]) {
+            loadI18nGroup(detectedGroup, 'url-detection').catch(function(err) {
+              // Silent error handling
+            });
+          }
+        } catch (err) {
+          // Silent error handling
+        }
+      }
+
+      // Check current URL for immediate loading
+      checkAndLoadGroupFromUrl();
+    })();
+    `;
+  }
+
+}
+
+exports.I18nGroupRuntimeModule = I18nGroupRuntimeModule;

package/lib/shared/bundler/webpack/custom_plugins/I18nNumericIndexPlugin/I18nNumericIndexHtmlInjectorPlugin.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.I18nNumericIndexHtmlInjectorPlugin = void 0;
+
+var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const pluginName = 'I18nNumericIndexHtmlInjectorPlugin';
+const assetStoreKey = Symbol.for('I18nNumericIndexPluginAssets');
+
+class I18nNumericIndexHtmlInjectorPlugin {
+  constructor(options) {
+    this.options = { ...options,
+      injectI18nUrlInIndex: options.injectI18nUrlInIndex !== undefined ? options.injectI18nUrlInIndex : true,
+      includeContentHash: options.includeContentHash || false
+    };
+  }
+
+  apply(compiler) {
+    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
+      _htmlWebpackPlugin.default.getHooks(compilation).beforeAssetTagGeneration.tapAsync(pluginName, (hookData, cb) => {
+        if (!this.options.injectI18nUrlInIndex) {
+          return cb(null, hookData);
+        }
+
+        const {
+          assets
+        } = hookData;
+        const {
+          outputFolder = 'i18n-chunk',
+          numericFilenameTemplate,
+          dynamicFilenameTemplate,
+          singleFileTemplate,
+          htmlTemplateLabel,
+          singleFile,
+          i18nAssetsPublicPathPrefix = ''
+        } = this.options;
+        const newI18nAssetUrlsToAdd = [];
+        const emittedAssetNames = compilation.getAssets().map(asset => asset.name);
+        const recordedAssets = compilation[assetStoreKey] || [];
+
+        const resolveAssetPath = (template, fileType) => {
+          if (!template) return null;
+          const recorded = recordedAssets.find(asset => {
+            if (fileType === 'single') return !asset.fileType;
+            return asset.fileType === fileType;
+          });
+
+          if (recorded) {
+            const assetPath = recorded.outputPath.replace(recorded.locale, htmlTemplateLabel);
+            return i18nAssetsPublicPathPrefix + assetPath;
+          }
+
+          const filePath = template.replace(/\[locale\]/g, htmlTemplateLabel);
+          const fullPath = filePath.includes(outputFolder) || filePath.startsWith('/') ? filePath : _path.default.join(outputFolder, filePath);
+
+          if (emittedAssetNames.includes(fullPath)) {
+            return i18nAssetsPublicPathPrefix + fullPath;
+          }
+
+          if (fullPath.includes('[contenthash]')) {
+            const pattern = fullPath.replace('[contenthash]', '*');
+            const matchingAsset = emittedAssetNames.find(name => name.startsWith(pattern.split('*')[0]) && name.endsWith(pattern.split('*')[1]));
+
+            if (matchingAsset) {
+              return i18nAssetsPublicPathPrefix + matchingAsset;
+            }
+          }
+
+          return i18nAssetsPublicPathPrefix + fullPath;
+        };
+
+        if (singleFile) {
+          const combinedFilename = resolveAssetPath(singleFileTemplate, 'single');
+
+          if (combinedFilename) {
+            newI18nAssetUrlsToAdd.push(combinedFilename);
+          }
+        } else {
+          const numericFilename = resolveAssetPath(numericFilenameTemplate, 'numeric');
+
+          if (numericFilename) {
+            newI18nAssetUrlsToAdd.push(numericFilename);
+          }
+
+          const dynamicFilename = resolveAssetPath(dynamicFilenameTemplate, 'dynamic');
+
+          if (dynamicFilename) {
+            newI18nAssetUrlsToAdd.push(dynamicFilename);
+          }
+        }
+
+        if (newI18nAssetUrlsToAdd.length > 0) {
+          assets.js = [...newI18nAssetUrlsToAdd, ...assets.js];
+        }
+
+        return cb(null, hookData);
+      });
+    });
+  }
+
+}
+
+exports.I18nNumericIndexHtmlInjectorPlugin = I18nNumericIndexHtmlInjectorPlugin;