@zohodesk/utils 1.0.1-alpha.2057

package/es/disCustomStyleProps.js

@@ -0,0 +1,45 @@
+// import PropTypes from "prop-types";
+// import mergeStyle from "./mergeStyle";
+// import { Button } from "../../base/src/Button/index";
+// export default (props)=>{
+//     let { customStyle,  openCustomStyle}  = props;
+//     return {
+//         customStyle,
+//         openDefaultToCustomize
+//     };
+// }
+// if two is same ==> do the think replace with last , append at end 
+// replace vs append ==> append 
+// append vs replace ==> replace 
+// DotButton.js
+// DotButton.module.css 
+// function DotButton({ customStyle }){
+//     dotButdefault => customStyle : {
+//         base : DotButton.style.pols 
+//     }
+//     props => customStyle {
+//         base :  
+//     }
+//     return <Button customStyle={}></Button>
+// }
+// Button => set of compoents 
+// DotButton => set of comepons
+// function creatButtonWithIcon({Button,Icon}){
+//     return (props)=>{
+//         customStyle={}
+//         return <Button customStyle={ssss}>
+//                 <Icon></Icon>   
+//         </Button>
+//     }
+// }
+// Button1.js
+// Icon1.js
+// creatButtonWithIcon({
+//     Button : Button1,
+//     Icon : Icon1
+// });
+// Button1custome(props){
+//     props.customStyle 
+//     combineCustomStyle()
+//     return Button 
+// }

package/es/getCompliedClassName.js

@@ -0,0 +1,12 @@
+import compileClassNames from "./compileClassNames";
+export default (function (customClassName) {
+  let isPlainClassName = typeof customClassName === "string" ? true : false;
+
+  for (var _len = arguments.length, props = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    props[_key - 1] = arguments[_key];
+  }
+
+  return compileClassNames(...props, {
+    [customClassName]: !!isPlainClassName
+  });
+});

package/es/getCompliedCustomId.js

@@ -0,0 +1,16 @@
+export default (function (_ref, defaultCustomId) {
+  let {
+    customId,
+    customIdPrefix = "",
+    customIdSuffix = ""
+  } = _ref;
+  let otherCustomOption = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  let returnId = customId;
+
+  if (typeof defaultCustomId === "function") {
+    let options = ['', customIdPrefix, customIdSuffix, ...otherCustomOption];
+    returnId = defaultCustomId.apply(null, options); //returnId = defaultCustomId`${customIdPrefix} ${customIdSuffix}`;
+  }
+
+  return returnId ? returnId.toLowerCase() : null;
+});

package/es/index.js

@@ -0,0 +1,10 @@
+export { default as debounce } from './debounce';
+export { default as uniqueNumber } from './uniqueNumber';
+export { default as omit } from './omit';
+export { default as mergeStyle } from './mergeStyle';
+export { default as applyOpenToCustomize } from './applyOpenToCustomize';
+export { default as combineCustomStyle } from './combineCustomStyle';
+export { default as compileClassNames } from './compileClassNames';
+export { default as ErrorBoundary } from './ErrorBoundary';
+export { default as loadResource } from './loadResource';
+export { default as accessKeyCodes, accessKeyNames } from "./accessKeyCodes";

package/es/isTouchDevice.js

@@ -0,0 +1,9 @@
+export default function isTouchDevice() {
+  if ('ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0) {
+    /* browser with either Touch Events of Pointer Events
+      running on touch-capable device */
+    return true;
+  }
+
+  return false;
+}

package/es/loadResource.js

@@ -0,0 +1,56 @@
+/* eslint-disable import/prefer-default-export */
+
+/* use promise and remove callback */
+export default function loadResource(url, type, id, callback) {
+  let needDefer = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : true;
+  return new Promise(resolve => {
+    let css;
+    let script;
+
+    if (id && document.getElementById(id)) {
+      resolve();
+      return;
+    }
+
+    if (type === 'css') {
+      css = document.createElement('link');
+      css.type = 'text/css';
+      css.rel = 'stylesheet';
+      css.href = url;
+      css.id = id || '';
+
+      css.onload = function () {
+        resolve();
+      };
+
+      css.onerror = function () {
+        resolve();
+      };
+
+      document.getElementsByTagName('head')[0].appendChild(css);
+    } else if (type === 'js') {
+      script = document.createElement('script');
+      script.type = 'text/javascript';
+      script.src = url;
+      script.defer = needDefer;
+
+      script.onload = function () {
+        resolve();
+
+        if (id) {
+          script.id = id;
+        }
+
+        if (typeof callback === 'function') {
+          callback();
+        }
+      };
+
+      script.onerror = function () {
+        resolve();
+      };
+
+      document.getElementsByTagName('head')[0].appendChild(script);
+    }
+  });
+}

