@sis-cc/dotstatsuite-visions 10.21.1 → 10.22.0

package/umd/@sis-cc/dotstatsuite-visions.js

@@ -1,5 +1,5 @@
 /*!
- * @sis-cc/dotstatsuite-visions v10.21.1 - https://visions-qa.siscc.org/#o
+ * @sis-cc/dotstatsuite-visions v10.22.0 - https://visions-qa.siscc.org/#o
  * MIT Licensed
  */
 (function webpackUniversalModuleDefinition(root, factory) {
@@ -6697,7 +6697,7 @@ function removeClassName(el
 /* 119 */
 /***/ (function(module) {
 
-module.exports = {"name":"@sis-cc/dotstatsuite-visions","version":"10.21.1","description":"Library of visual components","author":"OECD","homepage":"https://visions-qa.siscc.org/#o","license":"MIT","repository":"https://gitlab.com/sis-cc/.stat-suite/dotstatsuite-visions","main":"lib/index.js","module":"es/index.js","engines":{"node":">=14"},"files":["css","es","lib","umd"],"scripts":{"build":"nwb build-react-component --copy-files --no-demo && node scripts/doc && nwb build-demo","build:dev":"nwb build-react-component --copy-files --no-demo","clean":"nwb clean-module && nwb clean-demo","prepublishOnly":"npm run build","start":"nwb serve-react-demo","test":"jest","test:watch":"jest --watch --no-cache","lint":"eslint src/ --color","precommit":"lint-staged"},"dependencies":{"@react-hook/size":"^2.1.1","classnames":"^2.2.6","date-fns":"^1.30.1","isemail":"^3.2.0","numeral":"^2.0.6","prop-types":"^15.7.2","ramda":"^0.27.0","react-beautiful-dnd":"^13.0.0","react-draggable":"^4.4.5","react-error-boundary":"^4.0.10","react-virtualized":"^9.21.2"},"peerDependencies":{"@material-ui/core":"^4","@material-ui/icons":"^4","@sis-cc/dotstatsuite-sdmxjs":"^8.x","react":"^18","react-dom":"^18"},"devDependencies":{"@babel/eslint-parser":"^7.5.4","@babel/plugin-syntax-dynamic-import":"^7.2.0","@cfaester/enzyme-adapter-react-18":"^0.7.0","@material-ui/core":"^4","@material-ui/icons":"^4","@sis-cc/dotstatsuite-sdmxjs":"*","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^14.0.0","babel-jest":"^24.8.0","babel-preset-react-app":"^9.0.0","dox":"^0.9.0","eslint":"^8.39.0","eslint-plugin-import":"^2.27.5","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.2","eslint-plugin-react-hooks":"^4.6.0","husky":"^2.7.0","identity-obj-proxy":"^3.0.0","jest":"^24.8.0","jss":"^10.10.0","jss-rtl":"^0.2.3","lint-staged":"^8.2.1","mutationobserver-shim":"^0.3.7","nwb":"0.23.0","prettier":"^2.8.8","pretty-quick":"^3.1.3","react":"^18","react-a11y":"^1.1.0","react-dom":"^18","react-helmet":"^5.2.1","react-scrollable-anchor":"^0.6.1","react-syntax-highlighter":"^10.2.1","sanitize-html":"2.7.0","webpack":"^5.68.0","webpack-cli":"^4.9.2","webpack-dev-server":"^4.7.4"},"jest":{"verbose":true,"coverageDirectory":"coverage","collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/ScopeList/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFilesAfterEnv":["<rootDir>/tests/setup.js"],"testMatch":["**/tests/**/*.{spec,test}.{js,jsx,ts,tsx}","!**/tests/ScopeList.test.js"],"testEnvironment":"jsdom","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy","\\.(jpg|jpeg|png)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"]},"babel":{"presets":["react-app"],"plugins":["@babel/plugin-syntax-dynamic-import"]},"eslintConfig":{"env":{"browser":true,"jest":true,"node":true,"es6":true},"extends":["eslint:recommended","plugin:react/recommended","plugin:jsx-a11y/recommended"],"parser":"@babel/eslint-parser","parserOptions":{"babelOptions":{"presets":[["babel-preset-react-app",false],"babel-preset-react-app/test"]},"ecmaFeatures":{"experimentalObjectRestSpread":true,"jsx":true},"sourceType":"module"},"plugins":["prettier","react","import","react-hooks","jsx-a11y"],"rules":{"no-console":"warn","no-unused-vars":"error","react/display-name":"off","react-hooks/rules-of-hooks":"error","react-hooks/exhaustive-deps":"warn","no-use-before-define":"error"}},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"husky":{"hooks":{"pre-commit":"lint-staged"}},"lint-staged":{"src/**/*.{js,css}":["prettier --write","git add","yarn lint"]},"prettier":{"endOfLine":"lf","useTabs":false,"printWidth":100,"tabWidth":2,"singleQuote":true,"trailingComma":"all","bracketSameLine":false,"bracketSpacing":true,"parser":"babel","semi":true,"arrowParens":"avoid"}};
+module.exports = {"name":"@sis-cc/dotstatsuite-visions","version":"10.22.0","description":"Library of visual components","author":"OECD","homepage":"https://visions-qa.siscc.org/#o","license":"MIT","repository":"https://gitlab.com/sis-cc/.stat-suite/dotstatsuite-visions","main":"lib/index.js","module":"es/index.js","engines":{"node":">=14"},"files":["css","es","lib","umd"],"scripts":{"build":"nwb build-react-component --copy-files --no-demo && node scripts/doc && nwb build-demo","build:dev":"nwb build-react-component --copy-files --no-demo","clean":"nwb clean-module && nwb clean-demo","prepublishOnly":"npm run build","start":"nwb serve-react-demo","test":"jest","test:watch":"jest --watch --no-cache","lint":"eslint src/ --color","precommit":"lint-staged"},"dependencies":{"@react-hook/size":"^2.1.1","classnames":"^2.2.6","date-fns":"^1.30.1","isemail":"^3.2.0","numeral":"^2.0.6","prop-types":"^15.7.2","ramda":"^0.27.0","react-beautiful-dnd":"^13.0.0","react-draggable":"^4.4.5","react-error-boundary":"^4.0.10","react-virtualized":"^9.21.2"},"peerDependencies":{"@material-ui/core":"^4","@material-ui/icons":"^4","@sis-cc/dotstatsuite-sdmxjs":"^8.x","react":"^18","react-dom":"^18"},"devDependencies":{"@babel/eslint-parser":"^7.5.4","@babel/plugin-syntax-dynamic-import":"^7.2.0","@cfaester/enzyme-adapter-react-18":"^0.7.0","@material-ui/core":"^4","@material-ui/icons":"^4","@sis-cc/dotstatsuite-sdmxjs":"*","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^14.0.0","babel-jest":"^24.8.0","babel-preset-react-app":"^9.0.0","dox":"^0.9.0","eslint":"^8.39.0","eslint-plugin-import":"^2.27.5","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.2","eslint-plugin-react-hooks":"^4.6.0","husky":"^2.7.0","identity-obj-proxy":"^3.0.0","jest":"^24.8.0","jss":"^10.10.0","jss-rtl":"^0.2.3","lint-staged":"^8.2.1","mutationobserver-shim":"^0.3.7","nwb":"0.23.0","prettier":"^2.8.8","pretty-quick":"^3.1.3","react":"^18","react-a11y":"^1.1.0","react-dom":"^18","react-helmet":"^5.2.1","react-scrollable-anchor":"^0.6.1","react-syntax-highlighter":"^10.2.1","sanitize-html":"2.7.0","webpack":"^5.68.0","webpack-cli":"^4.9.2","webpack-dev-server":"^4.7.4"},"jest":{"verbose":true,"coverageDirectory":"coverage","collectCoverageFrom":["src/**/*.{js,jsx,ts,tsx}","!src/ScopeList/*.{js,jsx,ts,tsx}","!src/**/*.d.ts"],"setupFilesAfterEnv":["<rootDir>/tests/setup.js"],"testMatch":["**/tests/**/*.{spec,test}.{js,jsx,ts,tsx}","!**/tests/ScopeList.test.js"],"testEnvironment":"jsdom","transform":{"^.+\\.(js|jsx|ts|tsx)$":"<rootDir>/node_modules/babel-jest"},"transformIgnorePatterns":["[/\\\\]node_modules[/\\\\].+\\.(js|jsx|ts|tsx)$","^.+\\.module\\.(css|sass|scss)$"],"modulePaths":[],"moduleNameMapper":{"^react-native$":"react-native-web","^.+\\.module\\.(css|sass|scss)$":"identity-obj-proxy","\\.(jpg|jpeg|png)$":"identity-obj-proxy"},"moduleFileExtensions":["web.js","js","web.ts","ts","web.tsx","tsx","json","web.jsx","jsx","node"]},"babel":{"presets":["react-app"],"plugins":["@babel/plugin-syntax-dynamic-import"]},"eslintConfig":{"env":{"browser":true,"jest":true,"node":true,"es6":true},"extends":["eslint:recommended","plugin:react/recommended","plugin:jsx-a11y/recommended"],"parser":"@babel/eslint-parser","parserOptions":{"babelOptions":{"presets":[["babel-preset-react-app",false],"babel-preset-react-app/test"]},"ecmaFeatures":{"experimentalObjectRestSpread":true,"jsx":true},"sourceType":"module"},"plugins":["prettier","react","import","react-hooks","jsx-a11y"],"rules":{"no-console":"warn","no-unused-vars":"error","react/display-name":"off","react-hooks/rules-of-hooks":"error","react-hooks/exhaustive-deps":"warn","no-use-before-define":"error"}},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"husky":{"hooks":{"pre-commit":"lint-staged"}},"lint-staged":{"src/**/*.{js,css}":["prettier --write","git add","yarn lint"]},"prettier":{"endOfLine":"lf","useTabs":false,"printWidth":100,"tabWidth":2,"singleQuote":true,"trailingComma":"all","bracketSameLine":false,"bracketSpacing":true,"parser":"babel","semi":true,"arrowParens":"avoid"}};
 
 /***/ }),
 /* 120 */
@@ -43949,11 +43949,15 @@ var CollapsibleTree_CollapsibleTree = function CollapsibleTree(_ref) {
         buttonAllOpenLabel
       ),
       react_default.a.createElement(
-        esm_IconButton_IconButton,
-        { color: 'primary', onClick: onClick },
-        icon
-      ),
-      children
+        'div',
+        null,
+        children,
+        react_default.a.createElement(
+          esm_IconButton_IconButton,
+          { color: 'primary', onClick: onClick },
+          icon
+        )
+      )
     ),
     es_map(function (_ref3) {
       var id = _ref3.id,
@@ -49729,7 +49733,7 @@ var Mode_Mode_Mode = function Mode(_ref2) {
           variant: 'outlined',
           color: 'primary',
           size: isSmall ? 'small' : 'medium',
-          inputProps: { ' aria-labelledby': label, tabIndex: '0', id: label + '_' + idx }
+          inputProps: { tabIndex: '0', id: label + '_' + idx }
         }),
         label: react_default.a.createElement(
           'span',
@@ -54338,7 +54342,7 @@ var cell_useStyles = styles_makeStyles(function (theme) {
     rightAlign: {
       // only for rtl layout !
       // changed by right in rtl mode
-      textAlign: 'left'
+      textAlign: 'right'
     }
   };
 });
@@ -54380,8 +54384,14 @@ var cell_Cell = function Cell(_ref) {
       },
       className: classes.link
     },
