diginet-core-ui 1.3.87 → 1.3.88

package/components/card/extra.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { memo, useRef, useMemo, forwardRef, useImperativeHandle } from 'react';
 import PropTypes from 'prop-types';
@@ -17,10 +18,11 @@ const CardExtra = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   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;
   });
@@ -40,10 +42,13 @@ CardExtra.defaultProps = {
 CardExtra.propTypes = {
   /** The content of the component. */
   children: PropTypes.node,
+
   /** Class for component. ({container: '', header: '', body: '', footer: ''}) */
   className: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+
   /** If `true`, will have divider between body and footer. */
   style: PropTypes.object,
+
   /** The title of the component's header. */
   title: PropTypes.string
 };

package/components/card/footer.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { memo, useRef, useMemo, forwardRef, useImperativeHandle } from 'react';
 import PropTypes from 'prop-types';
@@ -17,10 +18,11 @@ const CardFooter = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   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;
   });
@@ -40,10 +42,13 @@ CardFooter.defaultProps = {
 CardFooter.propTypes = {
   /** The content of the component. */
   children: PropTypes.node,
+
   /** Class for component. ({container: '', header: '', body: '', footer: ''}) */
   className: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+
   /** If `true`, will have divider between body and footer. */
   style: PropTypes.object,
+
   /** The title of the component's header. */
   title: PropTypes.string
 };

package/components/card/header.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { memo, useRef, useMemo, forwardRef, useImperativeHandle } from 'react';
 import PropTypes from 'prop-types';
@@ -18,10 +19,11 @@ const CardHeader = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   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;
   });
@@ -43,10 +45,13 @@ CardHeader.defaultProps = {
 CardHeader.propTypes = {
   /** The content of the component. */
   children: PropTypes.node,
+
   /** Class for component. ({container: '', header: '', body: '', footer: ''}) */
   className: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+
   /** If `true`, will have divider between body and footer. */
   style: PropTypes.object,
+
   /** The title of the component's header. */
   title: PropTypes.string
 };

package/components/card/index.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { memo, useRef, useMemo, forwardRef, useImperativeHandle } from 'react';
 import PropTypes from 'prop-types';
@@ -43,14 +44,17 @@ const Card = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   width
 }, reference) => {
   const ref = useRef(null);
+
   const _CardCSS = CardCSS(width, height, headerDivider, footerDivider, dividerColor, direction);
+
   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;
   });
@@ -77,6 +81,7 @@ const Card = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     }, head, body || children, foot);
   }, [bodyProp, bodyStyle, children, className, dividerColor, direction, footer, footerDivider, footerStyle, header, headerDivider, headerStyle, height, id, style, title, width]);
 }));
+
 const CardCSS = (width, height, headerDivider, footerDivider, dividerColor, direction) => css`
     ${direction === 'vertical' ? flexCol : flexRow};
     ${positionRelative};
@@ -132,6 +137,7 @@ const CardCSS = (width, height, headerDivider, footerDivider, dividerColor, dire
         ${boxBorder};
     }
 `;