package/es/mergeStyle.js

@@ -0,0 +1,31 @@
+/**
+ * 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) {
+  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]) {
+        return res;
+      }
+
+      res[styleName] = styleValue;
+    } else if (defaultStyle[next]) {
+      res[next] = defaultStyle[next] + " " + customStyle[next];
+    }
+
+    return res;
+  }, { ...defaultStyle
+  });
+}

package/es/objectUtils.js

@@ -0,0 +1,4 @@
+export const hasOwnProperty = Object.hasOwnProperty;
+export const isToStringReferenceEqual = data => {
+  return data.toString === Object.prototype.toString;
+};

package/es/omit.js

@@ -0,0 +1,12 @@
+import "core-js/modules/es.array.includes";
+export default (keys => {
+  return function omit(obj) {
+    return Object.keys(obj).reduce((res, next) => {
+      if (!keys.includes(next)) {
+        res[next] = obj[next];
+      }
+
+      return res;
+    }, {});
+  };
+});

package/es/props/automationProps.js

@@ -0,0 +1,7 @@
+import PropTypes from 'prop-types';
+export const automationPropsName = 'customId';
+export default {
+  customId: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+  customIdPrefix: PropTypes.string,
+  customIdSuffix: PropTypes.string
+};

package/es/props/customReducerPropTypes.js

@@ -0,0 +1,5 @@
+import PropTypes from 'prop-types';
+export default {
+  customReducer: PropTypes.func
+};
+export const customReducer = 'customReducer';

package/es/props/customStyleProps.js

@@ -0,0 +1,9 @@
+import PropTypes from 'prop-types';
+export default {
+  customStyle: PropTypes.object
+};
+/**
+ * Prop Name
+ */
+
+export const customStyle = "customStyle";

package/es/props/generalAriaProps.js

@@ -0,0 +1,6 @@
+import PropTypes from 'prop-types';
+export default {
+  'aria-label': PropTypes.string,
+  'aria-labelledby': PropTypes.string,
+  tabIndex: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+};

package/es/props/tagAttributeProps.js

@@ -0,0 +1,24 @@
+import PropTypes from 'prop-types';
+const attributesList = ["tabIndex"];
+const dataAttribute = "^data|on";
+export const tagAttributesPropType = function (props, propName, componentName) {
+  if (Object.prototype.toString.call(props) !== "[object Object]") {
+    console.error(`Warning: Failed prop type: Invalid prop \`${propName}\` of type \`${props ? typeof props : undefined}\` supplied to \`${componentName}\`, expected \`object\`.`);
+  }
+
+  let curPattern = new RegExp(`^(${attributesList.join("|")})$`);
+  let curPattern2 = new RegExp(dataAttribute);
+  Object.keys(props[propName]).forEach(keyName => {
+    if (!(curPattern.test(keyName) || curPattern2.test(keyName))) {
+      console.warn(`Warning: these attributes name ${keyName} are not allowed in ${propName}`);
+    }
+  });
+};
+export default {
+  tagAttributes: tagAttributesPropType
+};
+/**
+ * tagAttributes - is used to spread these attributes for events customize and override few attributes.
+ */
+
+export const tagAttributes = "tagAttributes";

package/es/props/tagGeneralAttributeProps.js

