refactor: use lodash-es instead of lodash

babel.config.js

@@ -14,7 +14,6 @@ module.exports = (api, options) => {
       '@babel/typescript'
     ],
     plugins: [
-      'lodash',
       ['@babel/plugin-transform-class-properties', { loose: true }],
       '@babel/plugin-transform-optional-chaining',
       '@babel/plugin-transform-export-namespace-from',

docs/App.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
-import { Nav } from 'rsuite';
 import CodeView from 'react-code-view';
-import Frame from './components/Frame';
 import TableIcon from '@rsuite/icons/Table';
 import GithubIcon from '@rsuite/icons/legacy/Github';
 import BookIcon from '@rsuite/icons/legacy/Book';
-import kebabCase from 'lodash/kebabCase';
+import Frame from './components/Frame';
+import { Nav } from 'rsuite';
+import { kebabCase } from 'lodash-es';
 
 interface ExampleType {
   title: string;

docs/index.tsx

@@ -1,5 +1,12 @@
 import React, { StrictMode } from 'react';
 import ReactDOM from 'react-dom/client';
+import GearIcon from '@rsuite/icons/Gear';
+import ArrowDownIcon from '@rsuite/icons/ArrowDown';
+import ArrowUpIcon from '@rsuite/icons/ArrowUp';
+import SortIcon from '@rsuite/icons/Sort';
+import fakeDataForColSpan from './data/usersForColSpan';
+import fakeDataForRowSpan from './data/usersForRowSpan';
+import App from './App';
 import {
   Popover,
   Whisper,
@@ -16,19 +23,9 @@ import {
   VStack,
   HStack
 } from 'rsuite';
-import clone from 'lodash/clone';
-import isFunction from 'lodash/isFunction';
-import get from 'lodash/get';
-import without from 'lodash/without';
-import App from './App';
+import { clone, isFunction, get, without } from 'lodash-es';
 import { Table, Column, Cell, HeaderCell, ColumnGroup } from '../src';
-import fakeDataForColSpan from './data/usersForColSpan';
-import fakeDataForRowSpan from './data/usersForRowSpan';
 import { createUser, mockUsers, mockTreeData } from './data/mock';
-import GearIcon from '@rsuite/icons/Gear';
-import ArrowDownIcon from '@rsuite/icons/ArrowDown';
-import ArrowUpIcon from '@rsuite/icons/ArrowUp';
-import SortIcon from '@rsuite/icons/Sort';
 import { useDrag, useDrop, DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { faker } from '@faker-js/faker';

package.json

@@ -44,9 +44,10 @@
     "@babel/runtime": "^7.20.1",
     "@juggle/resize-observer": "^3.4.0",
     "@rsuite/icons": "^1.3.0",
+    "@types/lodash-es": "^4.17.12",
     "classnames": "^2.3.1",
     "dom-lib": "^3.3.1",
-    "lodash": "^4.17.21"
+    "lodash-es": "^4.17.21"
   },
   "peerDependencies": {
     "react": ">=18",
@@ -68,15 +69,13 @@
     "@faker-js/faker": "^7.6.0",
     "@size-limit/file": "^11.1.6",
     "@testing-library/react": "^13.4.0",
-    "@types/lodash": "^4.14.165",
     "@types/react": "^18.2.0",
     "@types/react-dom": "^18.2.0",
     "@typescript-eslint/eslint-plugin": "^6.9.0",
     "@typescript-eslint/parser": "^6.9.0",
     "autoprefixer": "^8.3.0",
     "babel-loader": "^8.2.2",
     "babel-plugin-istanbul": "^7.0.0",
-    "babel-plugin-lodash": "^3.3.4",
     "chai": "^4.3.5",
     "conventional-changelog-cli": "^2.1.1",
     "coveralls": "^3.1.0",

src/Cell.tsx

@@ -1,12 +1,10 @@
 import React, { useCallback } from 'react';
-import omit from 'lodash/omit';
-import isNil from 'lodash/isNil';
-import get from 'lodash/get';
-import { LAYER_WIDTH, ROW_HEADER_HEIGHT, ROW_HEIGHT } from './constants';
-import { useClassNames, convertToFlex } from './utils';
 import TableContext from './TableContext';
 import ArrowRight from '@rsuite/icons/ArrowRight';
 import ArrowDown from '@rsuite/icons/ArrowDown';
+import { omit, isNil, get } from 'lodash-es';
+import { LAYER_WIDTH, ROW_HEADER_HEIGHT, ROW_HEIGHT } from './constants';
+import { useClassNames, convertToFlex } from './utils';
 import { StandardProps, RowDataType, RowKeyType } from './@types/common';
 import { columnHandledProps } from './Column';
 

src/ColumnResizeHandler.tsx

@@ -1,8 +1,8 @@
 import React, { useCallback, useContext, useEffect, useRef } from 'react';
-import clamp from 'lodash/clamp';
 import DOMMouseMoveTracker from 'dom-lib/DOMMouseMoveTracker';
-import { useClassNames } from './utils';
 import TableContext from './TableContext';
+import { clamp } from 'lodash-es';
+import { useClassNames } from './utils';
 import { RESIZE_MIN_WIDTH } from './constants';
 import type { StandardProps } from './@types/common';
 

src/HeaderCell.tsx

@@ -1,12 +1,12 @@
 import React, { useState, useCallback } from 'react';
 import classNames from 'classnames';
-import isNil from 'lodash/isNil';
 import Sort from '@rsuite/icons/Sort';
 import SortUp from '@rsuite/icons/SortUp';
 import SortDown from '@rsuite/icons/SortDown';
 import ColumnResizeHandler, { FixedType } from './ColumnResizeHandler';
-import { useUpdateEffect, useClassNames } from './utils';
 import Cell, { InnerCellProps } from './Cell';
+import { useUpdateEffect, useClassNames } from './utils';
+import { isNil } from 'lodash-es';
 import { RowDataType, RowKeyType } from './@types/common';
 
 export interface HeaderCellProps<Row extends RowDataType, Key extends RowKeyType>

src/Table.tsx

@@ -1,8 +1,4 @@
 import React, { useRef, useCallback, useImperativeHandle, useReducer, useMemo } from 'react';
-import { isElement } from './utils/react-is';
-import { getTranslateDOMPositionXY } from 'dom-lib/translateDOMPositionXY';
-import isFunction from 'lodash/isFunction';
-import debounce from 'lodash/debounce';
 import Row, { RowProps } from './Row';
 import CellGroup from './CellGroup';
 import Scrollbar, { ScrollbarInstance } from './Scrollbar';
@@ -14,6 +10,9 @@ import Cell, { InnerCellProps } from './Cell';
 import HeaderCell, { HeaderCellProps } from './HeaderCell';
 import Column, { ColumnProps } from './Column';
 import ColumnGroup from './ColumnGroup';
+import { debounce, isFunction } from 'lodash-es';
+import { isElement } from './utils/react-is';
+import { getTranslateDOMPositionXY } from 'dom-lib/translateDOMPositionXY';
 import {
   SCROLLBAR_WIDTH,
   CELL_PADDING_HEIGHT,

src/utils/defer.ts

@@ -1,4 +1,4 @@
-import defer from 'lodash/defer';
+import { defer } from 'lodash-es';
 
 /**
  * Defer callbacks to wait for DOM rendering to complete.