@zohodesk/react-cli 1.1.18-exp.1 → 1.1.18-exp.2

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/readI18nValues.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.readI18nValues = readI18nValues;
-
-var _propertiesUtils = require("./utils/propertiesUtils");
-
-// gethere i18n keys and values
-function readI18nValues({
-  jsResource,
-  propertiesFolder,
-  disableDefault
-}) {
-  const jsResourceI18nKeys = jsResource ? (0, _propertiesUtils.getPropertiesAsJSON)(jsResource) : {};
-  const allI18nObject = (0, _propertiesUtils.getAllI18n)({
-    folderPath: propertiesFolder,
-    disableDefault,
-    jsResourceI18nKeys
-  }); // initialize base data's and plugis
-
-  const locales = Object.keys(allI18nObject);
-  return {
-    jsResourceI18nKeys,
-    allI18nObject,
-    locales
-  };
-}

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/templateFileName.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.templateFileName = templateFileName;
-
-var _templateHashHelpers = require("./templateHashHelpers");
-
-function templateFileName({
-  compiler,
-  compilation,
-  dynamicFilename,
-  locale,
-  chunks,
-  contentHashes
-}) {
-  const {
-    webpack
-  } = compiler;
-  const {
-    Template,
-    RuntimeGlobals
-  } = webpack;
-  const MODULE_TYPE = 'text/mini-i18n';
-  const {
-    mapExpr,
-    mapExprWithLength
-  } = (0, _templateHashHelpers.templateHashHelpers)(chunks); // "i18n-chunk/[locale]/[name].[chunkhash].js"
-
-  const i18nURLPathTemplate = compilation.getPath(JSON.stringify(dynamicFilename).replace(/\[locale\]/gi, '"+ locale +"'), {
-    hash: `" + ${RuntimeGlobals.getFullHash}() + "`,
-    hashWithLength: length => `" + ${RuntimeGlobals.getFullHash}().slice(0, ${length}) + "`,
-    chunk: {
-      id: '" + chunkId + "',
-      hash: mapExpr(c => c.renderedHash),
-      hashWithLength: mapExprWithLength(c => c.renderedHash),
-      name: mapExpr(c => c.name || c.id),
-      contentHash: {
-        [MODULE_TYPE]: mapExpr(c => contentHashes[c.id])
-      },
-      contentHashWithLength: {
-        [MODULE_TYPE]: mapExprWithLength(c => contentHashes[c.id])
-      }
-    },
-    contentHashType: MODULE_TYPE
-  });
-  return Template.asString([`var locale = ${JSON.stringify(locale)};`, `${RuntimeGlobals.require}.miniI18nF = function(chunkId){return (${i18nURLPathTemplate})}`]);
-}

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/templateHashHelpers.js

@@ -1,77 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.templateHashHelpers = templateHashHelpers;
-
-/**
- * this function will be used for chunk name, chunk hash, contentHash
- * in these, sometime chunk name and chunk id same for some chunkss so below logic has little towek
- * @param {Chunk} chunks
- * @returns { mapExpr, mapExprWithLength }
- */
-function templateHashHelpers(chunks) {
-  /**
-   * @param {function(Chunk): string | number} fn function from chunk to value
-   * @returns {string} code with static mapping of results of fn
-   */
-  const createMap = fn => {
-    const obj = {};
-    let useId = false;
-    let lastKey;
-    let entries = 0; // eslint-disable-next-line no-restricted-syntax
-
-    for (const c of chunks) {
-      const value = fn(c);
-
-      if (value === c.id) {
-        useId = true;
-      } else {
-        obj[c.id] = value;
-        lastKey = c.id;
-        entries++;
-      }
-    }
-
-    if (entries === 0) {
-      return 'chunkId';
-    }
-
-    if (entries === 1) {
-      return useId ? `(chunkId === ${JSON.stringify(lastKey)} ? ${JSON.stringify(obj[lastKey])} : chunkId)` : JSON.stringify(obj[lastKey]);
-    }
-
-    return useId ? `(${JSON.stringify(obj)}[chunkId] || chunkId)` : `${JSON.stringify(obj)}[chunkId]`;
-  };
-  /**
-   * @param {function(Chunk): string | number} fn function from chunk to value
-   * @returns {string} code with static mapping of results of fn for including in quoted string
-   */
-
-
-  const mapExpr = fn => `" + ${createMap(fn)} + "`;
-  /**
-   * @param {function(Chunk): string | number} fn function from chunk to value
-   * @returns {function(number): string} function which generates code with static mapping of results of fn for including in quoted string for specific length
-   */
-
-
-  const mapExprWithLength = fn => length => // console.log('called with lentch', length),
-  `" + ${createMap(c => `${fn(c)}`.slice(0, length))} + "`;
-
-  return {
-    mapExpr,
-    mapExprWithLength
-  };
-}
-/**
-  function mapExpr(fn) {
-    const obj = {};
-    // eslint-disable-next-line no-restricted-syntax
-    for (const c of chunks) {
-      obj[c.id] = fn(c);
-    }
-    return `(${JSON.stringify(obj)})[chunkId]`;
-  }
- */

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/utils/collectI18nKeys.js

