diginet-core-ui 1.3.88 → 1.3.89

package/components/typography/index.js

@@ -1,9 +1,7 @@
 /** @jsxRuntime classic */
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/core';
 import { Popover } from "./..";
-import OptionWrapper from "../others/option-wrapper";
 import PropTypes from 'prop-types';
 import { forwardRef, Fragment, memo, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { breakAll, breakWord, cursorPointer, displayBlock, displayInlineBlock, italic, overflowHidden, parseHeight, parseMaxWidth, pd, positionRelative, textCapitalize, textCenter, textColor, textLineThrough, textLowercase, textunderline, textUppercase, whiteSpaceBreakSpaces } from "../../styles/general";
@@ -24,9 +22,7 @@ const {
 } = useTheme();
 const colorMap = new Map([['default', textMain], ['secondary', systemRest]]);
 const formatMap = new Map([['capitalize', textCapitalize], ['uppercase', textUppercase], ['lowercase', textLowercase], ['italic', italic], ['line-through', textLineThrough], ['underline', textunderline]]);
-
 const isTextClamped = elm => (elm === null || elm === void 0 ? void 0 : elm.scrollHeight) > (elm === null || elm === void 0 ? void 0 : elm.clientHeight);
-
 const Typography = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   action = {},
   capitalize,
@@ -47,7 +43,6 @@ const Typography = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   ...props
 }, reference) => {
   var _ref$current;
-
   if (!reference) reference = useRef(null);
   const ref = useRef(null);
   const formatCSS = [];
@@ -56,37 +51,29 @@ const Typography = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   });
   const [openTooltip, setOpenTooltip] = useState(false);
   const _TextRootCSS = [TextRootCSS(color, type, lineClamp, onClick, hoverTooltip), ...formatCSS];
-
   const showTooltip = () => {
     if (!hoverTooltip) return;
-
     if (isTextClamped(ref.current)) {
       setOpenTooltip(true);
     }
   };
-
   const hideTooltip = () => {
     if (!hoverTooltip) return;
-
     if (isTextClamped(ref.current)) {
       setOpenTooltip(false);
     }
   };
-
   useImperativeHandle(reference, () => {
     const currentRef = ref.current || {};
     currentRef.element = ref.current;
-    const _instance = { ...action
+    const _instance = {
+      ...action
     }; // methods
-
     _instance.__proto__ = {}; // hidden methods
-
     currentRef.instance = _instance;
     return currentRef;
   });
-
   const classes = (inTooltip = false) => classNames('DGN-UI-Typography', center && 'DGN-Typography-center', fullWidth && 'DGN-Typography-fullWidth', `DGN-Typography-${type}`, uppercase && `DGN-Typography-Uppercase`, capitalize && 'DGN-Typography-Capitalize', !inTooltip && lineClamp && 'DGN-Typography-Clamp', className);
-
   const content = Array.isArray(children) && !children.some(node => node && String(node.$$typeof) === 'Symbol(react.element)') ? children.join('') : children;
   const renderTooltip = hoverTooltip ? jsx(Popover, {
     open: openTooltip,
@@ -112,7 +99,6 @@ const Typography = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     }), renderTooltip);
   }, [capitalize, center, children, className, color, format, fullWidth, hoverTooltip, italic, lineClamp, mapping, onClick, props, tooltipDirection, type, uppercase, openTooltip]);
 }));
-
 const TextRootCSS = (color, type, lineClamp, onClick, hoverTooltip) => css`
     ${displayInlineBlock};
     ${positionRelative};
@@ -142,7 +128,6 @@ const TextRootCSS = (color, type, lineClamp, onClick, hoverTooltip) => css`
         -webkit-box-orient: vertical;
     }
 `;
-
 const PopoverContentCSS = css`
     ${textColor('text.tooltip')};
     ${pd([1, 1.5])};
@@ -159,58 +144,45 @@ Typography.defaultProps = {
   tooltipDirection: 'bottom',
   type: 'p1'
 };
-/** type of text<br/>
- * h1: Title <br/>
- * h2: Header Popup <br/>
- * h3: Header popup <br/>
- * h4: Button, Tab, Title group <br/>
- * h5: Label column, Title group <br/>
- * h6: Label form <br/>
- * p1: Body text <br/>
- * p2: Body text <br/>
- * p3: Notice, Tooltip <br/>
- */
 
