diginet-core-ui 1.3.78 → 1.3.79

package/utils/render-portal.js

@@ -2,7 +2,7 @@ import { Children } from 'react';
 import { render, createPortal } from 'react-dom';
 import { useTheme } from '../theme';
 const idPortal = 'DGN-UI-Portal',
-      classNameCommon = 'DGN-UI-Portal';
+  classNameCommon = 'DGN-UI-Portal';
 const {
   zIndex
 } = useTheme();
@@ -16,13 +16,11 @@ export const getPortal = () => {
 };
 export const isLastChildNode = node => {
   if (!node) return false;
-
   if (typeof node === 'string') {
     node = document.querySelector(node);
   } else {
     node = node.current || node.target || node;
   }
-
   const portal = getPortal();
   const length = portal.childNodes.length;
   return length && portal.lastChild.contains(node);
@@ -34,16 +32,13 @@ export const renderPortal = (node, containers, isCreate = false, options = {}) =
   } = options;
   let container = getPortal();
   Object.assign(container, style);
-
   if (className) {
     container.classList.add(className);
   }
-
   if (containers) {
     containers.classList.add(classNameCommon);
     containers.style.pointerEvents = 'auto';
     container = container.appendChild(containers);
-
     if (isCreate) {
       return /*#__PURE__*/createPortal(node, container);
     } else {
@@ -67,7 +62,6 @@ export const renderPortal = (node, containers, isCreate = false, options = {}) =
       parent.classList.add(classNameCommon);
       parent.style.pointerEvents = 'auto';
       container = container.appendChild(parent);
-
       if (isCreate) {
         return /*#__PURE__*/createPortal(children, container);
       } else {
@@ -82,12 +76,10 @@ export const removePortal = node => {
     removePortalCommon();
     return true;
   }
-
   return false;
 };
 export const removePortalCommon = () => {
   const portals = getPortal();
-
   if (!portals.childNodes.length) {
     portals.remove();
   }

package/utils/renderHTML.js

@@ -1,20 +1,18 @@
 /** @jsxRuntime classic */
-
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import parseTextToHTML from './parseHTML';
-
 const renderHTML = (text = null, TagName = 'div', options = {}) => {
   if (text && (text.$$typeof && String(text.$$typeof) === 'Symbol(react.element)' || Array.isArray(text) && text.some(node => node && String(node.$$typeof) === 'Symbol(react.element)'))) {
-    return jsx(TagName, { ...options
+    return jsx(TagName, {
+      ...options
     }, text);
   }
-
-  return jsx(TagName, { ...options,
+  return jsx(TagName, {
+    ...options,
     dangerouslySetInnerHTML: {
       __html: parseTextToHTML(String(text))
     }
   });
 };
-
 export default renderHTML;

package/utils/renderIcon.js

@@ -1,5 +1,4 @@
 /** @jsxRuntime classic */
-
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { ButtonIcon } from '../components';
@@ -11,53 +10,44 @@ import { parseTextToHTML, capitalize } from './';
  * @param {String} type text to parse text to HTML, img link to use img tag, name to use icon form icons store
  * @param {Object} options properties of Icon component if us type is name {width, height, color, viewBox, ...}
  */
-
 const renderIcon = (source, type, options = {}) => {
   if (typeof source === 'string') {
     switch (type) {
       case 'name':
         {
           let IconComp = Icons[capitalize(source)];
-
           if (IconComp) {
-            return jsx(IconComp, { ...options
+            return jsx(IconComp, {
+              ...options
             });
           }
-
           return null;
         }
-
       case 'effect':
         return jsx(ButtonIcon, {
           viewType: 'ghost',
           name: source,
           ...options
         });
-
       case 'link':
       case 'imgLink':
         return jsx("img", {
           src: source,
           ...options
         });
-
       default:
         if (source.length < 20) {
           const IconComp = Icons[capitalize(source)];
-
           if (IconComp) {
-            return jsx(IconComp, { ...options
+            return jsx(IconComp, {
+              ...options
             });
           }
-
           return null;
         }
-
         return parseTextToHTML(source, options.output || options);
     }
   }
-
   return source;
 };
-
 export default renderIcon;

package/utils/sb-template.js

@@ -40,7 +40,8 @@ export const Template = ({
                             ${alignMap.get(align)};
                         `
   }, [{}, ...propsCustom].map((itemProps, indexProps) => {
-    const argsTemp = { ...args,
+    const argsTemp = {
+      ...args,
       ...itemProps
     };
     return /*#__PURE__*/React.createElement(Tooltip, {
@@ -48,11 +49,11 @@ export const Template = ({
       disabled: disabledTooltip,
       key: indexProps,
       title: JSON.stringify(argsTemp)
-    }, /*#__PURE__*/React.createElement(Component, { ...argsTemp
+    }, /*#__PURE__*/React.createElement(Component, {
+      ...argsTemp
     }));
   })))));
 };
-
 const StoryBookTemplate = ({
   args,
   component,
@@ -79,7 +80,8 @@ const StoryBookTemplate = ({
       key: idx,
       horizontal: horizontal,
       title: title,
-      args: { ...args,
+      args: {
+        ...args,
         ...argsExtra
       },
       component: component,
@@ -89,7 +91,6 @@ const StoryBookTemplate = ({
     });
   })));
 };
-
 Template.defaultProps = {
   propsCustom: [],
   disabledTooltip: false,

package/utils/string/capitalize.js

@@ -1,4 +1,3 @@
 const capitalize = s => s && s.charAt(0).toUpperCase() + s.slice(1) || '';
-
 export const capitalizeLocale = ([first, ...rest], locale = navigator.language) => first.toLocaleUpperCase(locale) + rest.join('');
 export default capitalize;

package/utils/string/capitalizeSentenceCase.js

@@ -1,10 +1,8 @@
 import capitalize from './capitalize';
 export default function capitalizeSentenceCase(string, separator = ' ') {
   const sentence = string.toLowerCase().split(`${separator}`);
-
   for (let i in sentence) {
     sentence[i] = capitalize(sentence[i]);
   }
-
   return sentence.join(`${separator}`);
 }

package/utils/string/string.js

@@ -3,46 +3,36 @@ export const encodeHtml = str => {
   const encodeRegExp = [new RegExp('&', 'g'), new RegExp('"', 'g'), new RegExp("'", 'g'), new RegExp('<', 'g'), new RegExp('>', 'g')];
   return String(str).replace(encodeRegExp[0], '&amp;').replace(encodeRegExp[1], '&quot;').replace(encodeRegExp[2], '&#39;').replace(encodeRegExp[3], '&lt;').replace(encodeRegExp[4], '&gt;');
 };
-
 const splitQuad = raw => {
   switch (typeof raw) {
     case 'string':
       return raw.split(/\s+/, 4);
-
     case 'object':
       return [raw.x || raw.h || raw.left, raw.y || raw.v || raw.top, raw.x || raw.h || raw.right, raw.y || raw.v || raw.bottom];
-
     case 'number':
       return [raw];
-
     default:
       return raw;
   }
 };
-
 export const quadToObject = raw => {
   const quad = splitQuad(raw);
   let left = parseInt(quad && quad[0], 10);
   let top = parseInt(quad && quad[1], 10);
   let right = parseInt(quad && quad[2], 10);
   let bottom = parseInt(quad && quad[3], 10);
-
   if (!isFinite(left)) {
     left = 0;
   }
-
   if (!isFinite(top)) {
     top = left;
   }
-
   if (!isFinite(right)) {
     right = left;
   }
-
   if (!isFinite(bottom)) {
     bottom = top;
   }
-
   return {
     top: top,
     right: right,
@@ -54,12 +44,10 @@ export const format = (template, ...values) => {
   if (isFunction(template)) {
     return template(...values);
   }
-
   values.forEach((value, index) => {
     if (isString(value)) {
       value = value.replace(/\$/g, '$$$$');
     }
-
     const placeholderReg = new RegExp('\\{' + index + '\\}', 'gm');
     template = template.replace(placeholderReg, value);
   });
@@ -68,7 +56,6 @@ export const format = (template, ...values) => {
 export const replaceAll = (() => {
   const quote = str => (str + '').replace(/([+*?.[^\]$(){}><|=!:])/g, '\\$1'); // lgtm[js/incomplete-sanitization]
 
-
   return (text, searchToken, replacementToken) => text.replace(new RegExp('(' + quote(searchToken) + ')', 'gi'), replacementToken);
 })();
 export const isEmpty = (() => {

package/utils/type.js

@@ -5,86 +5,65 @@ const types = {
   '[object String]': 'string',
   '[object Null]': 'null'
 };
-
 const type = object => {
   const typeOfObject = Object.prototype.toString.call(object);
   return typeof object === 'object' ? types[typeOfObject] || 'object' : typeof object;
 };
-
 const isBoolean = object => {
   return typeof object === 'boolean';
 };
-
 const isExponential = value => {
   return isNumeric(value) && value.toString().indexOf('e') !== -1;
 };
-
 const isDate = object => {
   return type(object) === 'date';
 };
-
 const isDefined = object => {
   return object !== null && object !== undefined;
 };
-
 const isFunction = object => {
   return typeof object === 'function';
 };
-
 const isString = object => {
   return typeof object === 'string';
 };
-
 const isNumeric = object => {
   return typeof object === 'number' && isFinite(object) || !isNaN(object - parseFloat(object));
 };
-
 const isObject = object => {
   return type(object) === 'object';
 };
-
 const isEmptyObject = object => {
   let property;
-
   for (property in object) {
     return false;
   }
-
   return true;
 };
-
 const isPlainObject = object => {
   if (!object || Object.prototype.toString.call(object) !== '[object Object]') {
     return false;
   }
-
   const proto = Object.getPrototypeOf(object);
   const ctor = Object.hasOwnProperty.call(proto, 'constructor') && proto.constructor;
   return typeof ctor === 'function' && Object.toString.call(ctor) === Object.toString.call(Object);
 };
-
 const isPrimitive = value => {
   return ['object', 'array', 'function'].indexOf(type(value)) === -1;
 };
-
 const isWindow = object => {
   return object != null && object === object.window;
 };
-
 const isRenderer = object => {
   return !!(object.jquery || object.dxRenderer);
 };
-
 const isPromise = object => {
   return object && isFunction(object.then);
 };
-
 const isDeferred = object => {
   return object && isFunction(object.done) && isFunction(object.fail);
 };
-
 const isEvent = object => {
   return !!(object && object.preventDefault);
 };
-
 export { isBoolean, isExponential, isDate, isDefined, isFunction, isString, isNumeric, isObject, isEmptyObject, isPlainObject, isPrimitive, isWindow, isRenderer, isPromise, isDeferred, type, isEvent };

package/utils/updatePosition.js

@@ -11,8 +11,8 @@ const updatePosition = (anchorEl, transformEl, cb) => {
   } = window;
   const {
     height: nodeHeight
-  } = transformEl.getBoundingClientRect(); // Vertical
-
+  } = transformEl.getBoundingClientRect();
+  // Vertical
   if (bottom < 0 || top > innerHeight) {
     cb === null || cb === void 0 ? void 0 : cb();
   } else if (bottom + 4 + nodeHeight > innerHeight) {
@@ -23,14 +23,13 @@ const updatePosition = (anchorEl, transformEl, cb) => {
     }
   } else {
     transformEl.style.top = bottom + 4 + 'px';
-  } // Horizontal
-
+  }
 
+  // Horizontal
   if (left < 0 || right > innerWidth) {
     cb === null || cb === void 0 ? void 0 : cb();
   } else {
     transformEl.style.left = left + 'px';
   }
 };
-
 export default updatePosition;

package/utils/useDelayUnmount.js

@@ -1,19 +1,15 @@
 import { useState, useEffect } from 'react';
-
 const useDelayUnmount = (isMounted, delayTime) => {
   const [show, setShow] = useState(false);
   useEffect(() => {
     let timeoutId;
-
     if (isMounted && !show) {
       setShow(true);
     } else if (!isMounted && show) {
       timeoutId = setTimeout(() => setShow(false), delayTime);
     }
-
     return () => clearTimeout(timeoutId);
   }, [isMounted, delayTime, show]);
   return show;
 };
-
 export default useDelayUnmount;

package/utils/useElementSize.js

@@ -1,14 +1,20 @@
 import { useCallback, useLayoutEffect, useState } from 'react';
-import { useEventListener } from './useEventListener'; // Usage:
+import { useEventListener } from './useEventListener';
+
+// Usage:
 // export const Component = () => {
 //     const [isVisible, setVisible] = useState(true);
 //     const [squareRef, { width, height }] = useElementSize();
+
 //     const toggleVisibility = () => setVisible(x => !x);
+
 //     return (
 //         <>
 //             <p>{`The square width is ${width}px and height ${height}px`}</p>
 //             <p>Try, resize your window and-or click on the button.</p>
+
 //             <button onClick={toggleVisibility}>{isVisible ? 'Hide' : 'Show'} square</button>
+
 //             {isVisible && (
 //                 <div
 //                     ref={squareRef}
@@ -32,8 +38,8 @@ export const useElementSize = () => {
   const [size, setSize] = useState({
     width: 0,
     height: 0
-  }); // Prevent too many rendering using useCallback
-
+  });
+  // Prevent too many rendering using useCallback
   const handleSize = useCallback(() => {
     setSize({
       width: (ref === null || ref === void 0 ? void 0 : ref.offsetWidth) || 0,

package/utils/useEventListener.js

@@ -1,17 +1,24 @@
-import { useEffect, useLayoutEffect, useRef } from 'react'; // Usage:
+import { useEffect, useLayoutEffect, useRef } from 'react';
+
+// Usage:
 // export const Component = () => {
 //     // Define button ref
 //     const buttonRef = useRef < HTMLButtonElement > null;
+
 //     const onScroll = (event: Event) => {
 //         console.log("window scrolled!", event);
 //     };
+
 //     const onClick = (event: Event) => {
 //         console.log("button clicked!", event);
 //     };
+
 //     // example with window based event
 //     useEventListener("scroll", onScroll);
+
 //     // example with element based event
 //     useEventListener("click", onClick, buttonRef);
+
 //     return (
 //         <div style={{ minHeight: "200vh" }}>
 //             <button ref={buttonRef}>Click me</button>
@@ -28,16 +35,15 @@ export const useEventListener = (eventName, handler, element) => {
   useEffect(() => {
     // Define the listening target
     const targetElement = (element === null || element === void 0 ? void 0 : element.current) || window;
-
     if (!(targetElement && targetElement.addEventListener)) {
       return;
-    } // Create event listener that calls handler function stored in ref
-
+    }
 
+    // Create event listener that calls handler function stored in ref
     const eventListener = event => savedHandler.current(event);
+    targetElement.addEventListener(eventName, eventListener);
 
-    targetElement.addEventListener(eventName, eventListener); // Remove event listener on cleanup
-
+    // Remove event listener on cleanup
     return () => {
       targetElement.removeEventListener(eventName, eventListener);
     };

package/utils/useInput.js

@@ -1,5 +1,4 @@
 import { useEffect, useRef, useState } from 'react';
-
 const useInput = (defaultValue, valueProp, onChange, onInput, delayOnChange) => {
   const [value, setValue] = useState(defaultValue || valueProp);
   const timer = useRef(null);
@@ -7,24 +6,20 @@ const useInput = (defaultValue, valueProp, onChange, onInput, delayOnChange) =>
   useEffect(() => {
     setValue(valueProp);
   }, [valueProp]);
-
   const _onChange = e => {
     e.persist();
     if (timer.current) clearTimeout(timer.current);
     timer.current = setTimeout(() => {
       const valueInput = e.target.value || e.value;
       setValue(valueInput);
-
       e.reset = () => {
         setValue(valueProp);
         e.target.value = valueProp;
         onInput === null || onInput === void 0 ? void 0 : onInput(e);
       };
-
       onChange === null || onChange === void 0 ? void 0 : onChange(e);
     }, delayOnChange);
   };
-
   return {
     value,
     setValue,
@@ -35,5 +30,4 @@ const useInput = (defaultValue, valueProp, onChange, onInput, delayOnChange) =>
     }
   };
 };
-
 export default useInput;

package/utils/useMediaQuery.js

@@ -1,4 +1,6 @@
-import { useEffect, useState } from 'react'; // Usage:
+import { useEffect, useState } from 'react';
+
+// Usage:
 // export default function Component() {
 //     const matches = useMediaQuery('(min-width: 768px)');
 //     return <div>{`The view port is ${matches ? 'at least' : 'less than'} 768 pixels wide`}</div>;
@@ -10,28 +12,25 @@ const useMediaQuery = query => {
     if (typeof window !== 'undefined') {
       return window.matchMedia(query).matches;
     }
-
     return false;
   };
-
   const [matches, setMatches] = useState(getMatches(query));
-
   const handleChange = () => {
     setMatches(getMatches(query));
   };
-
   useEffect(() => {
-    const matchMedia = window.matchMedia(query); // Triggered at the first client-side load and if query changes
+    const matchMedia = window.matchMedia(query);
 
-    handleChange(); // Listen matchMedia
-    // TODO: Use `addEventListener` once support for Safari < 14 is dropped
+    // Triggered at the first client-side load and if query changes
+    handleChange();
 
+    // Listen matchMedia
+    // TODO: Use `addEventListener` once support for Safari < 14 is dropped
     if (matchMedia.addListener) {
       matchMedia.addListener(handleChange);
     } else {
       matchMedia.addEventListener('change', handleChange);
     }
-
     return () => {
       if (matchMedia.removeListener) {
         matchMedia.removeListener(handleChange);
@@ -42,5 +41,4 @@ const useMediaQuery = query => {
   }, [query]);
   return matches;
 };
-
 export default useMediaQuery;

package/utils/useOnClickOutside.js

@@ -9,10 +9,8 @@ export default function useOnClickOutside(ref, handler) {
       if (!ref.current || ref.current.contains(event.target)) {
         return;
       }
-
       handler(event);
     };
-
     document.addEventListener('mousedown', listener);
     document.addEventListener('touchstart', listener);
     return () => {

package/utils/usePortal.js

@@ -1,50 +1,44 @@
 import { useEffect, useRef } from 'react';
+
 /**
  * Create a element with id
  * @param {string} id 
  */
-
 export const createEl = id => {
   const createdEl = document.createElement('div');
   createdEl.setAttribute('id', id);
   return createdEl;
 };
+
 /**
  * Insert into document.body at last
  * @param {Element} rootElem
  */
-
 export const addRootEl = rootElem => {
   document.body.insertBefore(rootElem, document.body.lastElementChild.nextElementSibling);
 };
+
 /**
  * Create a portal with id
  * @param {string} id 
  */
-
 const usePortal = id => {
   const rootElemRef = useRef(null);
-
   const getRootEl = () => {
     if (!rootElemRef.current) {
       rootElemRef.current = document.createElement('div');
     }
-
     return rootElemRef.current;
   };
-
   useEffect(() => {
     const existingParent = document.querySelector(`#${id}`);
     const parentEl = existingParent || createEl(id);
-
     if (!existingParent) {
       addRootEl(parentEl);
     }
-
     parentEl.appendChild(rootElemRef.current);
     return () => {
       rootElemRef.current.remove();
-
       if (parentEl.childNodes.length === -1) {
         parentEl.remove();
       }
@@ -52,5 +46,4 @@ const usePortal = id => {
   }, []);
   return getRootEl();
 };
-
 export default usePortal;