@sis-cc/dotstatsuite-visions 12.26.0 → 12.26.1

package/es/DynamicDrawer/DynamicDrawer.js

@@ -2,7 +2,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
 
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import * as R from 'ramda';
 import cx from 'classnames';
@@ -187,9 +187,9 @@ var DynamicDrawer = function DynamicDrawer(props) {
       open = _useState[0],
       setOpen = _useState[1];
 
-  var _useState2 = useState({}),
-      filter = _useState2[0],
-      setFilter = _useState2[1];
+  var _useState2 = useState(null),
+      selectedId = _useState2[0],
+      setSelectedId = _useState2[1];
 
   var _useState3 = useState({}),
       selection = _useState3[0],
@@ -242,9 +242,12 @@ var DynamicDrawer = function DynamicDrawer(props) {
       rest = _objectWithoutProperties(props, ['list', 'labelRenderer', 'onClick', 'handleChangePanel', 'onClosePanel', 'isNarrow', 'labels', 'disableAccessor', 'isApplyHiddenNarrow', 'expandAll', 'collapseAll', 'expandedIds', 'allItems', 'periodPanel', 'classes', 'testId', 'tagAccessor', 'tagAriaLabel', 'children', 'styles']);
 
   var handleChange = function handleChange(e, item) {
-    setSelection(_extends({}, allSelection[item.id]));
+    var filterSelection = R.pipe(R.propOr([], item.id), function (arr) {
+      return R.zipObj(arr, arr);
+    })(allSelection);
+    setSelection(_extends({}, filterSelection));
     handleChangePanel(item.id, selection, allSelection);
-    setFilter(item);
+    setSelectedId(item.id);
     setOpen(true);
   };
   var handleSubmit = function handleSubmit() {
@@ -252,17 +255,24 @@ var DynamicDrawer = function DynamicDrawer(props) {
     setAllSelection({});
     setSelection({});
     setOpen(false);
-    setFilter({});
+    setSelectedId(null);
     onClosePanel();
   };
   var handleClose = function handleClose() {
     setOpen(false);
     setAllSelection({});
     setSelection({});
-    setFilter({});
+    setSelectedId(null);
     onClosePanel();
   };
 
+  var filter = useMemo(function () {
+    if (!selectedId) return {};
+    return R.find(function (item) {
+      return item.id === selectedId;
+    })(list);
+  }, [selectedId, list]);
+
   var isHidden = open && isNarrow;
   var isNotHiddenButton = (!R.isEmpty(allSelection) || !isApplyHiddenNarrow) && isNarrow;
   useEffect(function () {
@@ -327,7 +337,7 @@ var DynamicDrawer = function DynamicDrawer(props) {
           component: function component(props) {
             return PaperComponent(_extends({
               label: labelRenderer(item),
-              selected: filter.id === item.id,
+              selected: selectedId === item.id,
               tag: R.isNil(item.tag) ? React.createElement(
                 Chip,
                 { items: item.values, tagValueLabel: tagValueLabel },
@@ -387,8 +397,8 @@ var DynamicDrawer = function DynamicDrawer(props) {
         styles: styles
       },
       R.equals(filter.id, periodPanel) ? children : React.createElement(AdvancedSelection, _extends({
-        id: filter.id,
-        items: filter.values,
+        id: selectedId,
+        items: filter.values || [],
         isOpen: open,
         labelRenderer: labelRenderer,
         disableAccessor: disableAccessor ? R.pipe(R.prop('isEnabled'), R.not) : undefined,

package/lib/DynamicDrawer/DynamicDrawer.js

@@ -226,9 +226,9 @@ var DynamicDrawer = function DynamicDrawer(props) {
       open = _useState[0],
       setOpen = _useState[1];
 
-  var _useState2 = (0, _react.useState)({}),
-      filter = _useState2[0],
-      setFilter = _useState2[1];
+  var _useState2 = (0, _react.useState)(null),
+      selectedId = _useState2[0],
+      setSelectedId = _useState2[1];
 
   var _useState3 = (0, _react.useState)({}),
       selection = _useState3[0],
@@ -281,9 +281,12 @@ var DynamicDrawer = function DynamicDrawer(props) {
       rest = _objectWithoutProperties(props, ['list', 'labelRenderer', 'onClick', 'handleChangePanel', 'onClosePanel', 'isNarrow', 'labels', 'disableAccessor', 'isApplyHiddenNarrow', 'expandAll', 'collapseAll', 'expandedIds', 'allItems', 'periodPanel', 'classes', 'testId', 'tagAccessor', 'tagAriaLabel', 'children', 'styles']);
 
   var handleChange = function handleChange(e, item) {
-    setSelection(_extends({}, allSelection[item.id]));
+    var filterSelection = R.pipe(R.propOr([], item.id), function (arr) {
+      return R.zipObj(arr, arr);
+    })(allSelection);
+    setSelection(_extends({}, filterSelection));
     handleChangePanel(item.id, selection, allSelection);
-    setFilter(item);
+    setSelectedId(item.id);
     setOpen(true);
   };
   var handleSubmit = function handleSubmit() {
@@ -291,17 +294,24 @@ var DynamicDrawer = function DynamicDrawer(props) {
     setAllSelection({});
     setSelection({});
     setOpen(false);
-    setFilter({});
+    setSelectedId(null);
     onClosePanel();
   };
   var handleClose = function handleClose() {
     setOpen(false);
     setAllSelection({});
     setSelection({});
-    setFilter({});
+    setSelectedId(null);
     onClosePanel();
   };
 
+  var filter = (0, _react.useMemo)(function () {
+    if (!selectedId) return {};
+    return R.find(function (item) {
+      return item.id === selectedId;
+    })(list);
+  }, [selectedId, list]);
+
   var isHidden = open && isNarrow;
   var isNotHiddenButton = (!R.isEmpty(allSelection) || !isApplyHiddenNarrow) && isNarrow;
   (0, _react.useEffect)(function () {
@@ -366,7 +376,7 @@ var DynamicDrawer = function DynamicDrawer(props) {
           component: function component(props) {
             return PaperComponent(_extends({
               label: labelRenderer(item),
-              selected: filter.id === item.id,
+              selected: selectedId === item.id,
               tag: R.isNil(item.tag) ? _react2.default.createElement(
                 Chip,
                 { items: item.values, tagValueLabel: tagValueLabel },
@@ -426,8 +436,8 @@ var DynamicDrawer = function DynamicDrawer(props) {
         styles: styles
       },
       R.equals(filter.id, periodPanel) ? children : _react2.default.createElement(_AdvancedSelection2.default, _extends({
-        id: filter.id,
-        items: filter.values,
+        id: selectedId,
+        items: filter.values || [],
         isOpen: open,
         labelRenderer: labelRenderer,
         disableAccessor: disableAccessor ? R.pipe(R.prop('isEnabled'), R.not) : undefined,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sis-cc/dotstatsuite-visions",
-  "version": "12.26.0",
+  "version": "12.26.1",
   "description": "Library of visual components",
   "author": "OECD",
   "homepage": "https://visions-qa.siscc.org/#o",
@@ -9,7 +9,7 @@
   "main": "lib/index.js",
   "module": "es/index.js",
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   },
   "files": [
     "css",
@@ -18,37 +18,36 @@
     "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",
+    "peers": "install-peers --force-run",
+    "build": "cross-env NODE_OPTIONS=--openssl-legacy-provider nwb build-react-component --copy-files --no-demo && node scripts/doc && cross-env NODE_OPTIONS=--openssl-legacy-provider nwb build-demo",
+    "build:dev": "cross-env NODE_OPTIONS=--openssl-legacy-provider nwb build-react-component --copy-files --no-demo",
     "clean": "nwb clean-module && nwb clean-demo",
     "prepublishOnly": "npm run build",
-    "start": "nwb serve-react-demo",
+    "start": "cross-env NODE_OPTIONS=--openssl-legacy-provider nwb serve-react-demo",
     "test": "jest",
     "test:watch": "jest --watch --no-cache",
     "lint": "eslint src/ --color",
     "precommit": "lint-staged"
   },
   "dependencies": {
-    "@emotion/react": "^11.13.0",
-    "@emotion/styled": "^11.13.0",
     "@hello-pangea/dnd": "^16.6.0",
-    "@mui/icons-material": "^5.16.5",
-    "@mui/material": "^5.16.5",
-    "@mui/styles": "^5.16.5",
     "@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-draggable": "^4.4.5",
+    "react-draggable": "4.4.5",
     "react-error-boundary": "^4.0.10",
     "react-virtualized": "^9.21.2"
   },
   "peerDependencies": {
-    "@mui/icons-material": "^5.16.5",
-    "@mui/material": "^5.16.5",
+    "@emotion/react": "^11",
+    "@emotion/styled": "^11",
+    "@mui/icons-material": "^5",
+    "@mui/material": "^5",
+    "@mui/styles": "^5",
+    "date-fns": "^1.30.1",
+    "numeral": "^2.0.6",
     "react": "^18",
     "react-dom": "^18"
   },
@@ -56,12 +55,11 @@
     "@babel/eslint-parser": "^7.5.4",
     "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@cfaester/enzyme-adapter-react-18": "^0.7.0",
-    "@mui/icons-material": "^5.16.5",
-    "@mui/material": "^5.16.5",
     "@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",
+    "cross-env": "^7.0.3",
     "dox": "^0.9.0",
     "eslint": "^8.39.0",
     "eslint-plugin-import": "^2.27.5",
@@ -71,6 +69,7 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "husky": "^2.7.0",
     "identity-obj-proxy": "^3.0.0",
+    "install-peers-cli": "^2.2.0",
     "jest": "^24.8.0",
     "jss": "^10.10.0",
     "jss-rtl": "^0.2.3",
@@ -79,9 +78,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",