diginet-core-ui 1.3.35 → 1.3.36

package/readme.md

@@ -38,6 +38,17 @@ npm test
 ```
 
 ## Changelog
+## 1.3.36
+\[Added\]: MenuIcon - W05F0013N0000, MHRP39N0017, MHRM09N0005, MHRM13N0001
+\[Changed\]: Attachment - Add prop domain, isStripDomain
+\[Changed\]: Tooltip - Add className
+\[Changed\]: Avatar - Add Add lazyLoading
+\[Changed\]: Popover - Change transition; Add prop direction; Add description on storybook
+\[Changed\]: TECH - Hide unused components on storybook
+\[Changed\]: Typography - Add prop showTooltip to show tooltip when content is clamped 
+\[Changed\]: DropdownBox - Add endIcon
+\[Fixed\]: Tooltip - Fix bug not show tooltip; Optimize code
+
 ## 1.3.35
 - \[Added\]: Icon - AssignmentTurnedIn, DGNProducts
 - \[Added\]: MenuIcon - MHRP09N0032

package/styles/general.js

@@ -2,6 +2,27 @@ import { css, jsx } from '@emotion/core';
 import { color } from './colors';
 import { parseToPixel } from './utils';
 export const rootSpacing = 4;
+export const rootZIndex = 100;
+/**
+ * get value zIndex with rootZIndex
+ * @param number
+ * @return {number}
+ */
+
+export const zIndex = number => {
+  number = Number(number || 0);
+  if (isNaN(number)) return rootZIndex;
+  return rootZIndex + number;
+};
+/**
+ * get value spacing with rooSpacing
+ * @param vl - default 1
+ * @returns {number}
+ */
+
+export const getSpacing = (vl = 1) => {
+  return Number(vl) * rootSpacing;
+};
 export const flexRow = css`
     display: flex;
 `;

package/theme/settings.js

@@ -1,7 +1,7 @@
 import * as colors from '../styles/colors';
 import { font } from '../styles/font';
 import { color } from '../styles/colors';
-import { rootSpacing } from '../styles/general';
+import { getSpacing, zIndex } from '../styles/general';
 const {
   fontSize,
   fontFamily,
@@ -41,13 +41,13 @@ const settings = {
     fontFamilyBold,
     fontSize,
     label: {
-      fontSize: 12,
+      fontSize: '12px',
       fontFamily,
       fontWeight: '500',
       lineHeight: '16px'
     },
     helperText: {
-      fontSize: 12,
+      fontSize: '12px',
       fontFamily,
       fontWeight: 'normal',
       lineHeight: '16px'
@@ -55,27 +55,18 @@ const settings = {
   },
   breakpoints: {
     values: {
-      xs: 0,
-      sm: 600,
-      md: 960,
-      lg: 1280,
-      xl: 1920
+      xs: 600,
+      sm: 960,
+      md: 1280,
+      lg: 1920
     },
     down: value => getMedia(value, 'max'),
     up: value => getMedia(value, 'min'),
     only: value => getMedia(value, 'min', value),
     between: (start, end) => getMedia(start, 'min', end)
   },
-  spacing: vl => getSpacing(vl)
-};
-/**
- * get value spacing with rooSpacing
- * @param vl - default 1
- * @returns {number}
- */
-
-const getSpacing = (vl = 1) => {
-  return Number(vl) * rootSpacing;
+  spacing: vl => getSpacing(vl),
+  zIndex: vl => zIndex(vl)
 };
 
 const getMedia = (value, type, value2 = '') => {

package/utils/intersectionObserver.js

@@ -0,0 +1,41 @@
+import { useEffect } from 'react';
+let listenerCallbacks = new WeakMap();
+let observer;
+
+const handleIntersections = entries => {
+  entries.forEach(entry => {
+    if (listenerCallbacks.has(entry.target)) {
+      let cb = listenerCallbacks.get(entry.target);
+
+      if (entry.isIntersecting || entry.intersectionRatio > 0) {
+        observer.unobserve(entry.target);
+        listenerCallbacks.delete(entry.target);
+        cb();
+      }
+    }
+  });
+};
+
+const getIntersectionObserver = () => {
+  if (observer === undefined) {
+    observer = new IntersectionObserver(handleIntersections, {
+      rootMargin: '100px',
+      threshold: '0.15'
+    });
+  }
+
+  return observer;
+};
+
+export const useIntersection = (elem, callback) => {
+  useEffect(() => {
+    let target = elem.current;
+    let observer = getIntersectionObserver();
+    listenerCallbacks.set(target, callback);
+    observer.observe(target);
+    return () => {
+      listenerCallbacks.delete(target);
+      observer.unobserve(target);
+    };
+  }, []);
+};

package/utils/number.js

@@ -1,7 +1,7 @@
-/**
- *
- * @param {String} value
- * @param {String} format
+/**
+ *
+ * @param {String} value
+ * @param {String} format
  */
 export default function numberFormat(value, format) {
   let hashCount = 0;
@@ -44,8 +44,8 @@ export default function numberFormat(value, format) {
         //For case like +1 (911) 911 91 91 having pattern +1 (###) ### ## ##
 
         const index = i === ln ? value.length : value.indexOf(part, start);
-        /* in any case if we don't find the pattern part in the value assume the val as numeric string
-        This will be also in case if user has started typing, in any other case it will not be -1
+        /* in any case if we don't find the pattern part in the value assume the val as numeric string
+        This will be also in case if user has started typing, in any other case it will not be -1
         unless wrong prop value is provided */
 
         if (index === -1) {