@@ -1,63 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.collectI18nKeysfromAST = collectI18nKeysfromAST;
-exports.collectI18nKeysfromComments = collectI18nKeysfromComments;
-
-var _estreeWalker = require("estree-walker");
-
-// const { walk } = require('estree-walker');
-function collectI18nKeysfromAST(ast, allI18n) {
-  let i18nKeys = {};
-  (0, _estreeWalker.walk)(ast, {
-    enter: function (node) {
-      if (node.type === 'Literal') {
-        if ((node.raw[0] === '\'' || node.raw[0] === '"') && Object.hasOwnProperty.call(allI18n, node.value)) {
-          i18nKeys[node.value] = allI18n[node.value];
-        }
-      }
-    }
-  });
-  return Object.keys(i18nKeys);
-}
-
-const prefixI18nComment = 'I18N';
-const prefixI18nComment1 = 'dynamic-i18n-key';
-
-function getI18nKeysFromComment(comment) {
-  let commentString = comment.value.trim();
-  let i18nKeyStr;
-
-  if (commentString.startsWith(prefixI18nComment)) {
-    i18nKeyStr = commentString.slice(prefixI18nComment.length).trim();
-  } else if (commentString.startsWith(prefixI18nComment1)) {
-    i18nKeyStr = commentString.slice(prefixI18nComment1.length).trim();
-  }
-
-  if (!i18nKeyStr) {
-    return [];
-  }
-
-  const i18nKeys = i18nKeyStr.split(',');
-  return i18nKeys;
-} // export function fromComments(comments, allI18n) {
-
-
-function collectI18nKeysfromComments(comments, allI18n) {
-  // TODO: need to implement
-  let i18nKeys = {};
-
-  for (let comment of comments) {
-    let keys = getI18nKeysFromComment(comment);
-
-    for (let key of keys) {
-      if (key && allI18n[key]) {
-        i18nKeys[key] = allI18n[key];
-      }
-    }
-  }
-
-  return Object.keys(i18nKeys);
-}

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/utils/hashUtils.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.REGEXP_CONTENTHASH = void 0;
-exports.hasContentHash = hasContentHash;
-// export const REGEXP_CHUNKHASH = /\[chunkhash(?::(\d+))?\]/gi;
-// export const REGEXP_HASH = /\[hash(?::(\d+))?\]/gi;
-// export const REGEXP_NAME = /\[name\]/gi;
-// export const REGEXP_PLACEHOLDERS = /\[(name|id|chunkhash)\]/gi;
-// TODO: want to choose file type for i18n load
-const REGEXP_CONTENTHASH = /\[contenthash(?::(\d+))?\]/gi;
-exports.REGEXP_CONTENTHASH = REGEXP_CONTENTHASH;
-
-function hasContentHash(filenameTemplate) {
-  REGEXP_CONTENTHASH.lastIndex = 0;
-  return REGEXP_CONTENTHASH.test(filenameTemplate);
-}

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/utils/index.js

@@ -1,31 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _collectI18nKeys = require("./collectI18nKeys");
-
-Object.keys(_collectI18nKeys).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _collectI18nKeys[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _collectI18nKeys[key];
-    }
-  });
-});
-
-var _propertiesUtils = require("./propertiesUtils");
-
-Object.keys(_propertiesUtils).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _propertiesUtils[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _propertiesUtils[key];
-    }
-  });
-});

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/I18nSplitPlugin/utils/propertiesUtils.js