@@ -0,0 +1,24 @@
+import PropTypes from 'prop-types';
+const attributesList = ["accesskey", "contentEditable", "dir", "draggable", "hidden", "lang", "tabIndex", "title", "spellcheck", "translate"];
+const dataAttribute = "^data|on";
+export const tagGeneralAttributesPropType = function (props, propName, componentName) {
+  if (Object.prototype.toString.call(props) !== "[object Object]") {
+    console.error(`Warning: Failed prop type: Invalid prop \`${propName}\` of type \`${props ? typeof props : undefined}\` supplied to \`${componentName}\`, expected \`object\`.`);
+  }
+
+  let curPattern = new RegExp(`^(${attributesList.join("|")})$`);
+  let curPattern2 = new RegExp(dataAttribute);
+  Object.keys(props[propName]).forEach(keyName => {
+    if (!(curPattern.test(keyName) || curPattern2.test(keyName))) {
+      console.warn(`Warning: these attributes name ${keyName} are not allowed in tagGeneralAttributes`);
+    }
+  });
+};
+export default {
+  tagGeneralAttributes: tagGeneralAttributesPropType
+};
+/**
+ * tagGeneralAttributes - is to spread the global attributes in component.
+ */
+
+export const tagGeneralAttributes = "tagGeneralAttributes";

package/es/props/uiProps.js

@@ -0,0 +1,65 @@
+/* eslint-disable no-labels */
+
+/* eslint-disable no-restricted-syntax */
+import PropTypes from 'prop-types';
+import { variants, colors, sizes, shapes } from "../constantProps";
+export const getVariantProps = (variants, exvariant) => {
+  let variant = [];
+
+  if (exvariant) {
+    variant = [...exvariant];
+  }
+
+  variant = [...variant, ...variants];
+  return {
+    variant: PropTypes.oneOf(variant)
+  };
+};
+export const variantProps = {
+  variant: PropTypes.oneOf(variants)
+};
+export const getColorProps = (colors, excolors) => {
+  let color = [];
+
+  if (excolors) {
+    color = [...excolors];
+  }
+
+  color = [...color, ...colors];
+  return {
+    color: PropTypes.oneOf(color)
+  };
+};
+export const colorProps = {
+  color: PropTypes.oneOf(colors)
+};
+export const getSizeProps = (sizes, exSizes) => {
+  let size = [];
+
+  if (exSizes) {
+    size = [...exSizes];
+  }
+
+  size = [...size, ...sizes];
+  return {
+    size: PropTypes.oneOf(size)
+  };
+};
+export const sizeProps = {
+  size: PropTypes.oneOf(sizes)
+};
+export const getShapeProps = (shapes, exshapes) => {
+  let shape = [];
+
+  if (exshapes) {
+    shape = [...exshapes];
+  }
+
+  shape = [...shape, ...shapes];
+  return {
+    shape: PropTypes.oneOf(shape)
+  };
+};
+export const shapeProps = {
+  shape: PropTypes.oneOf(shapes)
+};

package/es/reducerHandler.js

@@ -0,0 +1,18 @@
+import { useReducer } from "react";
+export default function useCommonReducer(defaultReducer, customReducer, initialArg, init) {
+  const proxyReducer = (state, action) => {
+    let lastState = defaultReducer(state, action);
+
+    if (customReducer) {
+      return customReducer(lastState, action);
+    }
+
+    return lastState;
+  };
+
+  const [state, dispatch] = useReducer(proxyReducer, initialArg, init);
+  return {
+    state,
+    dispatch
+  };
+}

package/es/replaceAtFirst.js

@@ -0,0 +1,3 @@
+export default ((object, search, replace) => {
+  return object.replace(search, replace);
+});

package/es/replaceAtLast.js

@@ -0,0 +1,3 @@
+export default function (object, search, replace) {
+  return object.replace(new RegExp(search + "([^" + search + "]*)$"), replace + "$1");
+}

package/es/uniqueNumber.js

@@ -0,0 +1,14 @@
+export default function uniqueNumber() {
+  let prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  //let randomId = (Date.now() + Math.random()).toString(36);
+  var date = Date.now(); // If created at same millisecond as previous
+
+  if (date <= uniqueNumber.previous) {
+    date = ++uniqueNumber.previous;
+  } else {
+    uniqueNumber.previous = date;
+  }
+
+  return prefix ? `${prefix}-${date}` : date;
+}
+uniqueNumber.previous = 0;

