@majoo-ui/react 1.58.6 → 1.58.7

package/index.esm.js

@@ -6040,7 +6040,7 @@ InputCheckbox.propTypes = {
   onCheckedChange: PropTypes.func,
   label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
   index: PropTypes.number,
-  value: PropTypes.oneOfType(PropTypes.string, PropTypes.number, PropTypes.object)
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object])
 };
 InputCheckbox.displayName = 'InputCheckbox';
 
@@ -22007,6 +22007,7 @@ function Table({
   const [dataRow, setDataRow] = useState({});
   const [tableScrollPosition, setTableScrollPosition] = useState('start');
   const [scrollAreaWidth, setScrollAreaWidth] = useState(0);
+  const [stateSelectedRowIds, setStateSelectedRowIds] = useState([]);
   const {
     t
   } = useTranslation('MajooUI/table');
@@ -22277,8 +22278,28 @@ function Table({
     if (rawData && rawData.length > 0) doFetchData(0, isInfiniteScroll ? rowLimit : pageSize);
   }, [sortBy]);
   useMountedLayoutEffect(() => {
-    if (rawData && rawData.length > 0 && selectedRowIds && onSelectedChange) onSelectedChange(selectedRowIds ? Object.keys(selectedRowIds) : []);
+    if (rawData && rawData.length > 0 && selectedRowIds && onSelectedChange) {
+      const selectIds = Object.keys(selectedRowIds);
+      if (stateSelectedRowIds.length > 0) {
+        if (selectIds.length < stateSelectedRowIds.length) {
+          const filteredSelectedRowIds = stateSelectedRowIds.filter(item => selectIds.includes(item));
+          setStateSelectedRowIds(filteredSelectedRowIds);
+          !filteredSelectedRowIds.length && (onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange([]));
+        } else {
+          selectIds.forEach(item => {
+            if (!stateSelectedRowIds.includes(item)) {
+              setStateSelectedRowIds(prev => [...prev, item]);
+            }
+          });
+        }
+      } else {
+        setStateSelectedRowIds(selectIds.length ? selectIds : []);
+      }
+    }
   }, [selectedRowIds]);
+  useMountedLayoutEffect(() => {
+    stateSelectedRowIds.length && (onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange(stateSelectedRowIds));
+  }, [onSelectedChange, stateSelectedRowIds]);
   useEffect(() => {
     var _a;
     if (isInfiniteScroll && rawData.length <= rowLimit) {
@@ -23956,6 +23977,11 @@ const itemStyles = {
   }
 };
 const StyledItem = styled(DropdownMenuPrimitive.Item, Object.assign({}, itemStyles));
+StyledItem.propTypes = {
+  asChild: PropTypes.bool,
+  disabled: PropTypes.bool,
+  onSelect: PropTypes.func
+};
 const StyledCheckboxItem = styled(DropdownMenuPrimitive.CheckboxItem, Object.assign({}, itemStyles));
 const StyledRadioItem = styled(DropdownMenuPrimitive.RadioItem, Object.assign({}, itemStyles));
 // const StyledTriggerItem = styled(DropdownMenuPrimitive.TriggerItem, {
@@ -23998,7 +24024,7 @@ const DropdownMenuContext = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 120,
+      lineNumber: 127,
       columnNumber: 5
     }
   }), /*#__PURE__*/React__default.createElement(Context.Provider, {
@@ -24009,11 +24035,15 @@ const DropdownMenuContext = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 121,
+      lineNumber: 128,
       columnNumber: 7
     }
   }, children));
 };
+DropdownMenuContext.propTypes = {
+  side: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
+  align: PropTypes.oneOfType(['start', 'center', 'end'])
+};
 const DropdownMenuContentContext = props => {
   const {
     side,
@@ -24038,11 +24068,16 @@ const DropdownMenuContentContext = props => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 139,
+      lineNumber: 151,
       columnNumber: 5
     }
   }), props.children);
 };
+DropdownMenuContentContext.propTypes = {
+  sideOffset: PropTypes.number,
+  alignOffset: PropTypes.number,
+  asChild: PropTypes.bool
+};
 const DropdownTrigger = /*#__PURE__*/React__default.forwardRef((_ref2, ref) => {
   let {
       children
@@ -24059,11 +24094,14 @@ const DropdownTrigger = /*#__PURE__*/React__default.forwardRef((_ref2, ref) => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 148,
+      lineNumber: 166,
       columnNumber: 5
     }
   }));
 });
+DropdownTrigger.propTypes = {
+  asChild: PropTypes.bool
+};
 const RightSlot = styled('div', {
   marginLeft: 'auto',
   ':focus > &': {
@@ -24090,7 +24128,7 @@ const ButtonDropdown = /*#__PURE__*/React__default.forwardRef((props, ref) => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$a,
-      lineNumber: 175,
+      lineNumber: 197,
       columnNumber: 5
     }
   }), rest.children);

package/index.umd.js

@@ -6121,7 +6121,7 @@
     onCheckedChange: PropTypes__default["default"].func,
     label: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].node]),
     index: PropTypes__default["default"].number,
-    value: PropTypes__default["default"].oneOfType(PropTypes__default["default"].string, PropTypes__default["default"].number, PropTypes__default["default"].object)
+    value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number, PropTypes__default["default"].object])
   };
   InputCheckbox.displayName = 'InputCheckbox';
 
@@ -22348,6 +22348,9 @@
     var _v = React.useState(0),
       scrollAreaWidth = _v[0],
       setScrollAreaWidth = _v[1];
