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

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

@@ -0,0 +1,248 @@
+"use strict";
+
+const postcss = require('postcss');
+
+const fs = require('fs');
+
+const path = require('path');
+
+const errors = [];
+let allowedErrs = {};
+const convertableProps = {
+  'font-size': true,
+  margin: true,
+  'margin-left': true,
+  'margin-right': true,
+  'margin-top': true,
+  'margin-bottom': true,
+  padding: true,
+  'padding-top': true,
+  'padding-bottom': true,
+  'padding-left': true,
+  'padding-right': true,
+  width: true,
+  'min-width': true,
+  'max-width': true,
+  height: true,
+  'min-height': true,
+  'max-height': true,
+  top: true,
+  bottom: true,
+  left: true,
+  right: true
+};
+const constantValues = {
+  inherit: true,
+  initial: true,
+  auto: true,
+  'fit-content': true,
+  unset: true
+};
+
+function getNumericValue(value) {
+  if (value.includes('var')) {
+    return parseInt(value.replace(/var\(--zd_size(\d+)\)/gi, '$1').replace(/var\(--zd_font_size(\d+)\)/gi, '$1'));
+  } // Not need for this dum loop
+  // allowed.forEach(alwdUnit => {
+  //   if (value.includes(alwdUnit)) {
+  //     return parseInt(value);
+  //   }
+  // });
+
+
+  if (constantValues[value.toLowerCase()]) {
+    return 1;
+  }
+
+  return parseInt(value);
+}
+
+function pxToCalc(value) {
+  const arr = value.split(' ');
+  arr.forEach((val, index) => {
+    ['px'].forEach(unit => {
+      const valWithUnit = new RegExp(`(\\d+)${unit}`, 'gi');
+
+      if (valWithUnit.test(val)) {
+        arr[index] = val.replace(valWithUnit, '(var(--zd_size$1))');
+      }
+    });
+  });
+  return arr.join(' ');
+}
+
+const addError = errstr => {
+  errors.push(`{\n${errstr}\n}\n`);
+};
+
+const errorFunction = (errStr, type) => {
+  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);
+  }
+};
+
+const singleConvertor = (value, changeVal, details, range) => {
+  const {
+    path,
+    filename,
+    decl
+  } = details;
+
+  if (getNumericValue(value) >= range.start && getNumericValue(value) <= range.end || getNumericValue(value) === 0) {
+    let retVal = value.replace(/(\d+)px/gi, changeVal.replace('$$', '$1'));
+
+    if (/^-var/.test(retVal)) {
+      retVal = `calc( ${retVal.substring(1)} * -1 )`;
+    }
+
+    return retVal;
+  } // if(unitErrorVal && unitErrorVal != '0' ){
+  // console.log(value, 'not within range')
+
+
+  errorFunction(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${path} ,\n line : ${decl.source.start.line} ,\n message : value (${value}) (${typeof value}) not within range (${range.start},${range.end})\r`, 'RANGE_ERROR'); // }
+  // addError(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${path} ,\n line : ${decl.source.start.line} ,\n message : value (${value}) not within range (${range.start},${range.end})\r`)
+
+  return value;
+};
+
+module.exports = postcss.plugin('postcss-variable-report', cssVariableReplacementConfig => {
+  const rawdata = fs.readFileSync(cssVariableReplacementConfig);
+  const data = JSON.parse(rawdata);
+  const {
+    errorsAllowed,
+    settings: settingsObject,
+    errorLog: errorLogStatus,
+    errorInConsole: errorConsoleStatus
+  } = data; // const keys = Object.keys(settingsObject);
+
+  fs.writeFileSync('./css_error.log', '');
+  allowedErrs = errorsAllowed;
+  const replacementArray = [];
+  Object.keys(settingsObject).forEach(key => {
+    Object.values(settingsObject[key].replacements).forEach(val => {
+      if (!replacementArray.includes(val)) {
+        replacementArray.push(val);
+      }
+    });
+  });
+  let regValStr = '';
+  replacementArray.forEach((val, index) => {
+    if (index !== replacementArray.length - 1) {
+      regValStr += `${val.replace('$$', '\\d+').replace('(', '\\(').replace(')', '\\)')}|`;
+    } else {
+      regValStr += `${val.replace('$$', '\\d+').replace('(', '\\(').replace(')', '\\)')}`;
+    }
+  });
+  const valRegex = new RegExp(regValStr, 'gi');
+  return rootOriginal => {
+    rootOriginal.walkRules(rule => {
+      // rule.nodes[-1] = {}
+      // need map, forEach fine less memory
+      rule.nodes.forEach((decl, position) => {
+        // case font-size
+        const commentStr = 'variable:ignore';
+        const prevNode = rule.nodes[position - 1];
+        const fromPath = rootOriginal.source.input.from; // this will be problem for linux and mac use require('path').sep
+        // split not need use slice and lastIndexOf less memory
+
+        const filename = fromPath.split(path.sep).pop();
+
+        if (prevNode && prevNode.type === 'comment' && prevNode.text.toLowerCase().includes(commentStr)) {
+          const errStr = ` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${fromPath} ,\n line : ${decl.source.start.line} ,\n message : Declaration Ignored \r`;
+          errorFunction(errStr, 'DECLARATION_IGNORED');
+          return;
+        }
+
+        if (settingsObject[decl.prop] && !decl.value.includes('var(--')) {
+          const settings = settingsObject[decl.prop]; // console.log(settings)
+
+          const {
+            allowed,
+            range
+          } = settings; // suggestion filter  !decl.value.includes('calc')
+          // Reason below some of logic happen based on this
+
+          const unit = decl.value.toString() // no need round braket since you do not need group for less memory
+          .replace(/\d+/gi, '').replace('var(--zd_size)', 'px').replace('var(--zd_font_size)', 'px').split(' ').filter(x => x !== ''); // unit = unit.replace(unit, unit.replace('-',''))
+          // console.log('unit : ');
+          // console.log(unit);
+
+          unit.forEach((val, index) => {
+            allowed.forEach(alwdVal => {
+              if (val.includes(alwdVal)) {
+                // ## for what purpose
+                unit[index] = val.replace(`-${alwdVal}`, `${alwdVal}`).replace(`-.${alwdVal}`, `${alwdVal}`);
+              }
+            });
+          });
+          let unitError = false;
+          let unitErrorVal = '';
+          unit.forEach(val => {
+            if (!val.includes('calc')) {
+              if (!allowed.includes(val.toString())) {
+                unitError = true;
+                unitErrorVal = val;
+              }
+            }
+          }); // console.log(allowed, replacements, range)
+
+          if (!unitError) {
+            // use variable decl.value.split(' ')
+            if (range) {
+              // console.log('multiple :', decl.value)
+              let newVal = '';
+              decl.value.split(' ').forEach(singleVal => {
+                newVal += `${singleConvertor(singleVal, settings.replacements.px, {
+                  decl,
+                  filename,
+                  path: fromPath
+                }, range)} `;
+              });
+              decl.value = newVal;
+            }
+          } else {
+            if (!decl.value.includes('calc')) {
+              // addError(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${path} ,\n line : ${decl.source.start.line} ,\n unit : ${unitErrorVal} ,\n message : ${unitErrorVal} (Unit) Not Allowed \r`);
+              errorFunction(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${fromPath} ,\n line : ${decl.source.start.line} ,\n unit : ${unitErrorVal} ,\n message : ${unitErrorVal} (Unit) Not Allowed \r`, 'UNIT_ERROR');
+            } else {
+              decl.value = pxToCalc(decl.value);
+            }
+          }
+        } else {
+          if (decl.prop && decl.value && !decl.prop.includes('--') && valRegex.test(decl.value) && (settingsObject[decl.prop] || convertableProps[decl.prop]) && decl.value.includes('var') && !decl.value.includes('calc')) {
+            errorFunction(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${fromPath} ,\n line : ${decl.source.start.line} ,\n message : value (${decl.value}) has var in it, kindly check`, 'VARIABLE_PRESENT');
+          }
+        }
+      });
+    }); // console.log(filename)
+    // console.log('Done!')
+    // console.log('----------------------------------------------------------------------------------------------------------------------')
+
+    if (errorLogStatus) {
+      fs.writeFileSync('./css_error.log', '');
+
+      if (errors.length > 0) {
+        errors.forEach(err => {
+          fs.appendFileSync('./css_error.log', err);
+        }); // console.log('----------------------------------------------------------------------------------------------------------------------')
+      }
+    }
+
+    if (errorConsoleStatus) {
+      if (errors.length > 0) {
+        errors.forEach(err => {
+          // fs.appendFileSync('./css_error.log', err);
+          console.log(err);
+        });
+        console.log('----------------------------------------------------------------------------------------------------------------------');
+      }
+    }
+  };
+});

package/lib/postcss-plugins/variableModifier.js

@@ -0,0 +1,244 @@
+"use strict";
+
+const postcss = require('postcss');
+
+const path = require('path');
+
+const fs = require('fs');
+
+function populateArray(start, end) {
+  let temp = [];
+
+  for (var i = start; i < end; i++) {
+    temp.push(i);
+  }
+
+  return temp;
+}
+
+let allwdVars = {
+  'font-size': ['px', 'em']
+};
+let numberObject = {
+  'font-size': {
+    allowed: ['px', 'em'],
+    replacements: {
+      px: 'var(--zd_font_size$$)',
+      em: 'var(--zd_font_size$$em)'
+    },
+    //[5,10,15,20,25],
+    available: populateArray(0, 251),
+    replacementValues: {
+      px: [],
+      em: []
+    }
+  },
+  'margin': {
+    allowed: ['px'],
+    replacements: {
+      px: 'var(--zd_size$$)'
+    },
+    available: populateArray(-250, 251),
+    replacementValues: {
+      px: []
+    }
+  },
+  'margin-left': {
+    allowed: ['px'],
+    replacements: {
+      px: 'var(--zd_size$$)'
+    },
+    available: populateArray(-250, 251),
+    replacementValues: {
+      px: []
+    }
+  },
+  'margin-right': {
+    allowed: ['px'],
+    replacements: {
+      px: 'var(--zd_size$$)'
+    },
+    available: populateArray(-250, 251),
+    replacementValues: {
+      px: []
+    }
+  },
+  'margin-top': {
+    allowed: ['px'],
+    replacements: {
+      px: 'var(--zd_size$$)'
+    },
+    available: populateArray(-250, 251),
+    replacementValues: {
+      px: []
+    }
+  },
+  'margin-bottom': {
+    allowed: ['px'],
+    replacements: {
+      px: 'var(--zd_size$$)'
+    },
+    available: populateArray(-250, 251),
+    replacementValues: {
+      px: []
+    }
+  }
+};
+
+function hasIgnoreComment(node) {
+  return node ? node.type == 'comment' ? node.text == 'Variable:Ignore' ? true : false : false : false;
+}
+
+let errors = [];
+module.exports = postcss.plugin('postcss-variable-report', () => rootOriginal => {
+  // console.log('inside postcss plugin')
+  // fs.writeFile('./css_error.log', '\r\nLog File: \r\n\r\n', (err) => {
+  //    if(err)console.log(err);
+  // });
+  // console.log(rootOriginal.source.input.file);
+  if (!rootOriginal.source.input.file.includes('css_error')) {
+    rootOriginal.walkRules(rule => {
+      rule.walkDecls((decl, position) => {
+        // case font-size
+        if (!hasIgnoreComment(rule.nodes[position - 1])) {
+          console.log(settings);
+          let unit = decl.value.replace(/[0-9]/g, '');
+          let settings = numberObject[decl.prop];
+          let path = rootOriginal.source.input.from;
+          let filename = path.split('\\');
+          filename = filename[filename.length - 1];
+
+          if (decl.prop === 'font-size' || decl.prop === 'margin-left' || decl.prop === 'margin-right' || decl.prop === 'margin-top' || decl.prop === 'margin-bottom') {
+            let {
+              allowed,
+              replacements,
+              available
+            } = settings;
+
+            if (!rootOriginal.source.input.from.includes('node_modules')) {
+              if (unit != 0) {
+                if (allowed.includes(unit)) {
+                  // console.log(available, parseInt(decl.value))
+                  if (available.includes(parseInt(decl.value))) {
+                    // replacementValues[unit].push({[decl.value] : replacements[unit].replace('$$', parseInt(decl.value))})
+                    decl.value = replacements[unit].replace('$$', parseInt(decl.value)); //console.log("replacements:")
+                  } else {
+                    let err = {
+                      prop: decl.prop,
+                      value: decl.value,
+                      filename,
+                      filepath: rootOriginal.source.input.from,
+                      line: decl.source.start.line,
+                      unit,
+                      message: 'value not available consider others'
+                    };
+                    errors.push(err);
+                  }
+                } else {
+                  let err = {
+                    prop: decl.prop,
+                    value: decl.value,
+                    filename,
+                    filepath: rootOriginal.source.input.from,
+                    line: decl.source.start.line,
+                    unit,
+                    message: 'Unit not supported'
+                  };
+                  errors.push(err);
+                }
+              }
+            }
+          } else if (decl.prop === 'margin') {
+            let {
+              allowed,
+              replacements,
+              available
+            } = settings; //console.log(decl.prop + "  " + decl.value)
+
+            let valArr = decl.value.split(' '); //console.log(valArr)
+            //console.log(allowed, replacements, available)
+
+            let hasError = false;
+            let newVal = '';
+            valArr.forEach(val => {
+              let unit = val.replace(parseInt(val), '');
+              let numVal = parseInt(val);
+
+              if (unit != 0) {
+                if (allowed.includes(unit)) {
+                  if (available.includes(numVal)) {
+                    if (numVal >= 0) {
+                      if (!hasError) {
+                        newVal += replacements[unit].replace('$$', numVal) + " ";
+                      }
+                    } else {
+                      if (!hasError) {
+                        newVal += `calc(${replacements[unit].replace('$$', numVal * -1)} * -1)` + " ";
+                      }
+                    }
+                  } else {
+                    hasError = true;
+                    let err = {
+                      prop: decl.prop,
+                      value: numVal,
+                      filename,
+                      filepath: rootOriginal.source.input.from,
+                      line: decl.source.start.line,
+                      unit,
+                      message: 'value not available consider others'
+                    };
+                    errors.push(err);
+                  }
+                } else {
+                  hasError = true;
+                  let err = {
+                    prop: decl.prop,
+                    value: decl.value,
+                    filename,
+                    filepath: rootOriginal.source.input.from,
+                    line: decl.source.start.line,
+                    unit,
+                    message: 'Unit not supported'
+                  };
+                  errors.push(err);
+                }
+              }
+            });
+
+            if (!hasError) {
+              decl.value = newVal;
+            }
+          }
+        }
+      });
+    }); //fs.writeFile('./src/trial.json', JSON.stringify(variables) ,(err) =>{
+    //    if(err)console.log(err);
+    //    else{
+    //        console.log('updated successfully');
+    //    }
+    // })
+    // console.log(errors)
+
+    let errorArr = [];
+    errors.forEach(errStr => {
+      errorArr.push(` prop: ${errStr.prop} ,\n value : ${errStr.value} ,\n filename : ${errStr.filename} ,\n filepath : ${errStr.filepath} ,\n line : ${errStr.line} ,\n unit : ${errStr.unit} ,\n message : ${errStr.message} \r`);
+    }); //fs.writeFile('./css_error.log','', (err) =>{
+    //    if(err){
+    //        console.log(err);
+    //    }
+    //});
+    // errorArr.forEach(err => {
+    //   let data = `\n{\n${err}\n},\n`;
+    //   //fs.appendFile('./css_error.log',data,(err)=>{
+    //   //    if(err){
+    //   //       console.log(err);
+    //   //    }
+    //   //})
+    // });
+    // fs.writeFileSync('./css_error.log','');
+    //  errorArr.forEach(err => {
+    //    let data = `\n{\n${err}\n},\n`;
+    //    fs.appendFileSync('./css_error.log',data);
+    //  });
+  }
+});

package/lib/schemas/index.js

@@ -13,6 +13,7 @@ var _getCurrentBranch = _interopRequireDefault(require("../utils/getCurrentBranc
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// TODO move deprecated options to separate file and manage seperately
 var _default = {
   cliRootPath: null,
   unstableDepsInverse: {
@@ -90,6 +91,10 @@ var _default = {
     cssDirStatement: null
   },
   app: {
+    moduleResolvePath: {
+      value: '',
+      cli: 'module_resolve_path'
+    },
     // this option only for impact testing
     devCssFileBountry: {
       value: '',
@@ -136,6 +141,10 @@ var _default = {
         value: 'dev',
         cli: 'app_mode'
       },
+      httpsCerts: {
+        value: '',
+        cli: 'https_certs'
+      },
       branch: {
         value: 'master',
         cli: 'app_branch'
@@ -159,6 +168,10 @@ var _default = {
         cli: 'mock_port'
       }
     },
+    mediaQueryHoverActiveString: {
+      hover: 'all and (min--moz-device-pixel-ratio:0) and (hover: hover), (hover: hover)',
+      none: '(hover: none)'
+    },
     disableES5Transpile: false,
     isReactMig: false,
     hasWidget: false,
@@ -193,6 +206,9 @@ var _default = {
       cli: 'attr_name'
     },
     publicPaths: false,
+    // TODO: Deprecated
+    hasRTL: false,
+    rtlExclude: [],
     instrumentScript: {
       value: false,
       cli: 'instru_script'
@@ -205,8 +221,19 @@ var _default = {
       value: true,
       cli: 'enable_smaphook'
     },
-    hasRTL: false,
-    rtlExclude: [],
+    plugins: {
+      hasRTL: false,
+      hoverActive: false,
+      combinerMediaQuery: false,
+      cssVariableReplacement: false
+    },
+    exclude: {
+      rtl: [],
+      hoverActive: [],
+      combinerMediaQuery: [],
+      cssVariableReplacement: []
+    },
+    cssVariableReplacementConfig: '',
     seperateCssModules: {
       value: false,
       cli: 'sep_cssmodules'
@@ -221,8 +248,6 @@ var _default = {
       value: 'zd',
       cli: 'class_prefix'
     },
-    combinerMq: false,
-    hoverActive: false,
     selectorReplace: null,
     devConsoleExculde: {
       value: false,
@@ -236,6 +261,7 @@ var _default = {
       replaceText: '//<!--AssetsFromBuild -->'
     },
     htmlTemplate: {
+      minify: null,
       inject: true
     },
     removePropTypes: false,
@@ -270,18 +296,34 @@ var _default = {
       },
       branch: false
     },
+    mediaQueryHoverActiveString: {
+      hover: 'all and (min--moz-device-pixel-ratio:0) and (hover: hover), (hover: hover)',
+      none: '(hover: none)'
+    },
     componentFolder: 'src',
     cssUniqueness: {
       value: true,
       cli: 'css_unique'
     },
     enableChunkHash: false,
-    combinerMq: false,
-    hoverActive: false,
     folder: 'src',
     disableES5Transpile: false,
+    // TODO: Deprecated
     hasRTL: false,
     rtlExclude: [],
+    plugins: {
+      hasRTL: false,
+      hoverActive: false,
+      combinerMediaQuery: false,
+      cssVariableReplacement: false
+    },
+    exclude: {
+      rtl: [],
+      hoverActive: [],
+      combinerMediaQuery: [],
+      cssVariableReplacement: []
+    },
+    cssVariableReplacementConfig: '',
     cssHashSelectors: {
       filenames: [],
       packages: []
@@ -292,6 +334,7 @@ var _default = {
     }
   },
   test: {
+    classnameFormat: '[classname]',
     srcBranch: {
       value: 'master',
       cli: 'src_branch'
@@ -309,7 +352,6 @@ var _default = {
       cli: 'branch_name'
     },
     impactServerDomain: {
-      //value: 'ht' + 'tp://desk-qa-impact.tsi.zohocorpin.com:8080',
       value: 'ht' + 'tp://desk-automation.csez.zohocorpin.com:8080',
       cli: 'impact_server_domain'
     },
@@ -332,7 +374,6 @@ var _default = {
       cli: 'service_name'
     },
     impactServerDomain: {
-      //value: 'ht' + 'tp://desk-qa-impact.tsi.zohocorpin.com:8080',
       value: 'ht' + 'tp://desk-automation.csez.zohocorpin.com:8080',
       cli: 'impact_server_domain'
     },
@@ -370,7 +411,7 @@ var _default = {
       cli: 'path_to_sub_projs'
     },
     tokenGit: {
-      value: 'YbByNJ3yURAm92Lhx4vW',
+      value: '',
       cli: 'git_token'
     },
     changesOnly: {
@@ -551,7 +592,6 @@ var _default = {
     },
     impactServerDomain: {
       value: 'ht' + 'tp://desk-automation.csez.zohocorpin.com:8080',
-      //value: 'ht' + 'tp://desk-qa-impact.tsi.zohocorpin.com:8080',
       cli: 'impact_server_domain'
     },
     impactRun: {