package/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@zohodesk/utils",
+  "version": "1.0.1-alpha.2057+759889c1",
+  "description": "",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "es/index.js",
+  "scripts": {
+    "build": "type react-cli && react-cli build:component:es",
+    "build_watch": "react-cli build:component:es -w",
+    "clean": "react-cli clean unittest coverage es result.json",
+    "rtl": "react-cli rtl ./src ./es",
+    "nodefix": "node ../buildtool_patch.js",
+    "prepare": "npm run clean && npm run build && npm run rtl",
+    "test": "react-cli test"
+  },
+  "author": "",
+  "license": "ISC",
+  "gitHead": "759889c1ce980ee197ec9f4117f2608120838b6f"
+}

package/src/ErrorBoundary.js

@@ -0,0 +1,24 @@
+import React from 'react';
+
+export default class ErrorBoundary extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { hasError: false };
+    }
+
+    static getDerivedStateFromError(error) {
+        return { hasError: true, error };
+    }
+
+    componentDidCatch(error, errorInfo) {
+        console.log(error, errorInfo);
+    }
+
+    render() {
+        if (this.state.hasError) {
+            return this.props.renderFallback(this.state.error);
+        }
+
+        return this.props.children;
+    }
+}

package/src/__tests__/abbreviateNumber.spec.js

@@ -0,0 +1,70 @@
+import abbreviateNumber from '../abbreviateNumber';
+describe("abbreviateNumber", () => {
+    test("value should be zero string and input also string", () => {
+        let a = abbreviateNumber("0");
+        expect(a).toBe("0");
+    })
+    test("value should be zero string", () => {
+        let a = abbreviateNumber(0);
+        expect(a).toBe("0");
+    })
+    test("value should be 1K string", () => {
+        let a = abbreviateNumber(1000);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1K string", () => {
+        let a = abbreviateNumber(1001);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1K+ string", () => {
+        let a = abbreviateNumber(1001);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1M string", () => {
+        let a = abbreviateNumber(1000000);
+        expect(a).toBe("1M");
+    })
+    test("value should be 1M+ string", () => {
+        let a = abbreviateNumber(1000001);
+        expect(a).toBe("1M");
+    })
+})
+describe("abbreviateNumber without browser Intl", () => {
+    beforeAll(() => {
+        global.Intl = null;
+    })
+
+    test("value should be zero string and input also string", () => {
+        let a = abbreviateNumber("0");
+        expect(a).toBe("0");
+    })
+    test("value should be zero string", () => {
+        let a = abbreviateNumber(0);
+        expect(a).toBe("0");
+    })
+    test("value should be zero string", () => {
+        let a = abbreviateNumber(0, { withAbbr: false });
+        expect(a).toBe("0");
+    })
+    test("value should be 1K string", () => {
+        let a = abbreviateNumber(1000);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1K string", () => {
+        let a = abbreviateNumber(1001);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1K+ string", () => {
+        let a = abbreviateNumber(1001);
+        expect(a).toBe("1K");
+    })
+    test("value should be 1M string", () => {
+        let a = abbreviateNumber(1000000);
+        expect(a).toBe("1M");
+    })
+    test("value should be 1M+ string", () => {
+        let a = abbreviateNumber(1000001);
+        expect(a).toBe("1M");
+    })
+
+})

package/src/__tests__/compileClassNames.spec.js

@@ -0,0 +1,35 @@
+import compileClassNames from '../compileClassNames';
+describe("compileClassNames", () => {
+    test("should be class1", () => {
+        let output = compileClassNames({ "class1": true });
+        expect(output).toBe("class1")
+    })
+    test("should be class1 class2", () => {
+        let output = compileClassNames({ "class1": true, "class2": true });
+        expect(output).toBe("class1 class2")
+    })
+    test("should be  class2", () => {
+        let output = compileClassNames({ "class1": false, "class2": true });
+        expect(output).toBe("class2")
+    })
+    test("should be  empty", () => {
+        let output = compileClassNames({ "class1": false, "class2": false });
+        expect(output).toBe("")
+    })
+    test("should be empty input is empty object ", () => {
+        let output = compileClassNames({});
+        expect(output).toBe("")
+    })
+    test("should be class1 multiple argument and first argument with null ", () => {
+        let output = compileClassNames(null, { class1: true });
+        expect(output).toBe("class1")
+    })
+    test("should be  multiple argument and first argument with null second arg as string ", () => {
+        let output = compileClassNames(null, "class1");
+        expect(output).toBe("class1")
+    })
+    test("should be empty input is empty object ", () => {
+        let output = compileClassNames(["class1"]);
+        expect(output).toBe("class1")
+    })
+})