-    es_is(Function, HTMLRenderer) ? react_default.a.createElement(HTMLRenderer, { html: value, style: { float: textAlign } }) : value
-  ) : es_is(Function, HTMLRenderer) ? react_default.a.createElement(HTMLRenderer, { html: value, style: { float: textAlign } }) : value;
+    es_is(Function, HTMLRenderer) ? react_default.a.createElement(HTMLRenderer, {
+      html: value,
+      style: { float: isRtl && es_isNil(textAlign) ? 'left' : textAlign }
+    }) : value
+  ) : es_is(Function, HTMLRenderer) ? react_default.a.createElement(HTMLRenderer, {
+    html: value,
+    style: { float: isRtl && es_isNil(textAlign) ? 'left' : textAlign }
+  }) : value;
 
   return react_default.a.createElement(
     esm_TableCell_TableCell,
@@ -71239,14 +71249,16 @@ var VirtualizedTree_getHasChildrenOnLevel = function getHasChildrenOnLevel(group
 var VirtualizedTree_VirtualizedTree = function VirtualizedTree(props) {
   var accessibility = props.accessibility,
       changeSelection = props.changeSelection,
-      _props$disableAccesso = props.disableAccessor,
-      disableAccessor = _props$disableAccesso === undefined ? es_always(false) : _props$disableAccesso,
-      _props$isGreyed = props.isGreyed,
-      isGreyed = _props$isGreyed === undefined ? es_always(false) : _props$isGreyed,
       HTMLRenderer = props.HTMLRenderer,
       items = props.items,
+      selectIds = props.selectIds,
+      setSelectIds = props.setSelectIds,
       labelRenderer = props.labelRenderer,
       labels = props.labels,
+      _props$disableAccesso = props.disableAccessor,
+      disableAccessor = _props$disableAccesso === undefined ? es_always(false) : _props$disableAccesso,
+      _props$isGreyed = props.isGreyed,
+      isGreyed = _props$isGreyed === undefined ? es_always(false) : _props$isGreyed,
       expandedIds = props.expandedIds,
       expand = props.expand,
       collapse = props.collapse,
@@ -71269,17 +71281,13 @@ var VirtualizedTree_VirtualizedTree = function VirtualizedTree(props) {
       shiftIndexes = _useState2[0],
       setShiftIndexes = _useState2[1];
 
-  var _useState3 = Object(react["useState"])({}),
-      selectIds = _useState3[0],
-      setSelectIds = _useState3[1];
-
-  var _useState4 = Object(react["useState"])(false),
-      isMouseDown = _useState4[0],
-      setIsMouseDown = _useState4[1];
+  var _useState3 = Object(react["useState"])(false),
+      isMouseDown = _useState3[0],
+      setIsMouseDown = _useState3[1];
 
-  var _useState5 = Object(react["useState"])(null),
-      lastItemId = _useState5[0],
-      setLastItemId = _useState5[1];
+  var _useState4 = Object(react["useState"])(null),
+      lastItemId = _useState4[0],
+      setLastItemId = _useState4[1];
 
   var _useMemo = Object(react["useMemo"])(function () {
     var refinedItems = es_map(function (item) {
@@ -71535,6 +71543,8 @@ var VirtualizedTree_VirtualizedTree = function VirtualizedTree(props) {
 };
 
 VirtualizedTree_VirtualizedTree.propTypes = {
+  selectIds: prop_types_default.a.object,
+  setSelectIds: prop_types_default.a.func,
   accessibility: prop_types_default.a.bool,
   changeSelection: prop_types_default.a.func,
   disableAccessor: prop_types_default.a.func,
@@ -71953,10 +71963,16 @@ var AdvancedFilterDialog_useStyles = styles_makeStyles(function (theme) {
     },
     headerLabel: {
       fontSize: '16px',
-      font: 'PT Sans Narrow',
+      fontFamily: 'PT Sans Narrow',
       fontWeight: '700',
       color: theme.palette.grey[700]
     },
+    selectionTitle: {
+      fontSize: '12px',
+      fontFamily: 'Helvetica Neue',
+      fontWeight: '500',
+      color: theme.palette.grey['A700']
+    },
     closeButton: {
       color: 'grey !important',
       padding: 0
@@ -72018,9 +72034,10 @@ var AdvancedFilterDialog_useStyles = styles_makeStyles(function (theme) {
       alignItems: 'center',
       '& p': {
         fontSize: '12px',
-        font: 'Helvetica Neue',
-        color: '#0549AB',
-        fontWeight: '500px'
+        fontFamily: 'Helvetica Neue',
+        color: theme.palette.primary.main,
+        fontWeight: '500',
+        lineHeight: 1.43
       },
       '& img': {
         width: 21,
@@ -72030,7 +72047,9 @@ var AdvancedFilterDialog_useStyles = styles_makeStyles(function (theme) {
     hint: {
       display: 'flex',
       flexDirection: 'row',
-      alignItems: 'center'
+      alignItems: 'center',
+      marginRight: 7,
+      color: theme.palette.primary.main
     },
     divider: {
       backgroundColor: theme.palette.primary.light
@@ -72158,32 +72177,32 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
     setSelection({});
     setSpotlight({ term: '' });
   };
-
-  var _useMemo = Object(react["useMemo"])(function () {
-    var refinedItems = es_map(function (item) {
-      return AdvancedFilterDialog_extends({}, item, {
-        isSelected: utils_isItemSelected(selectIds)(item),
-        isGreyed: es_is(Function, isDisabled) ? isDisabled(item) : false,
-        isDisabled: es_is(Function, _disableAccessor) ? _disableAccessor(item, selectIds) : false
-      });
-    }, selectionItems);
-    var indexedItemsById = es_indexBy(utils_getHierarchicalId, refinedItems);
-    var groupedItemsByParentId = es_groupBy(es_propOr('#ROOT', 'parentId'), refinedItems);
-    return { indexedItemsById: indexedItemsById, groupedItemsByParentId: groupedItemsByParentId };
-  }, [selectionItems, selectIds]),
-      indexedItemsById = _useMemo.indexedItemsById,
-      groupedItemsByParentId = _useMemo.groupedItemsByParentId;
-
   var rejectonlyDisabledItems = function rejectonlyDisabledItems(item) {
     return es_prop('isDisabled')(item) && !es_has('isForced')(item);
   };
+  var getSelectedItems = function getSelectedItems(item) {
+    return es_prop('isSelected')(item);
+  };
+
   var selectAll = function selectAll() {
-    var ids = es_pluck('id', es_reject(rejectonlyDisabledItems, es_values(indexedItemsById)));
+    var ids = es_pluck('id', es_reject(getSelectedItems, es_reject(rejectonlyDisabledItems, items)));
     var nextSelection = es_reduce(function (acc, id) {
       return es_has(id, acc) ? acc : es_assoc(id, id, acc);
     }, selection, ids);
+    setSelectionMode('selectAll');
     setSelection(nextSelection);
   };
+
+  var deselectAll = function deselectAll() {
+    var itemIds = pipe(es_filter(getSelectedItems), es_pluck('id'))(items);
+    var ids = es_difference(itemIds, selection);
+    var nextSelection = es_reduce(function (acc, id) {
+      return es_has(id, acc) ? acc : es_assoc(id, id, acc);
+    }, {}, ids);
+    setSelectionMode('deselectAll');
+    setSelection(nextSelection);
+  };
+
   return react_default.a.createElement(
     esm_Dialog_Dialog,
     {
@@ -72191,7 +72210,8 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
       PaperComponent: AdvancedFilterDialog_PaperComponent,
       'aria-labelledby': 'draggable-dialog-title',
       onClose: onClose,
-      ref: measureRef
+      ref: measureRef,
+      'aria-modal': true
     },
     react_default.a.createElement(
       esm_DialogTitle_DialogTitle,
@@ -72201,7 +72221,7 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
         { className: classes.header },
         react_default.a.createElement(
           'div',
-          { className: classes.headerLabel },
+          { className: classes.headerLabel, 'aria-label': title },
           '\xA0',
           title
         ),
@@ -72219,13 +72239,19 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
                   esm_Typography_Typography,
                   { variant: 'body2' },
                   es_prop('hint', labels)
-                )
+                ),
+                'aria-label': es_prop('hint', labels),
+                tabIndex: 0
               },
               react_default.a.createElement(EmojiObjects_default.a, null)
             ),
             react_default.a.createElement(
               esm_Typography_Typography,
-              { variant: 'body2' },
+              {
+                className: classes.selectionTitle,
+                'aria-label': es_prop('selectionMode', labels),
+                tabIndex: 0
+              },
               es_prop('selectionMode', labels)
             )
           ),
@@ -72238,7 +72264,8 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
               {
                 key: value,
                 classes: { tooltip: classes.tooltip },
-                title: react_default.a.createElement('img', { style: { width: '72px', height: '90px' }, src: img, alt: value })
+                title: react_default.a.createElement('img', { style: { width: '72px', height: '90px' }, src: img, alt: value }),
+                tabIndex: -1
               },
               react_default.a.createElement(
                 src_Button_Button,
@@ -72249,14 +72276,15 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
                     setSelectionMode(value);
                   },
                   'aria-pressed': value === selectionMode,
-                  'aria-label': label
+                  'aria-label': label,
+                  tabIndex: 0
                 },
                 react_default.a.createElement(
                   esm_Paper_Paper,
                   { className: classes.selectModeItem, key: value },
                   react_default.a.createElement(
                     esm_Typography_Typography,
-                    { variant: 'body2' },
+                    null,
                     label
                   ),
                   !es_isNil(img) && es_is(String, img) && react_default.a.createElement('img', { src: img, alt: value })
@@ -72266,7 +72294,11 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
           }, selectionOptions),
           onClose && react_default.a.createElement(
             esm_Button_Button,
-            { className: classes.closeButton, onClick: onClose },
+            {
+              className: classes.closeButton,
+              onClick: onClose,
+              'aria-label': es_prop('cancel', labels)
+            },
             react_default.a.createElement(Close_default.a, null)
           )
         )
@@ -72313,9 +72345,7 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
             ),
             react_default.a.createElement(
               src_Button_Button,
-              { style: { marginLeft: 10 }, onClick: function onClick() {
-                  return setSelection({});
-                }, color: 'primary' },
+              { style: { marginLeft: 10 }, onClick: deselectAll, color: 'primary' },
               es_prop('deselectAll', labels)
             )
           ),
@@ -72336,9 +72366,7 @@ var AdvancedFilterDialog_AdvancedFilterDialog = function AdvancedFilterDialog(pr
             selectIds: selectIds,
             treeHeight: listHeight,
             scopeGetter: scopeGetter,
-            expandedIds: expandedIds,
-            indexedItemsById: indexedItemsById,
-            groupedItemsByParentId: groupedItemsByParentId
+            expandedIds: expandedIds
           }))
         )
       )