@nativerent/js-utils 1.0.0 → 1.0.2

package/README.md

@@ -1 +1,3 @@
-# js-utils
+# js-utils
+
+A set of helper functions to manipulate DOM, strings, arrays, objects, and other primitives.

package/dist/index.d.ts

@@ -1,4 +1,10 @@
-type Primitive = string | boolean | number;
+type FlattenableObject = { [key: string]: any };
+
+type Primitive = boolean | number | string;
+
+type SimpleObject = {
+  [key: string]: Primitive | Primitive[] | null | undefined;
+};
 
 declare function debounce(fn: Function, delay: number): () => void;
 declare function throttle(fn: Function, delay: number): (...args: any[]) => void;
@@ -29,10 +35,23 @@ declare function objectHasProp(obj: any, prop: string | number | symbol): boolea
 declare function getObjectKeys(object: object): string[];
 /**
  * Works with primitive objects, see JSDoc @param
- *
- * @param object {[key: string]: SimpleObject | { [key: string]: SimpleObject }}
  */
-declare function objectToQueryString(object: object): string;
+declare function objectToQueryString(object: {
+    [key: string]: SimpleObject | {
+        [key: string]: SimpleObject;
+    };
+}): string;
+declare function countObjectInnerLength(object: {
+    [key: string | number]: any;
+}): any;
+/**
+ * Check if the element is in viewport
+ */
+declare const isElementVisible: (element: HTMLElement, minVisiblePercent?: number) => boolean;
+/**
+ * Find a DOM element where an ad unit should be rendered to
+ */
+declare function getHtmlElement(id: string): HTMLElement | null;
 declare function decodeSafeURL(url: string): string;
 declare function getSafeURL(url: string): string;
 declare function parseURL(url: string): URL;