+    var _w = React.useState([]),
+      stateSelectedRowIds = _w[0],
+      setStateSelectedRowIds = _w[1];
     var t = reactI18next.useTranslation('MajooUI/table').t;
     var isMobile = useMediaQuery(isMobileLayout === undefined ? '(max-width: 1024px)' : isMobileLayout ? '(max-width: 8000px)' : '(max-width: 0px)');
     var customEmptyDataProps = searchQuery ? defaultEmptySearchProps(t, isMobile, searchQuery) : emptyDataProps || defaultEmptyDataProps(t, isMobile);
@@ -22394,11 +22397,11 @@
       setPageSize = instance.setPageSize,
       toggleRowSelected = instance.toggleRowSelected,
       toggleAllRowsSelected = instance.toggleAllRowsSelected,
-      _w = instance.state,
-      pageIndex = _w.pageIndex,
-      pageSize = _w.pageSize,
-      sortBy = _w.sortBy,
-      selectedRowIds = _w.selectedRowIds,
+      _x = instance.state,
+      pageIndex = _x.pageIndex,
+      pageSize = _x.pageSize,
+      sortBy = _x.sortBy,
+      selectedRowIds = _x.selectedRowIds,
       setHiddenColumns = instance.setHiddenColumns,
       setColumnOrder = instance.setColumnOrder;
     var doFetchData = function doFetchData(pageIndex, pageSize, sortAccessor, sortDirection) {
@@ -22641,8 +22644,32 @@
       if (rawData && rawData.length > 0) doFetchData(0, isInfiniteScroll ? rowLimit : pageSize);
     }, [sortBy]);
     reactTable.useMountedLayoutEffect(function () {
-      if (rawData && rawData.length > 0 && selectedRowIds && onSelectedChange) onSelectedChange(selectedRowIds ? Object.keys(selectedRowIds) : []);
+      if (rawData && rawData.length > 0 && selectedRowIds && onSelectedChange) {
+        var selectIds_1 = Object.keys(selectedRowIds);
+        if (stateSelectedRowIds.length > 0) {
+          if (selectIds_1.length < stateSelectedRowIds.length) {
+            var filteredSelectedRowIds = stateSelectedRowIds.filter(function (item) {
+              return selectIds_1.includes(item);
+            });
+            setStateSelectedRowIds(filteredSelectedRowIds);
+            !filteredSelectedRowIds.length && (onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange([]));
+          } else {
+            selectIds_1.forEach(function (item) {
+              if (!stateSelectedRowIds.includes(item)) {
+                setStateSelectedRowIds(function (prev) {
+                  return __spreadArray(__spreadArray([], prev, true), [item], false);
+                });
+              }
+            });
+          }
+        } else {
+          setStateSelectedRowIds(selectIds_1.length ? selectIds_1 : []);
+        }
+      }
     }, [selectedRowIds]);
+    reactTable.useMountedLayoutEffect(function () {
+      stateSelectedRowIds.length && (onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange(stateSelectedRowIds));
+    }, [onSelectedChange, stateSelectedRowIds]);
     React.useEffect(function () {
       var _a;
       if (isInfiniteScroll && rawData.length <= rowLimit) {
@@ -24362,6 +24389,11 @@
     }
   };
   const StyledItem = styled(DropdownMenuPrimitive__namespace.Item, Object.assign({}, itemStyles));
+  StyledItem.propTypes = {
+    asChild: PropTypes__default["default"].bool,
+    disabled: PropTypes__default["default"].bool,
+    onSelect: PropTypes__default["default"].func
+  };
   const StyledCheckboxItem = styled(DropdownMenuPrimitive__namespace.CheckboxItem, Object.assign({}, itemStyles));
   const StyledRadioItem = styled(DropdownMenuPrimitive__namespace.RadioItem, Object.assign({}, itemStyles));
   // const StyledTriggerItem = styled(DropdownMenuPrimitive.TriggerItem, {
@@ -24404,7 +24436,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$a,
-        lineNumber: 120,
+        lineNumber: 127,
         columnNumber: 5
       }
     }), /*#__PURE__*/React__default["default"].createElement(Context.Provider, {
@@ -24415,11 +24447,15 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$a,
-        lineNumber: 121,
+        lineNumber: 128,
         columnNumber: 7
       }
     }, children));
   };
+  DropdownMenuContext.propTypes = {
+    side: PropTypes__default["default"].oneOf(['top', 'right', 'bottom', 'left']),
+    align: PropTypes__default["default"].oneOfType(['start', 'center', 'end'])
+  };
   const DropdownMenuContentContext = props => {
     const {
       side,
@@ -24444,11 +24480,16 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$a,
-        lineNumber: 139,
+        lineNumber: 151,
         columnNumber: 5
       }
     }), props.children);
   };
+  DropdownMenuContentContext.propTypes = {
+    sideOffset: PropTypes__default["default"].number,
+    alignOffset: PropTypes__default["default"].number,
+    asChild: PropTypes__default["default"].bool
+  };
   const DropdownTrigger = /*#__PURE__*/React__default["default"].forwardRef((_ref2, ref) => {
     let {
         children
@@ -24465,11 +24506,14 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$a,
-        lineNumber: 148,
+        lineNumber: 166,
         columnNumber: 5
       }
     }));
   });
+  DropdownTrigger.propTypes = {
+    asChild: PropTypes__default["default"].bool
+  };
   const RightSlot = styled('div', {
     marginLeft: 'auto',
     ':focus > &': {
@@ -24496,7 +24540,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$a,
-        lineNumber: 175,
+        lineNumber: 197,
         columnNumber: 5
       }
     }), rest.children);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.58.6",
+  "version": "1.58.7",
   "dependencies": {
     "@majoo-ui/core": "^1.31.3",
     "@majoo-ui/helpers": "^1.30.5",