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

package/lib/plugins/ServiceWorkerPlugin.js

@@ -51,11 +51,11 @@ class ServiceWorkerPlugin {
         if (err) {
           throw new Error(err);
         } else {
-          /* const extractedChunks = compilation.chunks.filter(chunk => {
-            if ('canBeInitial' in chunk) {
-              return chunk.canBeInitial();
-            }
-            return chunk.isInitial();
+          /* const extractedChunks = compilation.chunks.filter(chunk => {
+            if ('canBeInitial' in chunk) {
+              return chunk.canBeInitial();
+            }
+            return chunk.isInitial();
           }); */
           // let [js, css, , , i18nPublicPath] = this.publicPaths;
           // let initialChunkUrls = [];
@@ -64,10 +64,10 @@ class ServiceWorkerPlugin {
           let entrypoint = compilation.entrypoints.get('main');
           let initialChunkUrls = entrypoint.getFiles();
           const cssDirTemplate = '@dir@';
-          /**
-           * NOTE:
-           *  if chunkSplitEnable is false means,
-           *    serviceWorker will get i18n files path for html
+          /**
+           * NOTE:
+           *  if chunkSplitEnable is false means,
+           *    serviceWorker will get i18n files path for html
            */
 
           let initalI18nAssets = chunkSplitEnable ? entrypoint.chunks.filter(chunk => _I18nKeysIdentifer.default.isChunkHasI18n(chunk)).map(chunk => (0, _getI18nFileUrlPathTemplate.getI18nFileUrlPathTemplate)(compilation, chunk, this.i18nFileNameTemplate, '@locale@')) : [];

package/lib/plugins/TPHashMappingPlugin.js

@@ -15,10 +15,10 @@ var _crypto = _interopRequireDefault(require("crypto"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-/**
- * Plugin that generates hash for the provided list of third party files
- * Map the provided key with the file hash and add it to the list of exisiting global constants.
- * Plugin in turn uses the defineplugin to generate global constants. 
+/**
+ * Plugin that generates hash for the provided list of third party files
+ * Map the provided key with the file hash and add it to the list of exisiting global constants.
+ * Plugin in turn uses the defineplugin to generate global constants. 
  */
 class TPHashMappingPlugin {
   constructor(options) {

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/RTLSplitPlugin.js

@@ -38,11 +38,11 @@ function selectorMinifySameDir(selector, direction) {
   const regex = getRegex(direction);
   return selector.replace(regex, '').trim();
 }
-/**
- * this funtion will remove given rule,
- *  if given selector and it's previous sibiling rule selector  are same
- * current rule properties will move to previous sibiling rule.
- * @param {Rule} rule current rule
+/**
+ * this funtion will remove given rule,
+ *  if given selector and it's previous sibiling rule selector  are same
+ * current rule properties will move to previous sibiling rule.
+ * @param {Rule} rule current rule
  */
 
 
@@ -57,11 +57,11 @@ function mergeIfSameSelector(rule) {
     rule.remove();
   }
 }
-/**
- * this funtion will remove given rule,
- *  if given selector and it's previous sibiling rule selector  are same
- * current rule properties will move to previous sibiling rule.
- * @param {Rule} rule current rule
+/**
+ * this funtion will remove given rule,
+ *  if given selector and it's previous sibiling rule selector  are same
+ * current rule properties will move to previous sibiling rule.
+ * @param {Rule} rule current rule
  */
 
 

package/lib/postcss-plugins/__test__/test1Input.css

@@ -1,39 +1,39 @@
-/*Hover_active:ignore*/
-g,a:hover{
-	color : red
-}
-/*Hover:ignore*/
-h:hover{
-background : yellow
-}
-
-/* Hover_active:ignore */
-g,d+e:hover{
-	color : black
-}
-
-g,d e:hover{
-	color : black
-}
-
-@media screen and (max-width:61.25em){
-  /* Hover_active:ignore */
-  a,b,a:hover, b:hover{
-  background-color : blue
-  }
-  a + b,a:hover + b:hover{
-  background-color : blue
-  }
-  a b:hover{
-  background-color : blue
-  }
-  
-  .cc:hover {
-    color: red;
-  }
-
-  c:hover{
-  color : red
-  }
-  
+/*Hover_active:ignore*/
+g,a:hover{
+	color : red
+}
+/*Hover:ignore*/
+h:hover{
+background : yellow
+}
+
+/* Hover_active:ignore */
+g,d+e:hover{
+	color : black
+}
+
+g,d e:hover{
+	color : black
+}
+
+@media screen and (max-width:61.25em){
+  /* Hover_active:ignore */
+  a,b,a:hover, b:hover{
+  background-color : blue
+  }
+  a + b,a:hover + b:hover{
+  background-color : blue
+  }
+  a b:hover{
+  background-color : blue
+  }
+  
+  .cc:hover {
+    color: red;
+  }
+
+  c:hover{
+  color : red
+  }
+  
 }

package/lib/postcss-plugins/__test__/test1Output.css

@@ -1,39 +1,39 @@
-/*Hover_active:ignore*/
-g,a:hover{
-	color : red
-}
-/*Hover:ignore*/
-h:hover{
-background : yellow
-}
-
-/* Hover_active:ignore */
-g,d+e:hover{
-	color : black
-}
-
-g,d e:hover{
-	color : black
-}
-
-@media screen and (max-width:61.25em){
-  /* Hover_active:ignore */
-  a,b,a:hover, b:hover{
-  background-color : blue
-  }
-  a + b,a:hover + b:hover{
-  background-color : blue
-  }
-  a b:hover{
-  background-color : blue
-  }
-  
-  .cc:hover {
-    color: red;
-  }
-
-  c:hover{
-  color : red
-  }
-  
+/*Hover_active:ignore*/
+g,a:hover{
+	color : red
+}
+/*Hover:ignore*/
+h:hover{
+background : yellow
+}
+
+/* Hover_active:ignore */
+g,d+e:hover{
+	color : black
+}
+
+g,d e:hover{
+	color : black
+}
+
+@media screen and (max-width:61.25em){
+  /* Hover_active:ignore */
+  a,b,a:hover, b:hover{
+  background-color : blue
+  }
+  a + b,a:hover + b:hover{
+  background-color : blue
+  }
+  a b:hover{
+  background-color : blue
+  }
+  
+  .cc:hover {
+    color: red;
+  }
+
+  c:hover{
+  color : red
+  }
+  
 }

package/lib/postcss-plugins/hoverActivePlugin.js

@@ -4,9 +4,9 @@ var _postcss = _interopRequireDefault(require("postcss"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-/**
- * we have give support for ignore(exclude) comments
- * These are the comments' keyword
+/**
+ * we have give support for ignore(exclude) comments
+ * These are the comments' keyword
  */
 const hoverIgnoreQuery = 'Hover:ignore',
       activeIgnoreQuery = 'Active:ignore',
@@ -32,7 +32,7 @@ function isHoverPresent(atrule) {
   return hoverPresent;
 }
 
-module.exports = _postcss.default.plugin('postcss-mobile-hover', () => rootOriginal => {
+module.exports = _postcss.default.plugin('postcss-mobile-hover', opts => rootOriginal => {
   const hoverRules = [];
   let positionsObj = {};
 

package/lib/postcss-plugins/variableModifier.js

@@ -0,0 +1,243 @@
+"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])) {
+          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

@@ -205,8 +205,16 @@ var _default = {
       value: true,
       cli: 'enable_smaphook'
     },
-    hasRTL: false,
-    rtlExclude: [],
+    plugins: {
+      hasRTL: false,
+      hoverActive: false,
+      combinerMediaQuery: false
+    },
+    exclude: {
+      rtl: [],
+      hoverActive: [],
+      combinerMediaQuery: []
+    },
     seperateCssModules: {
       value: false,
       cli: 'sep_cssmodules'
@@ -221,8 +229,6 @@ var _default = {
       value: 'zd',
       cli: 'class_prefix'
     },
-    combinerMq: false,
-    hoverActive: false,
     selectorReplace: null,
     devConsoleExculde: {
       value: false,
@@ -276,12 +282,18 @@ var _default = {
       cli: 'css_unique'
     },
     enableChunkHash: false,
-    combinerMq: false,
-    hoverActive: false,
     folder: 'src',
     disableES5Transpile: false,
-    hasRTL: false,
-    rtlExclude: [],
+    plugins: {
+      hasRTL: false,
+      hoverActive: false,
+      combinerMediaQuery: false
+    },
+    exclude: {
+      rtl: [],
+      hoverActive: [],
+      combinerMediaQuery: []
+    },
     cssHashSelectors: {
       filenames: [],
       packages: []

package/lib/sh/pre-commit.sh

@@ -1,34 +1,34 @@
-#!/bin/sh
-
-STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep -E "\.(js)$") # Get staged files
-
-CURRENT_BRANCH=$(git branch | sed -n -e 's/^\* \(.*\)/\1/p') # Get branch name
-
-echo "Branch Name - $CURRENT_BRANCH"
-
-if [[ "$STAGED_FILES" = "" ]]; then
-  exit 0
-fi
-
-IS_FAILED=false
-FILES=""
-
-for FILE in $STAGED_FILES # Add files with space separation
-do
-	FILES+="$FILE "
-done
-
-npm run lint --prefix ${PREFIX_PATH} $FILES # Run ESLint
-
-if [[ "$?" != 0 ]]; then
-	IS_FAILED=true
-fi
-
-if $IS_FAILED; then
-  echo "\033[41mCOMMIT FAILED:\033[0m Your commit contains files that should pass ESLint but do not. Please fix the ESLint errors and try again.\n"
-  exit 1
-else
-  echo "\033[42mCOMMIT SUCCEEDED\033[0m\n"
-fi
-
-exit $?
+#!/bin/sh
+
+STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep -E "\.(js)$") # Get staged files
+
+CURRENT_BRANCH=$(git branch | sed -n -e 's/^\* \(.*\)/\1/p') # Get branch name
+
+echo "Branch Name - $CURRENT_BRANCH"
+
+if [[ "$STAGED_FILES" = "" ]]; then
+  exit 0
+fi
+
+IS_FAILED=false
+FILES=""
+
+for FILE in $STAGED_FILES # Add files with space separation
+do
+	FILES+="$FILE "
+done
+
+npm run lint --prefix ${PREFIX_PATH} $FILES # Run ESLint
+
+if [[ "$?" != 0 ]]; then
+	IS_FAILED=true
+fi
+
+if $IS_FAILED; then
+  echo "\033[41mCOMMIT FAILED:\033[0m Your commit contains files that should pass ESLint but do not. Please fix the ESLint errors and try again.\n"
+  exit 1
+else
+  echo "\033[42mCOMMIT SUCCEEDED\033[0m\n"
+fi
+
+exit $?