@sis-cc/dotstatsuite-visions 12.29.0 → 12.31.0

package/es/AdvancedFilterDialog/AdvancedFilterDialog.js

@@ -26,7 +26,7 @@ import singleImg from './images/single-selection.png';
 import childrenImg from './images/children-selection.png';
 import branchImg from './images/branch-selection.png';
 import levelImg from './images/level-selection.png';
-import { Divider } from '@mui/material';
+import Divider from '@mui/material/Divider';
 
 var PaperComponent = function PaperComponent(props) {
   return React.createElement(

package/es/ChartsConfig/ChartsConfig.js

@@ -7,7 +7,9 @@ import Grid from '@mui/material/Grid';
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
 import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
 import Title from './Title';
-import { Button, InputAdornment, Typography } from '@mui/material';
+import Button from '@mui/material/Button';
+import InputAdornment from '@mui/material/InputAdornment';
+import Typography from '@mui/material/Typography';
 import useFocusOptions from './useFocusOptions';
 import Select from '../Select';
 import { extractMultipleValue, getValue } from './utils';

package/es/ChartsConfig/InputProxy.js

@@ -3,7 +3,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 import React from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
-import { Grid } from '@mui/material';
+import Grid from '@mui/material/Grid';
 import Input from './Input';
 
 var InputProxy = function InputProxy(_ref) {

package/es/ChartsConfig/Title.js

@@ -2,7 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
 import makeStyles from '@mui/styles/makeStyles';
-import { Grid, Typography } from '@mui/material';
+import Grid from '@mui/material/Grid';
+import Typography from '@mui/material/Typography';
 
 export var useStyles = makeStyles(function () {
   return {

package/es/Contact/Contact.js

@@ -2,7 +2,12 @@ import React, { useEffect, useState } from 'react';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
-import { Grid, Paper, TextareaAutosize, Checkbox, FormControlLabel, Typography } from '@mui/material';
+import Grid from '@mui/material/Grid';
+import Paper from '@mui/material/Paper';
+import TextareaAutosize from '@mui/material/TextareaAutosize';
+import Checkbox from '@mui/material/Checkbox';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Typography from '@mui/material/Typography';
 import makeStyles from '@mui/styles/makeStyles';
 import { validate as getIsValidEmail } from 'isemail';
 import Mode from './Mode';

package/es/DynamicDrawer/AdvancedSelection.js

@@ -20,7 +20,7 @@ import singleImg from '../AdvancedFilterDialog/images/single-selection.png';
 import childrenImg from '../AdvancedFilterDialog/images/children-selection.png';
 import branchImg from '../AdvancedFilterDialog/images/branch-selection.png';
 import levelImg from '../AdvancedFilterDialog/images/level-selection.png';
-import { Divider } from '@mui/material';
+import Divider from '@mui/material/Divider';
 import ButtonCarousel from './SelectionModesMobile';
 
 var useStyles = makeStyles(function (theme) {

package/es/DynamicDrawer/DynamicDrawer.js

@@ -8,7 +8,10 @@ import * as R from 'ramda';
 import cx from 'classnames';
 import Box from '@mui/material/Box';
 import AdvancedSelection from './AdvancedSelection';
-import { Paper, Tab, Tabs, Typography } from '@mui/material';
+import Paper from '@mui/material/Paper';
+import Tab from '@mui/material/Tab';
+import Tabs from '@mui/material/Tabs';
+import Typography from '@mui/material/Typography';
 import makeStyles from '@mui/styles/makeStyles';
 import CloseIcon from '@mui/icons-material/Close';
 import IconButton from '@mui/material/Button';

package/es/DynamicDrawer/SelectionModesMobile.js

@@ -2,7 +2,9 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
 import cx from 'classnames';
-import { Box, Paper, Typography } from '@mui/material';
+import Box from '@mui/material/Box';
+import Paper from '@mui/material/Paper';
+import Typography from '@mui/material/Typography';
 import { Tooltip, Button } from '..';
 
 var mapIndexed = R.addIndex(R.map);

package/es/PeriodPicker/PeriodPicker.js

@@ -2,7 +2,8 @@ import React from 'react';
 import * as R from 'ramda';
 import PropTypes from 'prop-types';
 import dateFns from 'date-fns';
-import { Grid, Typography } from '@mui/material';
+import Grid from '@mui/material/Grid';
+import Typography from '@mui/material/Typography';
 import { numeralFormat } from './lib';
 import { Button, Select } from '../';
 import useStyles from './styles';

package/es/ScopeList/index.js

@@ -0,0 +1,94 @@
+/**
+ * Scope List allow a horizontal navigation in a tree
+ * (open console to see selection onClick, onKeyPress)
+ *
+ * limitDisplay: default 0. by default the filter will be blank if items content n of in the list.
+ *
+ * displayAccessor: if displayAccessor is defined the list will be the items return by displayAccessor,
+ * in other word if the prop defined get by displayAccessor is not there, then the scope list will ignore the item and the item will be completely hide
+ *
+ * disabledAccessor: this accessor allow you to allow disabled items. Contrary to displayAccessor the item will be show but not clikable.
+ *
+ * bulkselection: allow and show button to selection entire level or current view
+ *
+ * @memberOf VISIONS
+ * @name ScopeList
+ * @tag component
+ * @api public
+ * @props
+ * ScopeList.propTypes = {
+ *   disableAccessor: PropTypes.func,
+ *   displayAccessor: PropTypes.func,
+ *   testId: PropTypes.string,
+ *   term: PropTypes.string,
+ *   id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+ *   label: PropTypes.string,
+ *   accessibility: PropTypes.bool,
+ *   limitDisplay: PropTypes.number
+ *   items: {
+ *     id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+ *     label: PropTypes.string,
+ *     parentId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ *     isSelected: PropTypes.bool,
+ *     isDisabled: PropTypes.bool,
+ *     count: PropTypes.number,
+ *     path: PropTypes.arrayOf(PropTypes.shape({
+ *       id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
+ *       label: PropTypes.string,
+ *       parentId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ *       isSelected: PropTypes.bool,
+ *     })),
+ *     [yourDisplayAccessorKey]: PropTypes.bool,
+ *   },
+ *   spotlight, c.f proptype spotlight
+ *   mainPlaceholder: PropTypes.string,
+ *   secondaryPlaceholder: PropTypes.string,
+ *   activePanelId: PropTypes.string,,
+ *   hasPath: PropTypes.bool,
+ *   changeSelection: PropTypes.func,
+ *   labels: {
+ *     childrenNavigateDesc: PropTypes.string,
+ *     navigateBefore: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     navigateNext: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     backHelper: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     disableItemLabel: PropTypes.string,
+ *     selection: {
+ *       title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *       currentLevel: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *       level: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     }
+ *   },
+ *   expansionPanelProps: PropTypes.object
+ *   bulkSelection: PropTypes.bool
+ *   labelRenderer: PropTypes.func,
+ * };
+ * @theme
+ * // see Accordion too custom open and close scopelist
+ * level: a level is the current tree level start from level 1
+ * {
+ *   palette: {
+ *     primary: {
+ *       main: // label color and background color of around arrow to see children. global override: outerPalette.primaryMain
+ *     },
+ *     common: {
+ *       white: // color of arrow to see children
+ *     },
+ *     action: {
+ *       hover: // background color of element and header element (from level 2) on hover or selected
+ *       selected: // background color of focus element (accessibility must be set to true) or hover of selected element
+ *     },
+ *     grey: {
+ *       100: // color of tough line (line displayed from level 2)
+ *       600: // count label (after label element) and path label color (use search to see path)
+ *       700: // disabled label
+ *       800: // arrow color between header element (displayed from level 3). globale override: outerPalette.textLight
+ *     }
+ *   }
+ * }
+ * @testId
+ * @demoReady
+ * root: [testId]
+ * value: [testId]_value_[props.items.id]
+ */
+
+export { default } from './ScopeList';

package/es/Select/Select.js

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import makeStyles from '@mui/styles/makeStyles';
 import TextField from '@mui/material/TextField';
 import MenuItem from '@mui/material/MenuItem';
-import { Typography } from '@mui/material';
+import Typography from '@mui/material/Typography';
 import cx from 'classnames';
 
 var useStyles = makeStyles(function (theme) {

package/es/ShortUrls/ShortUrls.js

@@ -12,7 +12,7 @@ import IconButton from '@mui/material/IconButton';
 import Collapse from '@mui/material/Collapse';
 import CloseIcon from '@mui/icons-material/Close';
 import { Alert, Button } from '../';
-import { CircularProgress } from '@mui/material';
+import CircularProgress from '@mui/material/CircularProgress';
 
 var useStyles = makeStyles(function (theme) {
   return {

package/es/TableLayout/index.js

@@ -1,75 +1,75 @@
-/**
- * TableLayout it's drag and drop, you can customise and see with the preview the layout of your table
- *
- * @memberOf VISIONS
- * @name TableLayout
- * @tag component
- * @api public
- * @props
- * const itemButtonProps= { id¹: { options, value, onChange }}
- * ¹ - first id in patern
- *
- * values is usefull for tablePreview only
- *
- * const patern = {
- *   id: PropTypes.string,
- *   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *   values: PropTypes.arrayOf(
- *     PropTypes.shape({
- *       id: PropTypes.string,
- *       label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     }),
- *   ),
- * };
- *
- * TableLayout.propTypes = {
- *   layout: PropTypes.shape({
- *     header: PropTypes.arrayOf(PropTypes.shape(patern)),
- *     sections: PropTypes.arrayOf(PropTypes.shape(patern)),
- *     rows: PropTypes.arrayOf(PropTypes.shape(patern)),
- *   }),
- *   itemRenderer: PropTypes.func,
- *   commit: PropTypes.func,
- *   noPreview: PropTypes.bool,
- *   itemButtonProps: PropTypes.object,
- *   labels: PropTypes.shape({
- *     commit: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     cancel: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     row: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     column: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     section: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     table: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     asc: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     desc: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     help: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     one: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *   }),
- *   accessibility: PropTypes.bool,
- * };
- * @theme
- * {
- *   palette: {
- *     primary: {
- *       main: // header colors. global override: outerPalette.primaryMain
- *     },
- *     tertiary: {
- *       dark: // sections colors
- *       light: // rows colors
- *     },
- *     secondary: {
- *       dark: // used if tertiary dark is null
- *       light: // used if tertiary light is null
- *     }
- *     common: {
- *       white: // background color select asc/desc
- *     }
- *   },
- *   typography: {
- *     subtitle1: {
- *       // description "information DnD"
- *     }
- *   }
- * }
+/**
+ * TableLayout it's drag and drop, you can customise and see with the preview the layout of your table
+ *
+ * @memberOf VISIONS
+ * @name TableLayout
+ * @tag component
+ * @api public
+ * @props
+ * const itemButtonProps= { id¹: { options, value, onChange }}
+ * ¹ - first id in patern
+ *
+ * values is usefull for tablePreview only
+ *
+ * const patern = {
+ *   id: PropTypes.string,
+ *   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *   values: PropTypes.arrayOf(
+ *     PropTypes.shape({
+ *       id: PropTypes.string,
+ *       label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     }),
+ *   ),
+ * };
+ *
+ * TableLayout.propTypes = {
+ *   layout: PropTypes.shape({
+ *     header: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *     sections: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *     rows: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *   }),
+ *   itemRenderer: PropTypes.func,
+ *   commit: PropTypes.func,
+ *   noPreview: PropTypes.bool,
+ *   itemButtonProps: PropTypes.object,
+ *   labels: PropTypes.shape({
+ *     commit: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     cancel: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     row: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     column: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     section: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     table: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     asc: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     desc: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     help: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     one: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *   }),
+ *   accessibility: PropTypes.bool,
+ * };
+ * @theme
+ * {
+ *   palette: {
+ *     primary: {
+ *       main: // header colors. global override: outerPalette.primaryMain
+ *     },
+ *     tertiary: {
+ *       dark: // sections colors
+ *       light: // rows colors
+ *     },
+ *     secondary: {
+ *       dark: // used if tertiary dark is null
+ *       light: // used if tertiary light is null
+ *     }
+ *     common: {
+ *       white: // background color select asc/desc
+ *     }
+ *   },
+ *   typography: {
+ *     subtitle1: {
+ *       // description "information DnD"
+ *     }
+ *   }
+ * }
  **/
 
 export { default } from './TableLayout';

package/es/TablePreview/index.js

@@ -1,44 +1,44 @@
-/**
- * TablePreview use also by TableLayout. It's a preview of your main rows sections and header
- *
- * @memberOf VISIONS
- * @name TablePreview
- * @tag component
- * @api public
- *
- * const patern = {
- *   id: PropTypes.string,
- *   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *   values: PropTypes.arrayOf(
- *     PropTypes.shape({
- *       id: PropTypes.string,
- *       label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
- *     }),
- *   ),
- * };
- *
- * Table.proptypes = {
- *   header: PropTypes.arrayOf(PropTypes.shape(patern)),
- *   sections: PropTypes.arrayOf(PropTypes.shape(patern)),
- *   rows: PropTypes.arrayOf(PropTypes.shape(patern)),
- *   labelRenderer: PropTypes.func,
- * }
- * @theme
- * {
- *   palette: {
- *     primary: {
- *       main: // header colors. global override: outerPalette.primaryMain
- *     },
- *     tertiary: {
- *       dark: // sections colors
- *       light: // rows colors
- *     },
- *     secondary: {
- *       dark: // used if tertiary dark is null
- *       light: // used if tertiary light is null
- *     }
- *   }
- * }
+/**
+ * TablePreview use also by TableLayout. It's a preview of your main rows sections and header
+ *
+ * @memberOf VISIONS
+ * @name TablePreview
+ * @tag component
+ * @api public
+ *
+ * const patern = {
+ *   id: PropTypes.string,
+ *   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *   values: PropTypes.arrayOf(
+ *     PropTypes.shape({
+ *       id: PropTypes.string,
+ *       label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ *     }),
+ *   ),
+ * };
+ *
+ * Table.proptypes = {
+ *   header: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *   sections: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *   rows: PropTypes.arrayOf(PropTypes.shape(patern)),
+ *   labelRenderer: PropTypes.func,
+ * }
+ * @theme
+ * {
+ *   palette: {
+ *     primary: {
+ *       main: // header colors. global override: outerPalette.primaryMain
+ *     },
+ *     tertiary: {
+ *       dark: // sections colors
+ *       light: // rows colors
+ *     },
+ *     secondary: {
+ *       dark: // used if tertiary dark is null
+ *       light: // used if tertiary light is null
+ *     }
+ *   }
+ * }
  **/
 
 export { default } from './TablePreview';

package/es/UserRightForm/Permissions.js

@@ -1,7 +1,8 @@
 import React from 'react';
 import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
-import { Grid, Typography } from '@mui/material';
+import Grid from '@mui/material/Grid';
+import Typography from '@mui/material/Typography';
 import makeStyles from '@mui/styles/makeStyles';
 import * as R from 'ramda';
 import cx from 'classnames';

package/es/UserRightForm/PermsissionsTabs.js

@@ -1,6 +1,10 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import { Box, Grid, Tabs, Tab, Typography } from '@mui/material';
+import Box from '@mui/material/Box';
+import Grid from '@mui/material/Grid';
+import Tabs from '@mui/material/Tabs';
+import Tab from '@mui/material/Tab';
+import Typography from '@mui/material/Typography';
 import makeStyles from '@mui/styles/makeStyles';
 import * as R from 'ramda';
 import Permissions from './Permissions';

package/es/UserRightForm/UserRightForm.js

@@ -3,7 +3,8 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
-import { Grid, Typography } from '@mui/material';
+import Grid from '@mui/material/Grid';
+import Typography from '@mui/material/Typography';
 import makeStyles from '@mui/styles/makeStyles';
 import Input from './Input';
 import Button from '../Button';

package/es/VirtualizedTree/withSpotlight.js

@@ -6,6 +6,7 @@ function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in ob
 import * as R from 'ramda';
 import React, { useEffect, useMemo, useState } from 'react';
 import { getDescendants, getHierarchicalId } from './utils';
+import { prepareTerm, searchTerm } from '../utils';
 
 export var spotlightFilter = function spotlightFilter(term) {
   var labelRenderer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : R.prop('label');
@@ -29,23 +30,22 @@ export var spotlightFilter = function spotlightFilter(term) {
       }
       return acc;
     };
-    var matchRegExp = function matchRegExp(str) {
-      return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-    };
 
     // Highlight matching terms in the label
     var highlightLabel = function highlightLabel(label) {
-      var regex = new RegExp('(' + matchRegExp(term) + ')', 'gi');
-      return label.replace(regex, function (match) {
-        return '<span style=background-color:yellow;border-bottom:2px solid #8CC841>' + match + '</span>';
-      });
+      var i = prepareTerm(label).indexOf(prepareTerm(term));
+      var l = R.length(term);
+
+      var pre = label.slice(0, i);
+      var match = label.slice(i, i + l);
+      var post = label.slice(i + l);
+
+      return pre + '<span style=background-color:yellow;border-bottom:2px solid #8CC841>' + match + '</span>' + post;
     };
 
     var recurse = function recurse(item) {
       var label = labelRenderer(item);
-      var isValidItem = function isValidItem(item) {
-        return R.includes(R.toLower(term), R.toLower(item));
-      };
+      var isValidItem = searchTerm(term);
 
       var result = [];
 

package/es/utils.js

@@ -3,6 +3,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 import React from 'react';
 import * as R from 'ramda';
 import dateFns from 'date-fns';
+import * as diacritics from 'diacritics';
 
 var spotlightHandler = function spotlightHandler(_ref) {
   var term = _ref.term,
@@ -67,4 +68,11 @@ export var getIsRtl = function getIsRtl(theme) {
 export var newDate = function newDate(stringDate) {
   var date = new Date(stringDate);
   return dateFns.addMinutes(date, date.getTimezoneOffset());
+};
+
+export var prepareTerm = R.pipe(diacritics.remove, R.toLower);
+export var searchTerm = function searchTerm(term) {
+  return function (label) {
+    return R.includes(prepareTerm(term), prepareTerm(label));
+  };
 };

package/lib/AdvancedFilterDialog/AdvancedFilterDialog.js

@@ -92,7 +92,9 @@ var _levelSelection = require('./images/level-selection.png');
 
 var _levelSelection2 = _interopRequireDefault(_levelSelection);
 
-var _material = require('@mui/material');
+var _Divider = require('@mui/material/Divider');
+
+var _Divider2 = _interopRequireDefault(_Divider);
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
@@ -562,7 +564,7 @@ var AdvancedFilterDialog = function AdvancedFilterDialog(props) {
               )
             )
           ),
-          _react2.default.createElement(_material.Divider, { className: classes.divider })
+          _react2.default.createElement(_Divider2.default, { className: classes.divider })
         ),
         _react2.default.createElement(
           _Grid2.default,