@@ -70,11 +89,126 @@ declare function createScriptElement(js: string, inline?: boolean, attributes?:
  * Create a <style> element
  */
 declare function createStyleElement(css: string | null): HTMLElement;
+/**
+ * Create a <link> element
+ */
+declare function createLinkElement(href: string): HTMLLinkElement;
 /**
  * Create svg elements
  */
 declare function createSvgElement(content: string, attributes: {
     [key: string]: string;
 }): SVGSVGElement;
+/**
+ * Append a new script element to the DOM head
+ */
+declare function insertJs(js: string, inline?: boolean): void;
+/**
+ * Append a new style element to the DOM head
+ */
+declare const insertCss: (css: string, className?: string, external?: boolean) => void;
+/**
+ * Get screen sizes
+ */
+declare function getScreenSize(): {
+    width: number;
+    height: number;
+};
+/**
+ * Get a random integer between min and max
+ */
+declare function getRandomInt(min?: number, max?: number): number;
+/**
+ * Create an image element to use as a tracking pixel
+ */
+declare function createPixelElement(src: string): HTMLImageElement;
+/**
+ * Implementation of Java's String.hashCode() method
+ */
+declare function hashCode(str: string): number;
+/**
+ * Executes a callback as soon as DOM is interactive
+ */
+declare function onDOMReady(callback: Function, ...args: any[]): void;
+/**
+ * Calculate the percentage of two values
+ *
+ * @param a
+ * @param b
+ * @return number
+ */
+declare function toPercent(a: number, b: number): number;
+/**
+ * Make a camelCase string
+ *
+ * @param string
+ * @return string
+ */
+declare function toCamelCase(string: string): string;
+/**
+ * Make a snake_case string
+ *
+ * @param string
+ * @return string
+ */
+declare function toSnakeCase(string: string): string;
+/**
+ * Transform the first letter of the given string to the upper case
+ *
+ * @param string
+ * @return string
+ */
+declare function capitalize(string: string): string;
+/**
+ * Registry independent string sorting
+ *
+ * @param first
+ * @param second
+ */
+declare function sortByAlphabet(first: string, second: string): number;
+/**
+ * @param length
+ * @return string of max length 100
+ */
+declare function getRandomStr(length?: number): string;
+declare function getRandomItem(items: any[]): any;
+/**
+ * Summarize elements of the given array
+ *
+ * @param values
+ * @return number | string - a summary of all the numbers in the array or an empty string if
+ * there was only NaNs
+ */
+declare function sumArray(values: Array<any>): number | string;
+/**
+ * Returns an array of the object keys which values are not present in filter
+ *
+ * @param obj
+ * @param values
+ */
+declare function filterObjectKeysByValues(obj: {
+    [key: string]: any;
+}, values: Array<string | number | boolean | null | undefined>): string[];
+declare function getFromObject(object: object, key: string): any;
+declare function fireBlurEvent(element: string | Element | null, delay?: number): void;
+declare function fireInputEvent(element: string | Element | null, delay?: number): void;
+declare function fireEvent(eventName: string, element: string | Element | null, delay?: number): void;
+declare function hasObjectChanged(object: {
+    [key: string]: any;
+}, values: any[]): boolean;
+declare function roundBigNum(number: number): number;
+declare function extractNumbers(value: any): string;
+declare function removeSpaces(value: any): string;
+declare function roundUp(num: number, precision: number): number;
+declare function roundDown(num: number, precision: number): number;
+declare function areDiff(val1?: Primitive | null, val2?: Primitive | null, strict?: boolean): boolean;
+declare function flattenObject(obj: FlattenableObject, prefix?: string): FlattenableObject;
+declare function flattenObjectAsArray(obj: FlattenableObject): FlattenableObject;
+declare function parseObjectPathStr(pathStr: string): string[];
+declare function formatNumber(num: number | string, fractionDigits?: number): string;
+declare function formatNumberWithSign(num: number | string, fractionDigits?: number): string;
+declare function formatPercent(num: number | string): string;
+declare function formatWithSign(num: number | string, numString?: string): string;
+declare function autoSizeText(el: HTMLElement, height: number, minFontSize: number, maxFontSize?: number): void;
 
-export { arrayDiff, arrayIntersect, createHtmlElement, createScriptElement, createStyleElement, createSvgElement, debounce, decodeSafeURL, deepCloneObject, encodeQueryString, flatHtmlAttributes, getNumericStyleProp, getObjectKeys, getSafeURL, injectScript, injectStyleLink, insertHtmlElements, isBool, isDefined, isFn, isHTMLElement, isNullOrUndef, isNum, isObject, isStr, isString, isUndef, objectHasProp, objectToQueryString, parseURL, stringToHtmlElements, throttle, toBinaryStr };
+export { areDiff, arrayDiff, arrayIntersect, autoSizeText, capitalize, countObjectInnerLength, createHtmlElement, createLinkElement, createPixelElement, createScriptElement, createStyleElement, createSvgElement, debounce, decodeSafeURL, deepCloneObject, encodeQueryString, extractNumbers, filterObjectKeysByValues, fireBlurEvent, fireEvent, fireInputEvent, flatHtmlAttributes, flattenObject, flattenObjectAsArray, formatNumber, formatNumberWithSign, formatPercent, formatWithSign, getFromObject, getHtmlElement, getNumericStyleProp, getObjectKeys, getRandomInt, getRandomItem, getRandomStr, getSafeURL, getScreenSize, hasObjectChanged, hashCode, injectScript, injectStyleLink, insertCss, insertHtmlElements, insertJs, isBool, isDefined, isElementVisible, isFn, isHTMLElement, isNullOrUndef, isNum, isObject, isStr, isString, isUndef, objectHasProp, objectToQueryString, onDOMReady, parseObjectPathStr, parseURL, removeSpaces, roundBigNum, roundDown, roundUp, sortByAlphabet, stringToHtmlElements, sumArray, throttle, toBinaryStr, toCamelCase, toPercent, toSnakeCase };

package/dist/index.js

@@ -79,11 +79,44 @@ function objectToQueryString(object) {
     if (Array.isArray(v)) {
       return v.map((item) => `${k}[]=${encodeURIComponent(item)}`).join("&");
     } else if (isObject(v)) {
-      v = JSON.stringify(v);
+      return `${k}=${encodeURIComponent(JSON.stringify(v))}`;
     }
     return `${k}=${encodeURIComponent(v || "")}`;
   }).join("&");
 }