@@ -1,127 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getAllI18n = getAllI18n;
-exports.getPropertiesAsJSON = getPropertiesAsJSON;
-exports.jsonToString = jsonToString;
-
-var _fs = require("fs");
-
-var _path = require("path");
-
-function isComment(line) {
-  return line[0] === '#';
-}
-
-function getPropertiesAsJSON(filePath) {
-  try {
-    const data = (0, _fs.readFileSync)(filePath);
-    const source = data.toString();
-    const i18nObj = {};
-    source.split(/\r?\n\r?/).forEach(fline => {
-      const line = fline.trim();
-
-      if (!line || isComment(line)) {
-        return;
-      }
-
-      const ind = line.indexOf('=');
-      const key = line.slice(0, ind).replace(/\\ /g, ' ');
-      const value = line.slice(ind + 1);
-
-      if (key && value) {
-        i18nObj[key] = value;
-      }
-    }, {});
-    return i18nObj;
-  } catch (err) {
-    return {};
-  }
-} // TODO: need to make it as custom option and  dynamic
-
-
-function getLang(file) {
-  const underScoreIndex = file.indexOf('_');
-  let language = 'en_US';
-
-  if (underScoreIndex !== -1) {
-    language = file.substring(underScoreIndex + 1);
-    language = language.slice(0, language.indexOf('.'));
-  }
-
-  return language;
-}
-
-function getAllI18n({
-  folderPath,
-  disableDefault,
-  jsResourceI18nKeys,
-  exclude = /^[^_]+$/,
-  include = /\.properties$/
-}) {
-  try {
-    const files = (0, _fs.readdirSync)(folderPath, 'utf8');
-    const allLangI18n = {};
-    const context = (0, _path.join)(process.cwd(), folderPath);
-    files.forEach(file => {
-      const filePath = (0, _path.join)(context, file);
-
-      if (exclude.test(filePath) || !include.test(filePath)) {
-        return;
-      }
-
-      const i18n = getPropertiesAsJSON(filePath);
-      allLangI18n[getLang(file)] = disableDefault ? i18n : { ...jsResourceI18nKeys,
-        ...i18n
-      };
-    });
-    return allLangI18n;
-  } catch (err) {
-    console.log(err);
-    return {};
-  }
-}
-
-function jsonToString(json, keySeperator) {
-  let str = '{';
-  const keys = Object.keys(json);
-  keys.forEach((key, i) => {
-    const value = json[key];
-
-    if (!value) {
-      return;
-    }
-
-    str += `"${keySeperator ? key.replace(/(\.|\\(\s+))/g, keySeperator) : key}":"${value.replace(/.?"/g, match => {
-      if (match[0] === '\\') {
-        return match;
-      }
-
-      if (match.length === 2) {
-        return `${match[0]}\\${match[1]}`;
-      }
-
-      return `\\${match}`;
-    }).replace(/(\r\n|\n|\r)/g, '')}"`;
-
-    if (i !== keys.length - 1) {
-      str += ',';
-    }
-  });
-  str += '}';
-  return str;
-}
-/**
- * not useable due to special charector
- * 
-      return `{${Object.keys(data).map(key =>  `"${key}": "${data[key]}"`).join(",")}}`
-      // return JSON.stringify(data);
-      let str = "{";
-      for (const key of Object.keys(data)) {
-        str+= `"${key}": "${data[key]}",`
-      }
-      str+="}";
-      return str;
- */

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/RTLSplitPlugin.js

@@ -1 +0,0 @@
-"use strict";

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/RtlSplitPlugin/OverwriteCssPathForRTL.js

@@ -1,63 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
-
-var _JavascriptModulesPlugin = _interopRequireDefault(require("webpack/lib/javascript/JavascriptModulesPlugin"));
-
-var _replaceCssDirTemplate = require("./replaceCssDirTemplate");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// const HtmlWebpackPlugin = require('html-webpack-plugin');
-// import { JavascriptModulesPlugin } from 'webpack';
-const pluginName = 'OverwriteCssPathForRTL';
-
-class OverwriteCssPathForRTL {
-  constructor(options = {
-    dirVarName: 'document.dir'
-  }) {
-    this.dirVarName = options.dirVarName || 'document.dir';
-    this.templateLabel = options.templateLabel || '{{--dir}}';
-  }
-
-  overwriteCssPathinHTML(compilation) {
-    // NOTE: need to reconsider It is not working as expected
-    _htmlWebpackPlugin.default.getHooks(compilation).beforeAssetTagGeneration.tapAsync(pluginName, (data, cb) => {
-      const {
-        assets
-      } = data;
-      cb(null, { ...data,
-        assets: { ...assets,
-          css: assets.css && (0, _replaceCssDirTemplate.replaceCssDirTemplateMapper)(assets.css, this.templateLabel)
-        }
-      });
-    });
-  }
-
-  overwriteCssPathinRequireEnsure(compilation, compiler) {
-    const {
-      RawSource
-    } = compiler.webpack.sources;
-
-    _JavascriptModulesPlugin.default.getCompilationHooks(compilation).renderMain.tap(pluginName, source => {
-      const templateText = `"+(${this.dirVarName} === "rtl" ? ".rtl": ".ltr")+"`;
-      const replacedStr = source.source().replace(/\[dir\]/g, templateText);
-      return new RawSource(replacedStr);
-    });
-  }
-
-  apply(compiler) {
-    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-      this.overwriteCssPathinHTML(compilation);
-      this.overwriteCssPathinRequireEnsure(compilation, compiler);
-    });
-  }
-
-}
-
-exports.default = OverwriteCssPathForRTL;

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/RtlSplitPlugin/RtlCssPlugin.js

