superdd - npm Package Compare versions

Comparing version 1.2.3 to 2.0.0

dist/index.js

@@ -6,9 +6,34 @@ "use strict";
 });
-exports.default = void 0;
+exports.TagsContainer = exports.SuperDD = void 0;
 
+var _react = _interopRequireDefault(require("react"));
+
+var _redux = require("redux");
+
+var _reactRedux = require("react-redux");
+
 var _SuperDD = _interopRequireDefault(require("./SuperDD/SuperDD"));
 
+var _TagsContainer = _interopRequireDefault(require("./TagsContainer/TagsContainer"));
+
+var _reducer = _interopRequireDefault(require("./Redux/reducer"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _default = _SuperDD.default;
-exports.default = _default;
+const store = (0, _redux.createStore)(_reducer.default);
+
+const SuperDD = props => {
+  return /*#__PURE__*/_react.default.createElement(_reactRedux.Provider, {
+    store: store
+  }, /*#__PURE__*/_react.default.createElement(_SuperDD.default, props));
+};
+
+exports.SuperDD = SuperDD;
+
+const TagsContainer = props => {
+  return /*#__PURE__*/_react.default.createElement(_reactRedux.Provider, {
+    store: store
+  }, /*#__PURE__*/_react.default.createElement(_TagsContainer.default, props));
+};
+
+exports.TagsContainer = TagsContainer;

dist/SuperDD/SuperDD.js

@@ -14,2 +14,6 @@ "use strict";
 
+var _reactRedux = require("react-redux");
+
+var _actions = require("../Redux/actions");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -25,7 +29,7 @@
 
-const SuperDD = props => {
+const SuperDD = /*#__PURE__*/_react.default.memo(props => {
   const {
     DataList,
     DisplayBy,
-    PlaceHolder = "Select Items ...",
+    PlaceHolder = 'Select Items ...',
     ShowUpdateButton = true,
@@ -35,9 +39,24 @@ ShowCancelButton = true,
     CancelAction = () => {},
-    SelectedLabelsOutsideIn,
     Filterable = true
   } = props;
+  const dispatch = (0, _reactRedux.useDispatch)();
   const [search, setSearch] = (0, _react.useState)('');
-  const [localDataList, setLocalDataList] = (0, _react.useState)(DataList.map(dl => _objectSpread(_objectSpread({}, dl), {}, {
-    isSelected: false
-  })));
+  const reduxDataList = (0, _reactRedux.useSelector)(state => state.dataList);
+
+  const getInitLocalDataList = () => {
+    if (reduxDataList && reduxDataList.length > 0) {
+      return reduxDataList;
+    } else {
+      var _DataList$map;
+
+      return (_DataList$map = DataList === null || DataList === void 0 ? void 0 : DataList.map(dl => _objectSpread(_objectSpread({}, dl), {}, {
+        isSelected: false
+      }))) !== null && _DataList$map !== void 0 ? _DataList$map : [];
+    }
+  };
+
+  const [localDataList, setLocalDataList] = (0, _react.useState)(getInitLocalDataList());
+  (0, _react.useEffect)(() => {
+    setLocalDataList(getInitLocalDataList());
+  }, [reduxDataList]);
   const supperDDSelectBoxRef = (0, _react.useRef)(null);
@@ -50,11 +69,2 @@ const supperDDSelectOutputRef = (0, _react.useRef)(null);
     })));
-
-    if (event.target.checked) {
-      const span = document.createElement('span');
-      span.setAttribute('id', 'superDD___ExternalTag' + objectOfList.Id);
-      span.textContent = objectOfList[DisplayBy];
-      SelectedLabelsOutsideIn.current.appendChild(span);
-    } else {
-      document.getElementById('superDD___ExternalTag' + objectOfList.Id).remove();
-    }
   };
@@ -68,3 +78,3 @@
         key: index,