+/** type of text<br/>
+ * h1: Title <br/>
+ * h2: Header Popup <br/>
+ * h3: Header popup <br/>
+ * h4: Button, Tab, Title group <br/>
+ * h5: Label column, Title group <br/>
+ * h6: Label form <br/>
+ * p1: Body text <br/>
+ * p2: Body text <br/>
+ * p3: Notice, Tooltip <br/>
+ */
 export const arrTypeTypography = ['t1', 't2', 't3', 't4', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p1', 'p2', 'p3', 'title1', 'title2', 'title3', 'title4', 'heading1', 'heading2', 'heading3', 'heading4', 'heading5', 'heading6', 'paragraph1', 'paragraph2', 'paragraph3'];
 Typography.propTypes = {
   /** If `true`, text-align is center. */
   center: PropTypes.bool,
-
   /** The content of the component. */
   children: PropTypes.node,
-
   /** Class for component. */
   className: PropTypes.string,
-
   /** Color of text ['primary', 'secondary', 'success', 'warning', 'danger', 'info', '#hex', rgb(#,#,#)]. */
   color: PropTypes.string,
-
   /** Option to make the text bold, italic, capitalize or underline. */
   format: PropTypes.arrayOf(PropTypes.oneOf(['capitalize', 'uppercase', 'lowercase', 'italic', 'line-through', 'underline'])),
-
   /** If `true`, the component will take up the full width of its container. */
   fullWidth: PropTypes.bool,
-
   /** If `true`, hover will show tooltip when text clamped. */
   hoverTooltip: PropTypes.bool,
-
   /** The line-clamp property truncates text at a specific number of lines. */
   lineClamp: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['auto'])]),
-
   /** The component used for the root node. Either a string to use a HTML element or a component. */
   mapping: PropTypes.string,
-
   /** Callback fired when the component is clicked. */
   onClick: PropTypes.func,
-
   /** Accepts all props which `mapping` tag support. */
   props: PropTypes.object,
-
   /** Tooltip direction. */
   tooltipDirection: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
-
   /** Applies the theme typography styles. */
   type: PropTypes.oneOf(arrTypeTypography)
 };
-export { Typography };
-export default OptionWrapper(Typography);
+export default Typography;

package/global/index.js

@@ -149,21 +149,16 @@ const globalObject = {
 };
 export const getGlobal = (key, language = locale.get()) => {
   var _globalObject$languag;
-
   if (Array.isArray(key)) {
     let result = globalObject[language];
-
     for (let i = 0; i < key.length; i++) {
       if (!result[key[i]]) {
         return null;
       }
-
       result = result[key[i]];
     }
-
     return result;
   }
-
   return globalObject[key] || ((_globalObject$languag = globalObject[language]) === null || _globalObject$languag === void 0 ? void 0 : _globalObject$languag[key]);
 };
 export const setGlobal = global => {
@@ -174,11 +169,9 @@ export const setGlobal = global => {
     });
   }
 };