+function countObjectInnerLength(object) {
+  const obj = Object.values(object);
+  return obj.length === 1 ? obj[0].length : obj.reduce((acc, cur) => {
+    if (Array.isArray(acc)) {
+      acc = acc.length;
+    }
+    if (cur) {
+      acc += cur.length;
+    }
+    return acc;
+  });
+}
+const isElementVisible = (element, minVisiblePercent = 50) => {
+  const elementCoords = element.getBoundingClientRect();
+  const elementHeight = elementCoords.height;
+  if (!elementHeight) {
+    return false;
+  }
+  const elementTop = elementCoords.top;
+  const elementBottom = elementCoords.bottom;
+  const viewPortHeight = window.innerHeight;
+  const elementVisibleHeight = elementTop > 0 ? (
+    // the element is in or below viewport
+    viewPortHeight - elementTop
+  ) : (
+    // the element is still in or above viewport
+    elementBottom
+  );
+  return elementVisibleHeight / elementHeight * 100 >= minVisiblePercent;
+};
+function getHtmlElement(id) {
+  return document.getElementById(id);
+}
 function decodeSafeURL(url) {
   try {
     return decodeURI(url);
@@ -222,6 +255,12 @@ function createStyleElement(css) {
   }
   return element;
 }
+function createLinkElement(href) {
+  const element = createHtmlElement("link");
+  element.rel = "stylesheet";
+  element.href = href;
+  return element;
+}
 function createSvgElement(content, attributes) {
   const attrs = getObjectKeys(attributes);
   const element = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -233,10 +272,294 @@ function createSvgElement(content, attributes) {
   element.innerHTML = content;
   return element;
 }
+function insertJs(js, inline = false) {
+  const element = createScriptElement(js, inline);
+  document.head.appendChild(element);
+}
+const insertCss = (css, className, external = false) => {
+  const element = external ? createLinkElement(css) : createStyleElement(css);
+  if (className) {
+    element.className = className;
+  }
+  document.head.appendChild(element);
+};
+function getScreenSize() {
+  let width, height;
+  if (window.screen) {
+    width = screen.width;
+    height = screen.height;
+  } else {
+    width = window.innerWidth;
+    height = window.innerHeight;
+  }
+  return {
+    width,
+    height
+  };
+}
+function getRandomInt(min = 0, max = 4294967295) {
+  min = Math.ceil(min);
+  max = Math.floor(max);
+  return Math.floor(Math.random() * (max - min)) + min;
+}
+function createPixelElement(src) {
+  const image = document.createElement("img");
+  image.src = src;
+  image.width = 1;
+  image.height = 1;
+  image.style.position = "absolute";
+  image.style.left = "-99999px";
+  return image;
+}
+function hashCode(str) {
+  let hash = 0, chr;
+  for (let i = 0; i < str.length; i++) {
+    chr = str.charCodeAt(i);
+    hash = (hash << 5) - hash + chr;
+    hash |= 0;
+  }
+  return hash >>> 0;
+}
+function onDOMReady(callback, ...args) {
+  if (document.readyState === "interactive" || document.readyState === "complete") {
+    callback(...args);
+  } else {
+    document.addEventListener("DOMContentLoaded", () => callback(...args));
+  }
+}
+function toPercent(a, b) {
+  return b > 0 ? a / b * 100 : 0;
+}
+function toCamelCase(string) {
+  return string.split(new RegExp(/[-_.]/)).reduce(
+    (a, b) => a + b.charAt(0).toUpperCase() + b.slice(1)
+  );
+}
+function toSnakeCase(string) {
+  return toCamelCase(string).replace(/(^[A-Z])?([A-Z])/gm, "$1_$2").toLowerCase();
+}
+function capitalize(string) {
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
+function sortByAlphabet(first, second) {
+  return first.toLowerCase() > second.toLowerCase() ? 1 : -1;
+}
+function getRandomStr(length) {
+  length = length ? length > 100 ? 100 : length : 10;
+  let str = Math.random().toString(36).substring(2);
+  while (str.length < length) {
+    str += Math.random().toString(36).substring(2);
+  }
+  const result = str.slice(-length);
+  return isNaN(Number(result)) ? result : getRandomStr(length);
+}
+function getRandomItem(items) {
+  return items[Math.floor(Math.random() * items.length)];
+}
+function sumArray(values) {
+  if (values.every((value) => isNaN(value))) {
+    return "";
+  } else {
+    return values.reduce((sum, curr) => {
+      const value = Number(curr);
+      if (!isNaN(value)) {
+        return sum + value;
+      } else {
+        return sum;
+      }
+    }, 0);
+  }
+}
+function filterObjectKeysByValues(obj, values) {
+  values = Array.isArray(values) ? values : Array(values);
+  const keys = [];
+  for (const key in obj) {
+    if (!values.includes(obj[key])) {
+      keys.push(key);
+    }
+  }
+  return keys;
+}
+function getFromObject(object, key) {
+  return key.split(".").reduce((a, b) => {
+    return a[b];
+  }, object);
+}
+function fireBlurEvent(element, delay = 0) {
+  fireEvent("blur", element, delay);
+}
+function fireInputEvent(element, delay = 0) {
+  fireEvent("input", element, delay);
+}
+function fireEvent(eventName, element, delay = 0) {
+  setTimeout(() => {
+    if (isString(element)) {
+      element = document.querySelector(element);
+    }
+    if (!isNullOrUndef(element)) {
+      element.dispatchEvent(
+        new Event(eventName, {
+          bubbles: true
+        })
+      );
+    }
+  }, delay);
+}
+function hasObjectChanged(object, values) {
+  let hasChanged = false;
+  for (const key in object) {
+    let oldVal = object[key];
+    let [, newVal] = values.find(([newKey]) => key === newKey);
+    if (isObject(oldVal)) {
+      if (!isObject(newVal)) {
+        hasChanged = true;
+      } else {
+        hasChanged = hasObjectChanged(oldVal, Object.entries(newVal));
+      }
+    } else if (Array.isArray(newVal) || Array.isArray(oldVal)) {
+      newVal = Array.isArray(newVal) ? newVal : [];
+      oldVal = Array.isArray(oldVal) ? oldVal : [];
+      hasChanged = arrayDiff(newVal, oldVal).length > 0;
+    } else {
+      hasChanged = areDiff(newVal, oldVal);
+    }
+    if (hasChanged) {
+      break;
+    }
+  }
+  return hasChanged;
+}
+function roundBigNum(number) {
+  const digitsNum = Math.trunc(number).toString().length;
+  let roundTo = 0;
+  switch (true) {
+    case (digitsNum > 2 && digitsNum < 5):
+      roundTo = 100;
+      break;
+    case digitsNum >= 5:
+      roundTo = 1e4;
+      break;
+  }
+  return roundTo ? Math.round(number / roundTo) * roundTo : number;
+}
+function extractNumbers(value) {
+  if (!isStr(value) && !isNum(value)) {
+    return "";
+  }
+  return value.toString().replace(/[^0-9]/g, "");
+}
+function removeSpaces(value) {
+  if (!isStr(value) && !isNum(value)) {
+    return "";
+  }
+  return value.toString().replace(/\s/g, "");
+}
+function roundUp(num, precision) {
+  const multiplier = Number("1".padEnd(precision + 1, "0"));
+  return Math.ceil(num * multiplier) / multiplier;
+}
+function roundDown(num, precision) {
+  const multiplier = Number("1".padEnd(precision + 1, "0"));
+  return Math.floor(num * multiplier) / multiplier;
+}
+function areDiff(val1, val2, strict) {
+  if (strict) {
+    return val1 !== val2;
+  }
+  if (Boolean(val1) || Boolean(val2)) {
+    return val1 != val2;
+  }
+  return false;
+}
+function flattenObject(obj, prefix = "") {
+  return Object.keys(obj).reduce((acc, k) => {
+    const pre = prefix.length ? prefix + "." : "";
+    if (isObject(obj[k]) || Array.isArray(obj[k])) {
+      Object.assign(acc, flattenObject(obj[k], pre + k));
+    } else {
+      acc[pre + k] = obj[k];
+    }
+    return acc;
+  }, {});
+}
+function flattenObjectAsArray(obj) {
+  const result = {};
+  const flat = flattenObject(obj);
+  Object.keys(flat).forEach((key) => {
+    const newKey = key.replaceAll(/\.([^.]+)/g, "[$1]");
+    result[newKey] = flat[key];
+  });
+  return result;
+}
+function parseObjectPathStr(pathStr) {
+  const pathParts = pathStr.replace(/\[/g, ".").replace(/\]/g, "").split(".");
+  if (pathParts.length > 1 && pathParts[1].includes("[")) {
+    return [pathParts[0], ...parseObjectPathStr(pathParts[1])];
+  }
+  return pathParts;
+}
+function formatNumber(num, fractionDigits) {
+  fractionDigits = isNullOrUndef(fractionDigits) ? 2 : fractionDigits;
+  return new Intl.NumberFormat("ru-RU", {
+    style: "decimal",
+    minimumFractionDigits: fractionDigits,
+    maximumFractionDigits: fractionDigits
+  }).format(Number(num)).replace(",", ".").replace(/\u00A0/g, " ");
+}
+function formatNumberWithSign(num, fractionDigits) {
+  return formatWithSign(num, formatNumber(num, fractionDigits));
+}
+function formatPercent(num) {
+  return formatNumber(num) + "%";
+}
+function formatWithSign(num, numString) {
+  numString = numString ? numString : num.toString();
+  return (Number(num) < 0 ? "" : "+") + numString;
+}
+function autoSizeText(el, height, minFontSize, maxFontSize = 50) {
+  let attempts = 30;
+  const resizeText = () => {
+    if (getTextHeight() === 0) {
+      return;
+    }
+    while (attempts && getTextHeight() > height) {
+      attempts--;
+      reduceText();
+    }
+    while (attempts && getTextHeight() < height) {
+      attempts--;
+      enlargeText();
+    }
+  };
+  const reduceText = () => {
+    const fontSize = getNumericStyleProp("fontSize", el);
+    const newFontSize = fontSize - 1;
+    if (fontSize > 1 && newFontSize >= minFontSize) {
+      el.style.fontSize = `${newFontSize}px`;
+    }
+  };
+  const enlargeText = () => {
+    const fontSize = getNumericStyleProp("fontSize", el);
+    const newFontSize = fontSize + 1;
+    if (newFontSize <= maxFontSize) {
+      el.style.fontSize = `${newFontSize}px`;
+    }
+  };
+  const getTextHeight = () => Math.floor(
+    el.scrollHeight - getNumericStyleProp("paddingTop", el) - getNumericStyleProp("paddingBottom", el)
+  );
+  resizeText();
+}
 
+exports.areDiff = areDiff;
 exports.arrayDiff = arrayDiff;
 exports.arrayIntersect = arrayIntersect;
+exports.autoSizeText = autoSizeText;
+exports.capitalize = capitalize;
+exports.countObjectInnerLength = countObjectInnerLength;
 exports.createHtmlElement = createHtmlElement;
+exports.createLinkElement = createLinkElement;
+exports.createPixelElement = createPixelElement;
 exports.createScriptElement = createScriptElement;
 exports.createStyleElement = createStyleElement;
 exports.createSvgElement = createSvgElement;
@@ -244,15 +567,37 @@ exports.debounce = debounce;
 exports.decodeSafeURL = decodeSafeURL;
 exports.deepCloneObject = deepCloneObject;
 exports.encodeQueryString = encodeQueryString;
+exports.extractNumbers = extractNumbers;
+exports.filterObjectKeysByValues = filterObjectKeysByValues;
+exports.fireBlurEvent = fireBlurEvent;
+exports.fireEvent = fireEvent;
+exports.fireInputEvent = fireInputEvent;
 exports.flatHtmlAttributes = flatHtmlAttributes;
+exports.flattenObject = flattenObject;
+exports.flattenObjectAsArray = flattenObjectAsArray;
+exports.formatNumber = formatNumber;
+exports.formatNumberWithSign = formatNumberWithSign;
+exports.formatPercent = formatPercent;
+exports.formatWithSign = formatWithSign;
+exports.getFromObject = getFromObject;
+exports.getHtmlElement = getHtmlElement;
 exports.getNumericStyleProp = getNumericStyleProp;
 exports.getObjectKeys = getObjectKeys;
+exports.getRandomInt = getRandomInt;
+exports.getRandomItem = getRandomItem;
+exports.getRandomStr = getRandomStr;
 exports.getSafeURL = getSafeURL;
+exports.getScreenSize = getScreenSize;
+exports.hasObjectChanged = hasObjectChanged;
+exports.hashCode = hashCode;
 exports.injectScript = injectScript;
 exports.injectStyleLink = injectStyleLink;
+exports.insertCss = insertCss;
 exports.insertHtmlElements = insertHtmlElements;
+exports.insertJs = insertJs;
 exports.isBool = isBool;
 exports.isDefined = isDefined;
+exports.isElementVisible = isElementVisible;
 exports.isFn = isFn;
 exports.isHTMLElement = isHTMLElement;
 exports.isNullOrUndef = isNullOrUndef;
@@ -263,8 +608,19 @@ exports.isString = isString;
 exports.isUndef = isUndef;
 exports.objectHasProp = objectHasProp;
 exports.objectToQueryString = objectToQueryString;
+exports.onDOMReady = onDOMReady;
+exports.parseObjectPathStr = parseObjectPathStr;
 exports.parseURL = parseURL;
+exports.removeSpaces = removeSpaces;
+exports.roundBigNum = roundBigNum;
+exports.roundDown = roundDown;
+exports.roundUp = roundUp;
+exports.sortByAlphabet = sortByAlphabet;
 exports.stringToHtmlElements = stringToHtmlElements;
+exports.sumArray = sumArray;
 exports.throttle = throttle;
 exports.toBinaryStr = toBinaryStr;
+exports.toCamelCase = toCamelCase;
+exports.toPercent = toPercent;
+exports.toSnakeCase = toSnakeCase;
 //# sourceMappingURL=index.js.map