+
 Card.defaultProps = {
   bodyStyle: {},
   className: '',
@@ -146,32 +152,46 @@ Card.defaultProps = {
 Card.propTypes = {
   /** The content of the component's body. */
   body: PropTypes.node,
+
   /** The content of the component's body. */
   bodyStyle: PropTypes.object,
+
   /** The content of the component. */
   children: PropTypes.node,
+
   /** Class for component. ({container: '', header: '', body: '', footer: ''}) */
   className: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
+
   /** Color of divider. */
   dividerColor: PropTypes.string,
+
   /** The content of the component's footer. */
   footer: PropTypes.node,
+
   /** If `true`, will have divider between body and footer. */
   footerDivider: PropTypes.bool,
+
   /** Style inline of component's footer. */
   footerStyle: PropTypes.object,
+
   /** The content of the component's header. */
   header: PropTypes.node,
+
   /** If `true`, will have divider between header and body. */
   headerDivider: PropTypes.bool,
+
   /** Style inline of component's header. */
   headerStyle: PropTypes.object,
+
   /** Height of the component. */
   height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+
   /** Style inline of component. */
   style: PropTypes.object,
+
   /** The title of the component's header. */
   title: PropTypes.string,
+
   /** Width of the component. */
   width: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
 };

package/components/chart/Pie/Circle.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import PropTypes from 'prop-types';
 import { memo, forwardRef } from 'react';

package/components/chart/Pie/Sector.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { useRef, memo, forwardRef } from 'react';
 import PropTypes from "prop-types";
@@ -26,9 +27,11 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   ...props
 }, ref) => {
   let result;
+
   if (!ref) {
     ref = useRef(null);
   }
+
   const pathRef = useRef(null);
   const SectorCSS = expandOnHover || expandedIndex >= 0 ? css`
         transition-property: all;
@@ -45,8 +48,10 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
         transition-timing-function: ${transitionTimingFunction};
         transition-duration: ${transitionDuration};
     `;
+
   const Data = (data, index) => {
     let item = null;
+
     if (renderSelectedItem && typeof renderSelectedItem === 'function') {
       item = renderSelectedItem({
         data,
@@ -56,6 +61,7 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       ReactDOM.render(item, pathRef.current.appendChild(el));
     }
   };
+
   const content = jsx("g", {
     css: SectorCSS
   }, jsx("path", {
@@ -72,6 +78,7 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     onMouseLeave: onMouseLeave,
     ...props
   }, renderSelectedItem ? Data() : name && jsx("title", null, name, ": ", quantity)));
+
   if (href) {
     result = jsx("a", {
       href: href
@@ -79,6 +86,7 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   } else {
     result = content;
   }
+
   return result;
 }));
 Sector.defaultProps = {
@@ -94,29 +102,38 @@ Sector.defaultProps = {
 Sector.propTypes = {
   /** the fill change color of pie chart  */
   fill: PropTypes.string.isRequired,
+
   /** event click mouse in pie chart */
   onMouseEnter: PropTypes.func,
+
   /** event leave mouse in pie chart */
   onMouseLeave: PropTypes.func,
   onTouchEnd: PropTypes.func,
   onTouchStart: PropTypes.func,
-  /** function displays selected items by custom, example:<br/>
-   * renderItem={(data, index) => index + ' - ' + data.name}<br/>
+
+  /** function displays selected items by custom, example:<br/>
+   * renderItem={(data, index) => index + ' - ' + data.name}<br/>
    */
   renderSelectedItem: PropTypes.func,
   path: PropTypes.string.isRequired,
+
   /** the StrokeColor change color border and Stroke */
   strokeColor: PropTypes.string,
+
   /** it can be applied to any element but it has effect only on the following nine */
   strokeLinejoin: PropTypes.string,
+
   /** The strokeWidth attribute is a presentation attribute defining the width of the stroke to be applied to the shape */
   strokeWidth: PropTypes.number,
+
   /** The title is add from the data */
   name: PropTypes.string,
   quantity: PropTypes.number,
   href: PropTypes.string,
+
   /** The transition-duration CSS property sets the length of time a transition animation should take to complete. Default 0.3s */
   transitionDuration: PropTypes.string,
+
   /** The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected*/
   transitionTimingFunction: PropTypes.string,
   className: PropTypes.string

package/components/chart/Pie/Sectors.js

@@ -1,8 +1,10 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import PropTypes from "prop-types";
 import Sector from "./Sector";
 import { jsx } from '@emotion/core';
+
 const Sectors = ({
   center,
   data,
@@ -54,27 +56,35 @@ const Sectors = ({
     });
   })) : null;
 };
+
 Sectors.defaultProps = {
   expandSize: 2
 };
 Sectors.propTypes = {
   center: PropTypes.number.isRequired,
+
   /** The array of elements that appear in the PieChart */
   data: PropTypes.arrayOf(PropTypes.shape({
     color: PropTypes.string.isRequired,
     name: PropTypes.string,
     quantity: PropTypes.number.isRequired
   })).isRequired,
+
   /** returns the data of the object to be hover */
   onSectorHover: PropTypes.func,
+
   /** the Size expand On Hover */
   expandSize: PropTypes.number,
+
   /** the StrokeWidth change color border and Stroke */
   strokeColor: Sector.propTypes.strokeColor,
+
   /** The strokeWidth attribute is a presentation attribute defining the width of the stroke to be applied to the shape */
   strokeWidth: Sector.propTypes.strokeWidth,
+
   /** The starting angle is drawn in a circle from data first */
   startAngle: PropTypes.number,
+
   /** */
   angleMargin: PropTypes.number
 };

package/components/chart/Pie/index.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { useState, useRef, useEffect, memo, forwardRef } from 'react';
 import PropTypes from 'prop-types';
@@ -25,23 +26,29 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   if (!ref) {
     ref = useRef(null);
   }
+
   if (data[0] && !data[0].color) {
     var colors = [];
     let Count = data.length;
+
     while (colors.length < Count) {
       do {
         var makeColorCode = '0123456789ABCDEF';
         var code = '#';
+
         for (var count = 0; count < 6; count++) {
           code = code + makeColorCode[Math.floor(Math.random() * 16)];
         }
       } while (colors.indexOf(code) >= 0);
+
       colors.push('#' + ('000000' + code.toString(16)).slice(-6));
     }
+
     for (let i in data) {
       data[i].color = colors[i];
     }
   }
+
   const compare = () => {
     if (width > height) {
       return height;
@@ -49,11 +56,13 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       return width;
     }
   };
+
   const ZoomIn = () => {
     let zoom = 0;
     zoom = compare() / 25;
     return zoom;
   };
+
   const Pie = Donut ? css`
                       position: relative;
                       display: flex;
@@ -92,6 +101,7 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   const offset = expandOnHover || props.expandedIndex > -1 ? expandSize + 2 : 0;
   const [isExpanded, setExpanded] = useState('false');
   const expandedIndex = useRef(null);
+
   const handleSectorHover = (data, index, e) => {
     if (expandOnHover) {
       setExpanded({
@@ -99,10 +109,12 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       });
       expandedIndex.current = index !== null ? index : props.expandedIndex > -1 ? props.expandedIndex : null;
     }
+
     if (onSectorHover) {
       onSectorHover(data, index, e);
     }
   };
+
   const renderSingleData = (d, center) => {
     return jsx(Circle, {
       center: center,
@@ -115,14 +127,13 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       ...d
     });
   };
+
   const renderMultipleData = center => {
     return jsx(Sectors, {
       center: center,
-      data: expandOnHover ? data.map((d, i) => ({
-        ...d,
+      data: expandOnHover ? data.map((d, i) => ({ ...d,
         expanded: `${isExpanded ? i === expandedIndex.current : i === props.expandedIndex}`
-      })) : data.map((d, i) => ({
-        ...d,
+      })) : data.map((d, i) => ({ ...d,
         expanded: `${i === props.expandedIndex}`
       })),
       ...props,
@@ -132,11 +143,13 @@ const PieChart = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       onSectorHover: handleSectorHover
     });
   };
+
   useEffect(() => {
     if (direction === 'bottom' && viewData) {
       document.getElementById(`DGN-CUI-Container-PieChart`).style.display = 'inherit';
       document.getElementById(`DGN-CUI-TableData-PieChart`).style.display = 'flex';
     }
+
     if (direction === 'left' && viewData) {
       document.getElementById(`DGN-CUI-Container-PieChart`).style.position = 'relative';
       document.getElementById(`DGN-CUI-TableData-PieChart`).style.position = 'fixed';
@@ -230,14 +243,19 @@ PieChart.defaultProps = {
 PieChart.propTypes = {
   /** the viewData will display information about the input data */
   viewData: PropTypes.bool,
+
   /** drawn Ratio of Width entered by user, default is: 900px */
   width: PropTypes.number,
+
   /** drawn Ratio of Height entered by user, default is: 500px */
   height: PropTypes.number,
+
   /** change from PieChart to DonutChart  */
   Donut: PropTypes.bool,
+
   /** Typography of font in core, default: h4  */
   type: PropTypes.string,
+
   /** The array of elements that appear in the PieChart */
   data: PropTypes.arrayOf(PropTypes.shape({
     color: PropTypes.string,
@@ -245,32 +263,46 @@ PieChart.propTypes = {
     quantity: PropTypes.number.isRequired,
     href: PropTypes.string
   })).isRequired,
+
   /** the animation expand On Hover */
   expandOnHover: PropTypes.bool,
+
   /** the direction custom position data */
   direction: PropTypes.string,
+
   /** the Size expand On Hover */
   expandSize: PropTypes.number,
+
   /** the specified position is hovering by default */
   expandedIndex: PropTypes.number,
+
   /** returns the data of the object to be hover */
   onSectorHover: PropTypes.func,
+
   /** the StrokeWidth change color border and Stroke */
   strokeColor: Sector.propTypes.strokeColor,
+
   /** it can be applied to any element but it has effect only on the following nine */
   strokeLinejoin: Sector.propTypes.strokeLinejoin,
+
   /** The strokeWidth attribute is a presentation attribute defining the width of the stroke to be applied to the shape */
   strokeWidth: Sector.propTypes.strokeWidth,
+
   /** The starting angle is drawn in a circle from data first */
   startAngle: PropTypes.number,
+
   /** */
   angleMargin: PropTypes.number,
+
   /** The viewBox attribute defines the position and dimension, in user space, of an SVG viewport */
   viewBoxSize: PropTypes.number,
+
   /** The transition-duration CSS property sets the length of time a transition animation should take to complete. Default 0.3s */
   transitionDuration: Sector.propTypes.transitionDuration,
+
   /** The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected*/
   transitionTimingFunction: Sector.propTypes.transitionTimingFunction,
+
   /** The title is add from the data */
   name: Sector.propTypes.name
 };

package/components/chart/Pie-v2/Circle.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import PropTypes from 'prop-types';
 import { memo, forwardRef } from 'react';

package/components/chart/Pie-v2/Sector.js

@@ -1,4 +1,5 @@
 /** @jsxRuntime classic */
+
 /** @jsx jsx */
 import { useRef, memo, forwardRef } from 'react';
 import PropTypes from 'prop-types';
@@ -24,9 +25,11 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   ...props
 }, ref) => {
   let result;
+
   if (!ref) {
     ref = useRef(null);
   }
+
   const pathRef = useRef(null);
   const SectorCSS = expandOnHover || expandedIndex >= 0 ? css`
                           transition-property: ${transitionProperty};
@@ -58,6 +61,7 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     onMouseLeave: onMouseLeave,
     ...props
   }, renderSelectedItem);
+
   if (href) {
     result = jsx("a", {
       href: href
@@ -65,6 +69,7 @@ const Sector = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   } else {
     result = content;
   }
+
   return result;
 }));
 Sector.defaultProps = {
@@ -80,27 +85,35 @@ Sector.defaultProps = {
 Sector.propTypes = {
   /** the fill change color of pie chart  */
   fill: PropTypes.string.isRequired,
+
   /** event click mouse in pie chart */
   onMouseEnter: PropTypes.func,
+
   /** event leave mouse in pie chart */
   onMouseLeave: PropTypes.func,
   onTouchEnd: PropTypes.func,
   onTouchStart: PropTypes.func,
-  /** function displays selected items by custom, example:<br/>
-   * renderItem={(data, index) => index + ' - ' + data.name}<br/>
+
+  /** function displays selected items by custom, example:<br/>
+   * renderItem={(data, index) => index + ' - ' + data.name}<br/>
    */
   renderSelectedItem: PropTypes.func,
   path: PropTypes.string.isRequired,
+
   /** the StrokeColor change color border and Stroke */
   strokeColor: PropTypes.string,
+
   /** it can be applied to any element but it has effect only on the following nine */
   strokeLinejoin: PropTypes.string,
+
   /** The strokeWidth attribute is a presentation attribute defining the width of the stroke to be applied to the shape */
   strokeWidth: PropTypes.number,
   quantity: PropTypes.number,
   href: PropTypes.string,
+
   /** The transition-duration CSS property sets the length of time a transition animation should take to complete. Default 0.3s */
   transitionDuration: PropTypes.string,
+
   /** The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected*/
   transitionTimingFunction: PropTypes.string,
   className: PropTypes.string