package/src/__tests__/contextFactory.spec.js

@@ -0,0 +1,13 @@
+import contextFactory from '../contextFactory';
+describe("contextFactory", () => {
+    test("create new context", () => {
+        let RouterContext = contextFactory("router");
+        expect(RouterContext.$$typeof).toBe(Symbol.for('react.context'));
+    })
+    test("if context exist return same context", () => {
+        let RouterContext1 = contextFactory("router");
+        let RouterContext2 = contextFactory("router");
+        expect(RouterContext1).toBe(RouterContext2);
+    })
+    
+})

package/src/__tests__/createTemplateLiteral.spec.js

@@ -0,0 +1,4 @@
+import createTemplateLiteral from '../createTemplateLiteral';
+describe("createTemplateLiteral",()=>{
+    test("",()=>{})
+})

package/src/abbreviateNumber.js

@@ -0,0 +1,35 @@
+/**
+ * 
+ * @param {number|string} count 
+ * @param {object} options 
+ * @param {string} options.locale 
+ * @param {boolean} options.withAbbr
+ * @param {number} options.decimals
+ * @returns 
+ */
+export default function abbreviateNumber(count = 0, options = {}) {
+    if (typeof count === "string") {
+        count = parseInt(count);
+    }
+    if (global.Intl && global.Intl.NumberFormat) {
+        let numberFormat = Intl.NumberFormat(options.locale || "en", {
+            notation: "compact"
+            // compactDisplay: "short",
+        });
+        return numberFormat.format(count);
+    }
+    //Comaptibility
+    const COUNT_ABBRS = ["", "K", "M", "G", "T", "P", "E", "Z", "Y"];
+    let { withAbbr = true, decimals = 2 } = options;
+    const i = 0 === count ? count : Math.floor(Math.log(count) / Math.log(1000));
+    let result = parseFloat((count / Math.pow(1000, i)).toFixed(decimals));
+    if (withAbbr) {
+        result += `${COUNT_ABBRS[i]}`;
+    }
+    return result;
+}
+
+/* need discussion 
+1001 => 1K+
+
+G, T, P, E, Z,Y are needed in practical */

package/src/accessKeyCodes.js

@@ -0,0 +1,19 @@
+export default {
+    tab : 9,
+    enter : 13,
+    space : 32,
+    rightArrow : 39,
+    leftArrow : 37,
+    topArrow : 38,
+    bottomArrow : 40
+}
+
+export const accessKeyNames = {
+    'tab' : 'tab',
+    'enter' : 'enter',
+    'space' : 'space',
+    'arrowleft' : 'arrowleft',
+    'arrowtop' : 'arrowtop',
+    'arrowright' : 'arrowright',
+    'arrowbottom' : 'arrowbottom'
+}

package/src/applyOpenToCustomize.js

@@ -0,0 +1,32 @@
+/**
+ * Opening the customization, need to addd for behaviour changes. also add only enabled.
+ * @param {*} style 
+ * @param {*} options
+ * Example code
+ * <Component openToCutsomize={{prefix:'dot'}} />
+ * let style = applyOpenToCustomize(style,openToCutsomize)
+ */
+ export default function applyOpenToCustomize(style, options) {
+
+  let resultStyle = style;
+
+  if (options && options.prefix) {
+
+    resultStyle = { ...style};
+
+    let defaultPrefix = options.prefix || "";
+
+    if (defaultPrefix) {
+      defaultPrefix = `${defaultPrefix}-`;
+    }
+
+    Object.keys(style).forEach(styleName => {
+      if (resultStyle[styleName] && !resultStyle[styleName].includes(styleName)) {
+        resultStyle[styleName] = `${resultStyle[styleName]} ${defaultPrefix}${styleName}`;
+      }
+    });
+    
+  }
+
+  return resultStyle;
+}