-
 const overrideGlobal = (newGlobal, ingredient, key) => {
   const newGlobalValue = newGlobal[key];
   const rootValue = ingredient[key];
-
   if (typeof newGlobalValue === 'object' && typeof rootValue === 'object') {
     const newGlobalKeys = Object.keys(newGlobalValue);
     newGlobalKeys.forEach(newKey => {
@@ -190,5 +183,4 @@ const overrideGlobal = (newGlobal, ingredient, key) => {
     globalObject[key] = newGlobalValue;
   }
 };
-
 export default globalObject;

package/icons/basic.js

@@ -1,5 +1,4 @@
 /* eslint-disable react/display-name */
-
 /* eslint-disable react/prop-types */
 import React, { memo } from 'react';
 import { useTheme } from "../theme";
@@ -25,7 +24,6 @@ export const Account = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -120,7 +118,6 @@ export const AddItem = /*#__PURE__*/memo(({
       fill: colors[color] || color
     })));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 17,
@@ -155,7 +152,6 @@ export const AddNote = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 16,
     height: height || 20,
@@ -214,7 +210,6 @@ export const AddPerson = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 16,
@@ -280,7 +275,6 @@ export const AddAttachmentSmall = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 18,
@@ -326,7 +320,6 @@ export const AddServer = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 23,
     height: height || 20,
@@ -867,7 +860,6 @@ export const Attachment = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 21,
@@ -895,7 +887,6 @@ export const Back = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 12,
@@ -1153,7 +1144,6 @@ export const Block = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -1740,7 +1730,6 @@ export const Danger = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 16,
     height: height || 22,
@@ -1772,7 +1761,6 @@ export const Delete = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 14,
     height: height || 18,
@@ -1903,7 +1891,6 @@ export const Display = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 22,
@@ -1963,7 +1950,6 @@ export const Download = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 14,
     height: height || 17,
@@ -2189,7 +2175,6 @@ export const Earth = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -2357,7 +2342,6 @@ export const Filters = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 18,
@@ -2581,7 +2565,6 @@ export const Gavel = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 22,
@@ -2614,7 +2597,6 @@ export const Generate = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 20,
@@ -2876,7 +2858,6 @@ export const IconView = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 17,
     height: height || 17,
@@ -2911,7 +2892,6 @@ export const Incorrect = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 21,
@@ -3018,7 +2998,6 @@ export const Key = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 12,
@@ -3210,7 +3189,6 @@ export const ListView = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 12,
@@ -3246,7 +3224,6 @@ export const Loading = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 17,
     height: height || 6,
@@ -3560,7 +3537,6 @@ export const Message = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -3813,7 +3789,6 @@ export const More = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 4,
     height: height || 18,
@@ -4093,7 +4068,6 @@ export const Unlock = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 16,
     height: height || 21,
@@ -4263,7 +4237,6 @@ export const PaperView = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 16,
     height: height || 20,
@@ -4376,7 +4349,6 @@ export const Pen = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 19,
     height: height || 19,
@@ -4428,7 +4400,6 @@ export const DoublePen = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 18,
@@ -4506,7 +4477,6 @@ export const PersonAccept = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 19,
     height: height || 17,
@@ -4895,7 +4865,6 @@ export const Play = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 11,
     height: height || 14,
@@ -4928,7 +4897,6 @@ export const PlayBorder = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -4963,7 +4931,6 @@ export const PlayFilled = /*#__PURE__*/memo(({
       fillOpacity: opacity
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -5024,7 +4991,6 @@ export const PersonRemoved = /*#__PURE__*/memo(({
       fill: colors[color] || color
     })));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 21,
@@ -5604,7 +5570,6 @@ export const Search = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 20,
@@ -5660,7 +5625,6 @@ export const Skip = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 18,
     height: height || 12,
@@ -5790,7 +5754,6 @@ export const StarHalf = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 20,
     height: height || 19,
@@ -6040,7 +6003,6 @@ export const Trash = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 14,
     height: height || 18,
@@ -6124,7 +6086,6 @@ export const View = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 16,
@@ -6184,7 +6145,6 @@ export const UnView = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 22,
     height: height || 20,
@@ -6355,7 +6315,6 @@ export const Write = /*#__PURE__*/memo(({
       fill: colors[color] || color
     }));
   }
-
   return /*#__PURE__*/React.createElement("svg", {
     width: width || 19,
     height: height || 19,
@@ -7250,7 +7209,6 @@ export const Pdf = /*#__PURE__*/memo(({
       fill: color
     }))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "15",
     height: "16",
@@ -7342,7 +7300,6 @@ export const Word = /*#__PURE__*/memo(({
       fill: color
     })))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "15",
     height: "16",
@@ -7458,7 +7415,6 @@ export const Sheet = /*#__PURE__*/memo(({
       fill: color
     })))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "15",
     height: "16",
@@ -7575,7 +7531,6 @@ export const Presentation = /*#__PURE__*/memo(({
       fill: color
     })))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "14",
     height: "16",
@@ -7656,7 +7611,6 @@ export const Image = /*#__PURE__*/memo(({
       fill: color
     }))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "14",
     height: "16",
@@ -7738,7 +7692,6 @@ export const Compressed = /*#__PURE__*/memo(({
       fill: color
     })))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "15",
     height: "16",
@@ -7826,7 +7779,6 @@ export const Another = /*#__PURE__*/memo(({
       fill: color
     })))));
   }