-        className: 'supperDDcheckbox-container' + (value.isSelected ? ' Active' : '')
+        className: 'supperDDcheckbox-container' + (value.isSelected ? ' supperDDcheckbox-active' : '')
       }, /*#__PURE__*/_react.default.createElement("input", {
@@ -99,14 +109,4 @@ type: "checkbox",
     })));
-    clearSelectedlabels();
   };
 
-  const clearSelectedlabels = () => {
-    var child = SelectedLabelsOutsideIn.current.lastElementChild;
-
-    while (child) {
-      SelectedLabelsOutsideIn.current.removeChild(child);
-      child = SelectedLabelsOutsideIn.current.lastElementChild;
-    }
-  };
-
   const selectedAll = () => {
@@ -116,14 +116,7 @@ setLocalDataList(localDataList.map(ldl => _objectSpread(_objectSpread({}, ldl), {}, {
     })));
-    clearSelectedlabels();
-    localDataList.forEach(ldl => {
-      const span = document.createElement('span');
-      span.setAttribute('id', 'superDD___ExternalTag' + ldl.Id);
-      span.textContent = ldl[DisplayBy];
-      SelectedLabelsOutsideIn.current.appendChild(span);
-    });
   };
 
   const updateButtonClickHandler = e => {
+    dispatch((0, _actions.updateDataList)(localDataList));
     UpdateAction();
-    toggleShow();
   };
@@ -140,2 +133,6 @@
 
+  const isAllSelected = () => {
+    return localDataList.every(dl => dl.isSelected);
+  };
+
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -160,3 +157,3 @@ className: "supperDD"
     type: 'text'
-  }), /*#__PURE__*/_react.default.createElement("input", {
+  }), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("input", {
     type: "checkbox",
@@ -168,4 +165,5 @@ onChange: e => handleSelectAll(e),
     },
-    title: 'Select All'
-  })), getLiListItems(), /*#__PURE__*/_react.default.createElement("div", {
+    title: 'Select All',
+    checked: isAllSelected()
+  }), /*#__PURE__*/_react.default.createElement("label", null, "Select All"))), getLiListItems(), /*#__PURE__*/_react.default.createElement("div", {
     className: "superdd-select-buttons"
@@ -179,5 +177,8 @@ }, ShowUpdateButton && /*#__PURE__*/_react.default.createElement("button", {
   }, "Cancel"))))));
-};
+});
 
-var _default = SuperDD;
+var _default = (0, _reactRedux.connect)(state => ({
+  score: state.dataList
+}))(SuperDD);
+
 exports.default = _default;

package.json

 {
   "name": "superdd",
-  "version": "1.2.3",
+  "version": "2.0.0",
   "description": "Very useful react component for multi selection dropdown with filtering , toggle selecting all, tags outside the dropdown and custom button inside dropdown ",
@@ -62,4 +62,6 @@ "keywords": [
   "dependencies": {
-    "@babel/polyfill": "^7.12.1"
+    "@babel/polyfill": "^7.12.1",
+    "react-redux": "^7.2.4",
+    "redux": "^4.1.0"
   }
 }

README.md

@@ -1,2 +0,2 @@
-# SupperDD
+# SuperDD
 
@@ -3,0 +3,0 @@ Very useful react component for multi selection dropdown with filtering ,

No alert changes

Improved metrics

Total package byte prevSize

25908

increased by72.66%

Number of package files

11

increased by120%

Lines of code

572

increased by79.31%

Worsened metrics

Dependency count

5

increased by66.67%

Dependency changes

• + Addedreact-redux@^7.2.4

• + Addedredux@^4.1.0

• + Added@babel/runtime@7.26.9(transitive)

• + Added@types/hoist-non-react-statics@3.3.6(transitive)

• + Added@types/react@19.0.10(transitive)

• + Added@types/react-redux@7.1.34(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addedhoist-non-react-statics@3.3.2(transitive)

• + Addedprop-types@15.8.1(transitive)

• + Addedreact-is@16.13.117.0.2(transitive)

• + Addedreact-redux@7.2.9(transitive)

• + Addedredux@4.2.1(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)