@@ -1,89 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RtlCssPlugin = void 0;
-
-var _path = _interopRequireDefault(require("path"));
-
-var _webpack = require("webpack");
-
-var _OverwriteCssPathForRTL = _interopRequireDefault(require("./OverwriteCssPathForRTL"));
-
-var _RTLSplitPlugin = require("../../custom_postcss_loaders/RTLSplitPlugin");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// import HtmlWebpackPlugin from 'html-webpack-plugin';
-// import rtlcss from 'rtlcss';
-const pluginName = 'RtlCssPlugin';
-
-const isCss = filename => _path.default.extname(filename) === '.css';
-
-const isDirRelatedCss = filename => filename.includes('[dir]');
-
-class RtlCssPlugin {
-  constructor(options = {}) {
-    /**
-     * @typedef {Object} Options
-     * @property  {String} dirVarName
-     * @property  {Boolean} sourcemap
-     * @property  {Object} config
-     */
-    this.options = {
-      // dirVarName: options.dirVarName || 'document.dir',
-      sourcemap: options.sourcemap,
-      config: options.config
-    };
-    this.templateLabel = options.templateLabel || '{{--dir}}';
-    this.dirVarName = options.dirVarName || 'document.dir';
-    this.rtlSplitOptions = {
-      disableMinifySelector: options.disableMinifySelector
-    };
-  }
-
-  apply(compiler) {
-    const {
-      RawSource
-    } = compiler.webpack.sources;
-    new _OverwriteCssPathForRTL.default({
-      templateLabel: this.templateLabel,
-      dirVarName: this.dirVarName
-    }).apply(compiler); // const { filename, sourcemap, config } = this.options;
-    // const { devtool } = compiler.options;
-    // const postcssOptions = {
-    //   map: (sourcemap === undefined && !!devtool) || !!sourcemap
-    // };
-
-    compiler.hooks.compilation.tap(pluginName, compilation => {
-      // compilation.hooks.shouldGenerateChunkAssets.tap(pluginName, (...args) => {
-      //   console.log('shouldGenerateChunkAssets', args);
-      // });
-      compilation.hooks.processAssets.tap({
-        name: pluginName,
-        stage: _webpack.Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_SIZE,
-        additionalAssets: true
-      }, assets => {
-        Object.keys(assets).filter(isCss).filter(isDirRelatedCss).forEach(chunkFilename => {
-          const {
-            source: asset
-          } = compilation.getAsset(chunkFilename);
-          const sourceStr = asset.source();
-          const {
-            ltr,
-            rtl
-          } = (0, _RTLSplitPlugin.separateRtlAndLtr)(sourceStr, this.rtlSplitOptions);
-          const ltrFilename = chunkFilename.replace('[dir]', 'ltr');
-          const rtlFilename = chunkFilename.replace('[dir]', 'rtl');
-          compilation.deleteAsset(chunkFilename);
-          compilation.emitAsset(ltrFilename, new RawSource(ltr));
-          compilation.emitAsset(rtlFilename, new RawSource(rtl));
-        });
-      });
-    });
-  }
-
-}
-
-exports.RtlCssPlugin = RtlCssPlugin;

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/RtlSplitPlugin/RtrSplit.md

@@ -1,34 +0,0 @@
-# RTL Split
-
-we are doing in build time generating rtl related css code by using @zohodesk/postcss-rt npm.
-It was automated, That postcss plugin create rtl reacted css and put them into same file, with css selector [dir=rtl] and ltr realted css with [dir=ltr].
-Here is problem mostly no one need rtl and ltr related css at the same time in browser,
-we are try to split them by [dir] and load which type of css is needed.
-For this purpose we created RTL Split Plugin
-
-# To Try it out rtl-ltr split
-
-### how to use this feature?
-
-to use this feature use have give the below oprtions
-`package.json`
-
-```json
-{
-  /// ...some things
-  "react-cli": {
-    //  ...some things
-    "css": {
-      "plugins": {
-        "rtlSplit": {
-          "enableRTLSplit": true,
-          "templateLabel": "{{--dir}}", // this is for html template css file path dir template
-          "disableMinifySelector": false,
-          "dirVarName": "document.dir" // this will be used for download css based on dir
-        }
-      }
-    }
-    //  ...some things
-  }
-}
-```

package/packages/client_build_tool/lib/shared/bundler/webpack/custom_plugins/RtlSplitPlugin/replaceCssDirTemplate.js

@@ -1,15 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.replaceCssDirTemplate = replaceCssDirTemplate;
-exports.replaceCssDirTemplateMapper = replaceCssDirTemplateMapper;
-
-function replaceCssDirTemplate(filePath, cssDirTemplate) {
-  return filePath.replace('[dir]', cssDirTemplate);
-}
-
-function replaceCssDirTemplateMapper(assets, cssDirTemplate) {
-  return assets.map(filePath => replaceCssDirTemplate(filePath, cssDirTemplate));
-}