-
   return size === 'small' ? /*#__PURE__*/React.createElement("svg", {
     width: "15",
     height: "16",

package/icons/effect.js

@@ -1,5 +1,4 @@
 /** @jsxRuntime classic */
-
 /** @jsx jsx */
 import { css, jsx } from '@emotion/core';
 import OptionWrapper from "../components/others/option-wrapper";
@@ -31,19 +30,15 @@ const Icon = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
 }, reference) => {
   if (!reference) reference = useRef(null);
   const ref = useRef(null);
-
   const _IconCSS = IconCSS(width, height);
-
   const _NotFoundIconCSS = NotFoundIconCSS(width);
-
   useImperativeHandle(reference, () => {
     const currentRef = ref.current || {};
     currentRef.element = ref.current;
-    const _instance = { ...action
+    const _instance = {
+      ...action
     }; // methods
-
     _instance.__proto__ = {}; // hidden methods
-
     currentRef.instance = _instance;
     return currentRef;
   });
@@ -51,7 +46,6 @@ const Icon = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     if (!name) return null;
     let node = null;
     const IconComp = Icons[capitalize(name)];
-
     if (IconComp) {
       node = jsx(IconComp, {
         width: width,
@@ -64,7 +58,6 @@ const Icon = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
         css: _NotFoundIconCSS
       });
     }
-
     return jsx("span", {
       css: _IconCSS,
       ref: ref,
@@ -76,7 +69,6 @@ const Icon = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     }, node);
   }, [className, color, height, id, name, onClick, style, viewBox, width, props]);
 }));
-
 const IconCSS = (width = 24, height = 24) => css`
     ${flexRow};
     ${justifyCenter};
@@ -87,14 +79,12 @@ const IconCSS = (width = 24, height = 24) => css`
     ${parseWidthHeight('max-content')};
     ${parseMinWidthHeight(width, height)};
 `;
-
 const NotFoundIconCSS = (width = 24) => css`
     ${flexRow};
     ${boxBorder};
     ${parseWidthHeight(width)};
     border: 1px dashed ${systemRest};
 `;
-
 Icon.defaultProps = {
   className: '',
   color: 'dark6',
@@ -106,38 +96,31 @@ Icon.defaultProps = {
 Icon.propTypes = {
   /** Class for component. */
   className: PropTypes.string,
-
   /** The color of the component. */
   color: PropTypes.string,
-
   /** Height of the component. */
   height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-
   /** Name of icon in [Basic Icon](https://core.diginet.com.vn/ui/?path=/story/icon-basic) */
   name: PropTypes.string.isRequired,
-
   /** Style inline of component. */
   style: PropTypes.object,
-
   /** If `true`, component have view box. */
   viewBox: PropTypes.bool,
-
   /** Width of the component. */
   width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-
-  /**
-   * ref methods (ref.current.instance.*method*)
-   *
-   * * option(): Gets all UI component properties
-   *  * Returns value - object
-   * * option(optionName): Gets the value of a single property
-   *  * @param {optionName} - string
-   *  * Returns value - any
-   * * option(optionName, optionValue): Updates the value of a single property
-   *  * @param {optionName} - string
-   *  * @param {optionValue} - any
-   * * option(options): Updates the values of several properties
-   *  * @param {options} - object
+  /**
+   * ref methods (ref.current.instance.*method*)
+   *
+   * * option(): Gets all UI component properties
+   *  * Returns value - object
+   * * option(optionName): Gets the value of a single property
+   *  * @param {optionName} - string
+   *  * Returns value - any
+   * * option(optionName, optionValue): Updates the value of a single property
+   *  * @param {optionName} - string
+   *  * @param {optionValue} - any
+   * * option(options): Updates the values of several properties
+   *  * @param {options} - object
    */
   reference: ref
 };

package/icons/general/clock/clock.js

@@ -1,6 +1,5 @@
 /* eslint-disable react/prop-types */
 import React from 'react';
-
 const Clock = ({
   width = '1em',
   height = '1em',
@@ -18,5 +17,4 @@ const Clock = ({
     fill: pathFill
   }));
 };
-
 export default Clock;

package/icons/general/color-handler/background.js

@@ -1,6 +1,5 @@
 /* eslint-disable react/prop-types */
 import React from 'react';
-
 const BackgroundColor = ({
   width = '1em',
   height = '1em',
@@ -38,5 +37,4 @@ const BackgroundColor = ({
     fill: pathFill
   })));
 };
-
 export default BackgroundColor;