@zohodesk/react-cli 0.0.1-exp.169.1 → 0.0.1-exp.175.0

package/lib/pluginUtils/getDevPlugins.js

@@ -15,10 +15,6 @@ var _lodashWebpackPlugin = _interopRequireDefault(require("lodash-webpack-plugin
 
 var _miniCssExtractPlugin = _interopRequireDefault(require("mini-css-extract-plugin"));
 
-var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
-
-var _htmlWebpackInjectAttributesPlugin = _interopRequireDefault(require("html-webpack-inject-attributes-plugin"));
-
 var _I18nSplitPlugin = _interopRequireDefault(require("../plugins/I18nSplitPlugin"));
 
 var _RequireVariablePublicPlugin = _interopRequireDefault(require("../plugins/RequireVariablePublicPlugin"));
@@ -29,14 +25,14 @@ var _webpack = _interopRequireDefault(require("webpack"));
 
 var _plugins = require("../plugins");
 
-var _common = require("../common");
-
 var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
 
+var _configHtmlWebpackPlugins = require("./configHtmlWebpackPlugins");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-let getDevPlugins = (options, publicPath) => {
-  let {
+const getDevPlugins = (options, publicPath) => {
+  const {
     app: {
       tpFolder,
       folder,
@@ -68,7 +64,7 @@ let getDevPlugins = (options, publicPath) => {
   const hasEFC = newOptionForEnableEFC || prevOptionForEnableEFC;
   const cssLTRFileNameTempalte = enableRTLSplit ? 'css/[name].ltr.css' : 'css/[name].css';
   const cssRTLFileNameTempalte = 'css/[name].rtl.css';
-  let plugins = [new _plugins.CleanUpStatsPlugin(), new _caseSensitivePathsWebpackPlugin.default(), new _webpack.default.IgnorePlugin(/^\.\/domain$/, /moment$/), new _webpack.default.DefinePlugin({
+  const plugins = [new _plugins.CleanUpStatsPlugin(), new _caseSensitivePathsWebpackPlugin.default(), new _webpack.default.IgnorePlugin(/^\.\/domain$/, /moment$/), new _webpack.default.DefinePlugin({
     __CLIENT__: true,
     __TEST__: false,
     __SERVER__: false,
@@ -126,7 +122,7 @@ let getDevPlugins = (options, publicPath) => {
       propertiesFolder: i18n.propertiesFolder
     }));
   } else {
-    let i18nPath = _path.default.join(process.cwd(), context, 'i18n');
+    const i18nPath = _path.default.join(process.cwd(), context, 'i18n');
 
     if (_fs.default.existsSync(i18nPath)) {
       plugins.push(new _copyWebpackPlugin.default([{
@@ -146,20 +142,16 @@ let getDevPlugins = (options, publicPath) => {
     collections: true,
     shorthands: true
   }));
+  (0, _configHtmlWebpackPlugins.configHtmlWebpackPlugins)(plugins, {
+    enableChunkHash: false,
+    folder,
+    minify: false,
+    inject,
+    crossorigin,
+    hasEFC
+  });
 
   if (hasEFC) {
-    plugins.push(new _htmlWebpackPlugin.default({
-      chunksSortMode: 'none',
-      filename: 'index.html',
-      template: _path.default.join(process.cwd(), folder, 'index.html'),
-      excludeChunks: ['efc', 'widget'],
-      templateParameters: _common.templateParameters,
-      scriptLoading: 'defer',
-      inject: inject
-    }));
-    crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
-      crossorigin: 'anonymous'
-    }));
     plugins.push(new _plugins.EFCPlugin({
       isDevelopment: true,
       i18nManifestFileName,
@@ -171,18 +163,6 @@ let getDevPlugins = (options, publicPath) => {
       localeAttr: efcLocaleAttr // outputFile: 'zohodesk-efc-sdk-latest.js',
 
     }));
-  } else {
-    plugins.push(new _htmlWebpackPlugin.default({
-      chunksSortMode: 'none',
-      filename: 'index.html',
-      template: _path.default.join(process.cwd(), folder, 'index.html'),
-      templateParameters: _common.templateParameters,
-      scriptLoading: 'defer',
-      inject: inject
-    }));
-    crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
-      crossorigin: 'anonymous'
-    }));
   }
 
   plugins.push(new _plugins.I18NInjectIntoIndexPlugin({

package/lib/pluginUtils/getProdPlugins.js

@@ -21,24 +21,22 @@ var _miniCssExtractPlugin = _interopRequireDefault(require("mini-css-extract-plu
 
 var _I18nSplitPlugin = _interopRequireDefault(require("../plugins/I18nSplitPlugin"));
 
-var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
-
-var _htmlWebpackInjectAttributesPlugin = _interopRequireDefault(require("html-webpack-inject-attributes-plugin"));
-
 var _copyWebpackPlugin = _interopRequireDefault(require("copy-webpack-plugin"));
 
 var _plugins = require("../plugins");
 
-var _common = require("../common");
-
 var _RtlCssPlugin = require("../plugins/RtlSplitPlugin/RtlCssPlugin");
 
+var _configHtmlWebpackPlugins = require("./configHtmlWebpackPlugins");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // eslint-disable-next-line no-unused-vars
-let getProdPlugins = (options, publicPath = '') => {
+const getProdPlugins = (options, publicPath = '') => {
   let {
-    enableChunkHash,
+    enableChunkHash
+  } = options.app;
+  const {
     manifestFileName,
     bundleAnalyze,
     optimize,
@@ -56,13 +54,15 @@ let getProdPlugins = (options, publicPath = '') => {
     hasShadowDOM,
     resourceHints,
     serviceWorker,
-    htmlTemplate: {
-      inject
-    },
+    htmlTemplate,
     tpHashMapping,
     cdnMapping,
     crossorigin
   } = options.app;
+  const {
+    inject,
+    minify: minifyHtmlOptions
+  } = htmlTemplate;
   const {
     i18n
   } = options;
@@ -79,9 +79,9 @@ let getProdPlugins = (options, publicPath = '') => {
   const hashTempalate = enableChunkHash ? '.[chunkhash:20]_' : '';
   const cssLTRFileNameTempalte = `css/[name]${hashTempalate}${enableRTLSplit ? '.ltr' : ''}.css`;
   const cssRTLFileNameTempalte = `css/[name]${hashTempalate}.rtl.css`;
-  let isDevelopment = mode === 'prod' || mode === 'dev' || mode === 'dev-no-warn';
+  const isDevelopment = mode === 'prod' || mode === 'dev' || mode === 'dev-no-warn';
   enableChunkHash = !isDevelopment && enableChunkHash;
-  let plugins = [new _caseSensitivePathsWebpackPlugin.default(), new _webpack.default.IgnorePlugin(/^\.\/locale$/, /moment$/), new _webpack.default.DefinePlugin({
+  const plugins = [new _caseSensitivePathsWebpackPlugin.default(), new _webpack.default.IgnorePlugin(/^\.\/locale$/, /moment$/), new _webpack.default.DefinePlugin({
     __TEST__: false,
     __DEVELOPMENT__: false,
     __LOCAL_PRODUCTION__: isDevelopment,
@@ -132,7 +132,7 @@ let getProdPlugins = (options, publicPath = '') => {
       propertiesFolder: i18n.propertiesFolder
     }));
   } else {
-    let i18nPath = _path.default.join(process.cwd(), context, 'i18n');
+    const i18nPath = _path.default.join(process.cwd(), context, 'i18n');
 
     if (_fs.default.existsSync(i18nPath)) {
       plugins.push(new _copyWebpackPlugin.default([{
@@ -148,21 +148,16 @@ let getProdPlugins = (options, publicPath = '') => {
     to: `./${tpFolder}/`,
     toType: 'dir'
   }]));
+  (0, _configHtmlWebpackPlugins.configHtmlWebpackPlugins)(plugins, {
+    enableChunkHash,
+    folder,
+    inject,
+    minify: minifyHtmlOptions,
+    crossorigin,
+    hasEFC
+  });
 
   if (hasEFC) {
-    plugins.push(new _htmlWebpackPlugin.default({
-      chunksSortMode: 'none',
-      filename: enableChunkHash ? 'index.[templatehash:20].html' : 'index.html',
-      template: _path.default.join(process.cwd(), folder, 'index.html'),
-      excludeChunks: ['efc', 'widget'],
-      minify: false,
-      templateParameters: _common.templateParameters,
-      scriptLoading: 'defer',
-      inject: inject
-    }));
-    crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
-      crossorigin: 'anonymous'
-    }));
     plugins.push(new _plugins.EFCPlugin({
       isDevelopment,
       serverUrl: publicPath,
@@ -175,19 +170,6 @@ let getProdPlugins = (options, publicPath = '') => {
       localeAttr: efcLocaleAttr,
       cdnVariableName: cdnMapping.isCdnEnabled ? cdnMapping.variableName : null
     }));
-  } else {
-    plugins.push(new _htmlWebpackPlugin.default({
-      chunksSortMode: 'none',
-      filename: enableChunkHash ? 'index.[templatehash:20].html' : 'index.html',
-      template: _path.default.join(process.cwd(), folder, 'index.html'),
-      minify: false,
-      templateParameters: _common.templateParameters,
-      scriptLoading: 'defer',
-      inject: inject
-    }));
-    crossorigin && plugins.push(new _htmlWebpackInjectAttributesPlugin.default({
-      crossorigin: 'anonymous'
-    }));
   }
 
   plugins.push(new _plugins.I18NInjectIntoIndexPlugin({
@@ -201,7 +183,7 @@ let getProdPlugins = (options, publicPath = '') => {
   }));
 
   if (publicPaths && !isDevelopment && !cdnMapping.isCdnEnabled) {
-    let {
+    const {
       callback
     } = publicPaths;
     plugins.push(callback ? new _plugins.PublicPathCallbackPlugin({
@@ -255,7 +237,7 @@ let getProdPlugins = (options, publicPath = '') => {
   }
 
   if (!isDevelopment && serviceWorker.enableSw) {
-    let {
+    const {
       filePath,
       fileName = 'sw.js',
       exitPath = '/',

package/lib/postcss-plugins/{ExcludeRTLPlugin.js → ExcludePlugin.js}

@@ -4,7 +4,7 @@ var _postcss = _interopRequireDefault(require("postcss"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-module.exports = _postcss.default.plugin('postcss-exclude-rtl-files', opts => {
+module.exports = _postcss.default.plugin('postcss-exclude-files', opts => {
   const {
     plugins
   } = opts;

package/lib/postcss-plugins/hoverActivePlugin.js

@@ -14,7 +14,8 @@ const hoverIgnoreQuery = 'Hover:ignore',
 const medHoverIgnoreQuery = 'MedHover:ignore',
       medActiveIgnoreQuery = 'MedActive:ignore',
       medHoverActiveIgnoreQuery = 'MedHoverActive:ignore';
-const hoverMedQuerySuffix = '(min--moz-device-pixel-ratio:0) and (hover: hover), (hover: hover)';
+let hoverMedQuerySuffix = '';
+let hoverNoneMedQuerySuffix = '';
 const ruleIgnoreCommentRegex = /(Hover:ignore|Active:ignore|HoverActive:ignore)/g;
 const mediaQueryIgnoreCommentRegex = /(MedHover:ignore|MedActive:ignore|MedHoverActive:ignore)/g;
 
@@ -32,9 +33,26 @@ function isHoverPresent(atrule) {
   return hoverPresent;
 }
 
-module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOriginal => {
+function checkForUsualClass(root, sel) {
+  let present = false;
+  sel.split(',').forEach(value => {
+    if (value.includes('hover')) {
+      const valueNoHover = value.replace(':hover', '').trim();
+      root.walkRules(rule => {
+        if (rule.selector === valueNoHover) {
+          present = true;
+        }
+      });
+    }
+  });
+  return present;
+}
+
+module.exports = _postcss.default.plugin('postcss-mobile-hover', mediaQueryHoverActiveString => rootOriginal => {
   const hoverRules = [];
-  let positionsObj = {};
+  const positionsObj = {};
+  hoverMedQuerySuffix = mediaQueryHoverActiveString.hover;
+  hoverNoneMedQuerySuffix = mediaQueryHoverActiveString.none;
 
   function isRuleHasIgnoreComment(index, type) {
     const prevNode = rootOriginal.nodes[index - 1];
@@ -72,8 +90,8 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
 
   function getPositionsOfHoverAndActiveMedQueries(parent) {
     const allNodes = rootOriginal.nodes;
-    const hoverMediaQuery = `${parent.params} and all and ${hoverMedQuerySuffix}`;
-    const hoverNoneMediaQuery = `${parent.params} and (hover: none)`;
+    const hoverMediaQuery = `${parent.params} and ${hoverMedQuerySuffix}`;
+    const hoverNoneMediaQuery = `${parent.params} and ${hoverNoneMedQuerySuffix}`;
     const positions = {
       hovMed: allNodes[positionsObj[hoverMediaQuery]],
       actMed: allNodes[positionsObj[hoverNoneMediaQuery]]
@@ -142,16 +160,16 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
     if (rule.parent.params !== undefined && !rule.parent.params.includes('hover')) {
       //console.log(hovMed, actMed);
       let newSelector = '';
-      let {
+      const {
         hovMed,
         actMed
       } = getPositionsOfHoverAndActiveMedQueries(rule.parent);
-      let hovQueries = [];
-      let actQueries = [];
+      const hovQueries = [];
+      const actQueries = [];
       rule.selector.split(/\s*,\s*/).forEach(_subrule => {
-        let subrule = _subrule.trim();
+        const subrule = _subrule.trim();
 
-        let clone = rule.clone();
+        const clone = rule.clone();
 
         if (subrule.includes('hover')) {
           clone.selector = subrule;
@@ -169,13 +187,13 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
       });
 
       if (hovQueries.length > 0) {
-        let clone = rule.clone();
+        const clone = rule.clone();
         clone.selector = hovQueries.join(',');
         hovMed.append(clone);
       }
 
       if (actQueries.length > 0) {
-        let clone = rule.clone();
+        const clone = rule.clone();
         clone.selector = actQueries.join(',');
         actMed.append(clone.clone({
           selector: clone.selector.replace(/:hover/gi, ':active')
@@ -194,7 +212,7 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
 
   function mediaQuery(rule, index) {
     if (rule.parent.params !== undefined && !rule.parent.params.includes('hover')) {
-      let {
+      const {
         hovMed,
         actMed
       } = getPositionsOfHoverAndActiveMedQueries(rule.parent);
@@ -216,9 +234,9 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
   function commaQuery(rule, index) {
     //console.log("comma" , rule.selector.split('\n'));
     let newSelector = '';
-    let hovQueries = [];
+    const hovQueries = [];
     rule.selector.split(/\s*,\s*/).forEach(_subrule => {
-      let subrule = _subrule.trim();
+      const subrule = _subrule.trim();
 
       if (subrule.includes('hover')) {
         // hoverRules.push({ rule: clone, index });
@@ -229,7 +247,7 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
     });
 
     if (hovQueries.length > 0) {
-      let clone = rule.clone();
+      const clone = rule.clone();
       clone.selector = hovQueries.join(',');
       hoverRules.push({
         rule: clone,
@@ -238,7 +256,9 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
     }
 
     if (handleHoverAndHoverActiveIgnore(index)) {
-      rule.selector = newSelector.substring(0, newSelector.length - 2).trim();
+      if (checkForUsualClass(rootOriginal, rule.selector)) {
+        rule.selector = newSelector.substring(0, newSelector.length - 2).trim();
+      }
     }
 
     if (rule.selector === '') {
@@ -248,8 +268,8 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
 
 
   rootOriginal.walkAtRules(atrule => {
-    const hoverQuery = `${atrule.params} and all and ${hoverMedQuerySuffix}`;
-    const activeQuery = `${atrule.params} and (hover: none)`;
+    const hoverQuery = `${atrule.params} and ${hoverMedQuerySuffix}`;
+    const activeQuery = `${atrule.params} and ${hoverNoneMedQuerySuffix}`;
 
     if (isHoverPresent(atrule)) {
       if (!positionsObj[hoverQuery] && !positionsObj[activeQuery]) {
@@ -308,13 +328,13 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
     // hover
     const hoverQuery = rootOriginal.append({
       name: 'media',
-      params: `all and ${hoverMedQuerySuffix}`
+      params: `${hoverMedQuerySuffix}`
     }).last; // Create a media query targetting devices that don't support hover
     // (ie. devices where we should fall back to :active instead)
 
     const activeQuery = rootOriginal.append({
       name: 'media',
-      params: '(hover: none)'
+      params: `${hoverNoneMedQuerySuffix}`
     }).last; // Loop through the hover rules and apply them to each of the media
     // queries
     // eslint-disable-next-line no-labels
@@ -355,11 +375,15 @@ module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOrigi
         hoverRule.rule.remove();
       }
     }
-  }
+  } // rootOriginal.walkAtRules(atrule => {
+  //   if (
+  //     (atrule !== undefined &&
+  //       atrule.nodes !== undefined &&
+  //       atrule.nodes.length === 0) ||
+  //     atrule.nodes === undefined
+  //   ) {
+  //     atrule.remove();
+  //   }
+  // });
 
-  rootOriginal.walkAtRules(atrule => {
-    if (atrule !== undefined && atrule.nodes !== undefined && atrule.nodes.length === 0 || atrule.nodes === undefined) {
-      atrule.remove();
-    }
-  });
 });

package/lib/postcss-plugins/variableModificationPlugin/ErrorHandler.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ErrorHandler = void 0;
+
+class ErrorHandler {
+  constructor(allowedErrs) {
+    this.errors = [];
+    this.allowedErrs = allowedErrs;
+  }
+
+  addError(errstr) {
+    this.errors.push(`{\n${errstr}\n}\n`);
+  }
+
+  errorFunction(errStr, type) {
+    const {
+      addError,
+      allowedErrs
+    } = this;
+
+    if (type === 'DECLARATION_IGNORED' && allowedErrs.DECLARATION_IGNORED) {
+      addError(errStr);
+    } else if (type === 'UNIT_ERROR' && allowedErrs.UNIT_ERROR) {
+      addError(errStr);
+    } else if (type === 'RANGE_ERROR' && allowedErrs.RANGE_ERROR) {
+      addError(errStr);
+    } else if (type === 'VARIABLE_PRESENT' && allowedErrs.VARIABLE_PRESENT) {
+      addError(errStr);
+    }
+  }
+
+}
+
+exports.ErrorHandler = ErrorHandler;