@zohodesk/utils 1.3.11 → 1.3.13

package/README.md

@@ -1,7 +1,27 @@
 # #UNIFIED COMPONENTS LIBRARY - Utils
 
-In this Package, We Provide Util Fuctions for Hooks
+In this package, We provide lots of util fuctions for web devlopment
 
-# 1.3.6
+# 1.3.13
 
--
+- `mergeStyle` issue fix
+
+# 1.3.12
+
+- `mergeStyle` functionality updated. Composed classes will also update if it is inside that file.
+```js
+// Before
+const style = mergeStyle(
+    { a: '1', b: '1 2' },
+    { a: 'a' } 
+);
+// style = { a: '1 a', b: '1 2' }
+
+// After
+const style = mergeStyle(
+    { a: '1', b: '1 2' },
+    { a: 'a' } 
+);
+// style = { a: '1 a', b: '1 a 2' }
+```
+- `compileClassNames` code optimized. Will not support other than object as argument.

package/es/compileClassNames.js

@@ -1,25 +1,14 @@
 import dataTypes, { isDataTypeOf } from "./dataTypes";
-import { hasOwnProperty, isToStringReferenceEqual } from "./objectUtils";
-
-/**
- *  
- * @param  {object} classinfoList 
- * @returns {string}
- */
+import { hasOwnProperty } from "./objectUtils";
 const collectClassNames = function (processedClassNameList) {
   for (let index = 0; index < (arguments.length <= 1 ? 0 : arguments.length - 1); index++) {
     let classInfo = index + 1 < 1 || arguments.length <= index + 1 ? undefined : arguments[index + 1];
     if (!classInfo) {
       continue;
-    }
-    if (isDataTypeOf(classInfo, dataTypes.string) || isDataTypeOf(classInfo, dataTypes.number)) {
-      processedClassNameList.push(classInfo);
-    } else if (isDataTypeOf(classInfo, dataTypes.array)) {
-      processedClassNameList.push(collectClassNames.apply(null, classInfo));
     } else if (isDataTypeOf(classInfo, dataTypes.object)) {
       for (let property in classInfo) {
-        if (hasOwnProperty.call(classInfo, property) && classInfo[property]) {
-          processedClassNameList.push(property === "undefined" ? '' : property);
+        if (hasOwnProperty.call(classInfo, property) && property !== 'undefined' && property !== 'null' && classInfo[property] && !processedClassNameList.includes(property)) {
+          processedClassNameList.push(property);
         }
       }
     }
@@ -32,117 +21,4 @@ export default function compileClassNames() {
   }
   collectClassNames(resultClassNameList, ...classinfoList);
   return resultClassNameList.filter(a => a !== '').join(' ');
-}
-;
-
-/* discussion
-passing object is enough i think. remaining option needed!!!
-*/
-
-//18-Nov-2021 code review changes updated.
-
-/*
->>>>>>>>>>Code Review Suggestion Starts >>>>>>
-let hasOwn = {}.hasOwnProperty;
-
-Accounting readability, please change this to Object.hasOwnProperty
-
----
-const compileClassNames = (...props)=>{
-Please check the alternate term - collate -> collateClassNames -> Collect and Combine the classnames.
----
-
-for (let i = 0; i < props.length; i++) {
-
-    Please try to to stick with functional programming. Again for the readability perspective.
-    Also, please stick with naming conventions for variables (i -> index).
-
----
-if (argType === 'string' || argType === 'number') {
-          classes.push(this && this[arg] || arg);
-      } else if (Array.isArray(arg)) {
-          classes.push(compileClassNames.apply(this, arg));
-      } else if (argType === 'object') {
-          if (arg.toString === Object.prototype.toString) {
-              for (let key in arg) {
-                  if (hasOwn.call(arg, key) && arg[key]) {
-                      classes.push(this && this[key] || key);
-                  }
-              }
-          } else {
-              classes.push(arg.toString());
-          }
-      }
-    }
-In this code block, pushing up the array,object checks before string || number will be easy to follow up as it clarifies about the reursive call, its context.
-Please check the possibility of avoiding the usage of 'this' statement due to its complexity in understanding the concept.
-
----
-Please write a functional method for the below line for easier understanding 
-  
-if (arg.toString === Object.prototype.toString) {
-
----
-
-Adding dedicated method to get the datatype of variables will help to stick on the SRP.
----
-Check the possibility of providing platform to extend the algorithm works for other data structures like Map, WeakMap,etc..
-
->>>>>>> Code Review Suggestion Ends >>>>>>>>>>>>>>>>
-*/
-
-/*
-
->>>>>> Alternative Implementation Starts >>>>>>>>>>>>>>>> 
-
-let boundHasOwnMethod = Object.hasOwnProperty;
-
- const collateClassNames = (...classinfoList) =>{
-     let processedClassNameList = [];
-     classinfoList.forEach( ( classInfo,index )=>{
-         if(!classInfo)
-         {
-            // continue the next iteration
-             return;
-         }
-         let dataTypeofClassInfo = getDataType(classInfo);
-         if (dataTypeofClassInfo === 'string' || dataTypeofClassInfo === 'number')
-         {
-             processedClassNameList.push(classInfo);
-         }
-         else if(dataTypeofClassInfo === 'array')
-         {
-             processedClassNameList.push(collateClassNames(...classInfo));
-         }
-         else if(dataTypeofClassInfo === 'object')
-         {
-             for (let property in classInfo) {
-                  if (boundHasOwnMethod.call(classInfo,property ) && classInfo[property]) {
-                      processedClassNameList.push(property);
-                  }
-              }
-         }
-        
-
-     });
-     const joinClassNames = processedClassNameList.join(' ');
-    return joinClassNames;
-
- }
-
- const getDataType = (data)=>{
-    let dataTypeofClassInfo = typeof data;
-    let isArrayDataType = Array.isArray(data) === true;
-    if(isArrayDataType)
-    {
-        return 'array';
-    }
-    else 
-    {
-        return dataTypeofClassInfo;
-    }
-   
- };
-
->>>>>>>>>>>>>>>> Alternative Implementation Ends>>>>>>>>>>>>>> 
-*/
+}

package/es/mergeStyle.js

@@ -1,26 +1,50 @@
-/**
- * REPLACER_SYMBOL used to indentify
- */
 const REPLACER_SYMBOL = '$';
-/**
- *  $ startWith is used for replace the existing style.
- *  all other will be append
- * @param {*} defaultStyle
- * @param {*} customStyle
- * @returns
- */
-export default function mergeStyle(defaultStyle, customStyle) {
+
+// $ startWith is used for replace the existing style.
+// all other will be append
+
+export default function mergeStyle(defaultStyle) {
+  let customStyle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   let additionalStyle = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  // if(!Object.keys(defaultStyle).includes('base')) {
+  //   throw new Error(`STYLE CUSTOMIZATION RULE - Your style sheet should have "base" class name for customization`);
+  // }
+
   return Object.keys(customStyle).reduce((res, next) => {
     if (next.startsWith(REPLACER_SYMBOL)) {
       let styleValue = customStyle[next];
       let styleName = next.replace(REPLACER_SYMBOL, '');
-      if (!defaultStyle[styleName] && !additionalStyle.includes(styleName)) {
-        return res;
+      if (!res[styleName] && !additionalStyle.includes(styleName)) {
+        throw new Error(`UNKNOWN CLASSNAME DETECTED - Given customStyle's key "${styleName}" is not available in that component style`);
+      } else if (additionalStyle.includes(styleName)) {
+        res[styleName] = styleValue;
+      } else {
+        let val = res[styleName];
+        Object.keys(res).map(keyName => {
+          let styleKey = res[keyName];
+          let ind = styleKey.indexOf(val);
+          if (ind !== -1) {
+            res[keyName] = styleKey.replace(val, styleValue);
+          }
+        });
       }
-      res[styleName] = styleValue;
-    } else if (defaultStyle[next] || additionalStyle.includes(next)) {
-      res[next] = (defaultStyle[next] || '') + ' ' + customStyle[next];
+    } else if (res[next]) {
+      let val = res[next];
+      Object.keys(res).map(keyName => {
+        let styleKey = res[keyName];
+        let styleClasses = styleKey.split(' ');
+        val = val.split(' ')[0];
+        let ind = styleClasses.indexOf(val);
+        if (ind !== -1) {
+          styleClasses[ind] = styleClasses[ind] + ' ' + customStyle[next];
+          res[keyName] = styleClasses.join(' ');
+        }
+      });
+    } else if (additionalStyle.includes(next)) {
+      res[next] = customStyle[next];
+    } else if (!res[next] && !additionalStyle.includes(next)) {
+      // res[next] = customStyle[next];
+      throw new Error(`UNKNOWN CLASSNAME DETECTED - Given customStyle's key "${next}" is not available in that component style`);
     }
     return res;
   }, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/utils",
-  "version": "1.3.11",
+  "version": "1.3.13",
   "description": "Unified Component Library - Utils",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -30,6 +30,5 @@
   "files": [
     "es",
     "!**/__tests__"
-  ],
-  "gitHead": "d87d601ccbb408f1b64075a4e11dbf86658faade"
-}
+  ]
+}

package/LICENSE

@@ -1,22 +0,0 @@
-Copyright (c) 2015-present Lerna Contributors
-
-MIT License
-
-Permission is hereby granted, free of charge, to any person obtaining
-a copy of this software and associated documentation files (the
-"Software"), to deal in the Software without restriction, including
-without limitation the rights to use, copy, modify, merge, publish,
-distribute, sublicense, and/or sell copies of the Software, and to
-permit persons to whom the Software is furnished to do so, subject to
-the following conditions:
-
-The above copyright notice and this permission notice shall be
-included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
-MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
-LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
-OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
-WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.