sag_components 1.0.369 → 1.0.371

package/dist/stories/components/Dropdown.js

@@ -72,16 +72,18 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     currentInputValue = _useState2[0],
     setCurrentInputValue = _useState2[1];
-  var _useState3 = (0, _react.useState)(null),
+  var _useState3 = (0, _react.useState)(defaultValue ? {
+      filterArray: defaultValue
+    } : null),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    currentOption = _useState4[0],
-    setCurrentOption = _useState4[1];
-  // const [defaultValueSetFlag, setDefaultValueSetFlag] = useState(false);
-
-  // useEffect(() => {
-  //   reset ? setDefaultValueSetFlag(false) : null;
-  // }, [reset]);
-
+    currentFilterMultiSelectState = _useState4[0],
+    setCurrentFilterMultiSelectState = _useState4[1];
+  (0, _react.useEffect)(function () {
+    setCurrentFilterMultiSelectState({
+      filterArray: defaultValue
+    });
+    console.log("filterMultiSelect", currentFilterMultiSelectState);
+  }, [defaultValue]);
   (0, _react.useEffect)(function () {
     var delayDebounceFn = setTimeout(function () {
       onInputChange(currentInputValue);
@@ -216,10 +218,10 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
     });
   };
   var onChangeHandler = function onChangeHandler(event, newValue) {
-    setCurrentOption({
-      syntheticBaseEvent: event,
-      newValue: newValue
+    setCurrentFilterMultiSelectState({
+      filterArray: newValue
     });
+    console.log("currentFilterMultiSelectState", currentFilterMultiSelectState);
     // setDefaultValueSetFlag(true);
     onChange({
       syntheticBaseEvent: event,
@@ -273,10 +275,9 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
       disableClearable: disableClearable,
       defaultValue: defaultValue,
       id: "combo-box",
-      options: options,
-      sx: {
-        width: width
-      },
+      options: options
+      // sx={{ width }}
+      ,
       popupIcon: showPopupIcon ? /*#__PURE__*/_react.default.createElement(_ArrowDropDownIcon.ArrowDropDownIcon, {
         width: "0.5em",
         height: "0.5em"
@@ -305,15 +306,7 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
             }, /*#__PURE__*/_react.default.createElement(_Search.default, {
               fontSize: "medium"
             })) : null
-          }),
-          InputLabelProps: {
-            style: {
-              // color: labelColor,
-              fontSize: inputLabelFontSize,
-              //default: '16px',
-              fontFamily: "Poppins"
-            }
-          }
+          })
         }));
       },
       ListboxProps: {
@@ -332,10 +325,9 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
       theme: theme
     }, /*#__PURE__*/_react.default.createElement(_Autocomplete.default, {
       key: reset,
-      defaultValue: defaultValue,
-      style: {
-        width: width
-      },
+      defaultValue: defaultValue
+      //style={{ width }}
+      ,
       onChange: function onChange(event, newValue) {
         onChangeHandler(event, newValue);
       },
@@ -360,67 +352,34 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
         var selected = _ref2.selected;
         return /*#__PURE__*/_react.default.createElement("li", props, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
           icon: icon,
-          checkedIcon: checkedIcon
-          // style={{
-          //   marginRight: 8,
-          //   fontSize: '14px',
-          //   fontFamily: 'Poppins',
-          // }}
-          ,
-          checked: selected
+          checkedIcon: checkedIcon,
+          checked: isOptionChecked(option)
         }), option.label);
       },
       renderInput: function renderInput(params) {
-        return showSearchIcon && (!currentOption || currentOption && currentOption.length === 0) ? /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, params, {
-          label: text,
-          size: size,
-          sx: getTextFieldStyleMulti(),
-          placeholder: placeHolder,
-          onKeyDown: function onKeyDown(event) {
-            if (!isInputAllowed(event.key)) {
-              event.preventDefault();
-            }
-          },
-          inputRef: inputRef || null,
-          required: required,
-          InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
-            style: {
-              fontSize: placeHolderFontSize,
-              fontFamily: "Poppins"
+        return (
+          /*#__PURE__*/
+          //showSearchIcon &&
+          _react.default.createElement(_TextField.default, Object.assign({}, params, {
+            label: text,
+            size: size,
+            sx: getTextFieldStyleMulti(),
+            placeholder: placeHolder,
+            InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
+              style: {
+                fontSize: placeHolderFontSize,
+                fontFamily: "Poppins"
+              }
+            }),
+            onKeyDown: function onKeyDown(event) {
+              if (!isInputAllowed(event.key)) {
+                event.preventDefault();
+              }
             },
-            startAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
-              position: "start"
-            }, /*#__PURE__*/_react.default.createElement(_Search.default, {
-              fontSize: "medium"
-            }))
-          })
-          // InputLabelProps={{
-          //   style: {
-          //   // color: labelColor,
-          //     fontSize: '16px',
-          //     fontFamily: 'Poppins',
-          //   },
-          // }}
-        })) : /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, params, {
-          label: text,
-          size: size,
-          sx: getTextFieldStyleMulti(),
-          placeholder: placeHolder,
-          onKeyDown: function onKeyDown(event) {
-            if (!isInputAllowed(event.key)) {
-              event.preventDefault();
-            }
-          },
-          inputRef: inputRef || null,
-          required: required,
-          InputLabelProps: {
-            style: {
-              fontSize: inputLabelFontSize,
-              //default: '16px',
-              fontFamily: "Poppins"
-            }
-          }
-        }));
+            inputRef: inputRef || null,
+            required: required
+          }))
+        );
       },
       ListboxProps: {
         style: {
@@ -431,6 +390,16 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
       }
     }));
   };
+  var isOptionChecked = function isOptionChecked(option) {
+    var _currentFilterMultiSe;
+    if (currentFilterMultiSelectState && currentFilterMultiSelectState.filterArray && currentFilterMultiSelectState.filterArray.length > 0 && (_currentFilterMultiSe = currentFilterMultiSelectState.filterArray) !== null && _currentFilterMultiSe !== void 0 && _currentFilterMultiSe.map(function (itemFilter) {
+      return itemFilter.label;
+    }).includes(option.label)) {
+      return true;
+    } else {
+      return false;
+    }
+  };
 
   // --------------------------------- MAIN -------------------------------------
   return /*#__PURE__*/_react.default.createElement(_Dropdown.DropdownContainer, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sag_components",
-  "version": "1.0.369",
+  "version": "1.0.371",
   "description": "",
   "main": "dist/index.js",
   "scripts": {