[optimize] MobX 6 & React 18 compatibility

[optimize] upgrade Upstream packages
[add] Dependency Badge based on Libraries.io
[fix] some detail bugs of UI & Type

.github/workflows/main.yml

@@ -14,7 +14,7 @@ jobs:
           version: 8
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
           registry-url: https://registry.npmjs.org
           cache: pnpm
       - name: Install Dependencies

ReadMe.md

@@ -2,9 +2,10 @@
 
 A **Pagination Table** & **Scroll List** component suite for [CRUD operation][1], which is based on [MobX RESTful][2] & [React][3].
 
-[![CI & CD](https://github.com/idea2app/MobX-RESTful-table/actions/workflows/main.yml/badge.svg)][4]
+[![NPM Dependency](https://img.shields.io/librariesio/github/idea2app/MobX-RESTful-table.svg)][4]
+[![CI & CD](https://github.com/idea2app/MobX-RESTful-table/actions/workflows/main.yml/badge.svg)][5]
 
-[![NPM](https://nodei.co/npm/mobx-restful-table.png?downloads=true&downloadRank=true&stars=true)][5]
+[![NPM](https://nodei.co/npm/mobx-restful-table.png?downloads=true&downloadRank=true&stars=true)][6]
 
 ## Components
 
@@ -51,22 +52,22 @@ npm i react \
 
 ### Internationalization
 
-1. [set up Text in UI][6]
-2. [import Text files][7]
+1. [set up Text in UI][7]
+2. [import Text files][8]
 
 ### Data source
 
-1. [set up HTTP client][8]
-2. [implement Model class][9]
+1. [set up HTTP client][9]
+2. [implement Model class][10]
 
 ## Initialization
 
 ### Pagination Table
 
 Inspired by [Ant Design - Pro Table](https://procomponents.ant.design/components/table)
 
-- [Source Code][10]
-- [Preview Link][11]
+- [Source Code][11]
+- [Preview Link][12]
 
 ```tsx
 import { computed } from 'mobx';
@@ -141,11 +142,11 @@ export default class PaginationPage extends PureComponent {
 
 ### Scroll List
 
-[Preview Link][12]
+[Preview Link][13]
 
 #### `pages/scroll-list.tsx`
 
-[Source Code][13]
+[Source Code][14]
 
 ```tsx
 import { observer } from 'mobx-react';
@@ -227,13 +228,14 @@ export const EditorPage = () => (
 [1]: https://en.wikipedia.org/wiki/Create,_read,_update_and_delete
 [2]: https://github.com/idea2app/MobX-RESTful
 [3]: https://reactjs.org/
-[4]: https://github.com/idea2app/MobX-RESTful-table/actions/workflows/main.yml
-[5]: https://nodei.co/npm/mobx-restful-table/
-[6]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Translation.ts
-[7]: https://github.com/idea2app/Next-Bootstrap-TS/tree/main/translation
-[8]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Base.ts#L12-L24
-[9]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Repository.ts
-[10]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/pages/pagination.tsx
-[11]: https://next-bootstrap-ts.vercel.app/pagination/
-[12]: https://next-bootstrap-ts.vercel.app/scroll-list/
-[13]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/pages/scroll-list.tsx
+[4]: https://libraries.io/npm/mobx-restful-table
+[5]: https://github.com/idea2app/MobX-RESTful-table/actions/workflows/main.yml
+[6]: https://nodei.co/npm/mobx-restful-table/
+[7]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Translation.ts
+[8]: https://github.com/idea2app/Next-Bootstrap-TS/tree/main/translation
+[9]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Base.ts#L12-L24
+[10]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/models/Repository.ts
+[11]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/pages/pagination.tsx
+[12]: https://next-bootstrap-ts.vercel.app/pagination/
+[13]: https://next-bootstrap-ts.vercel.app/scroll-list/
+[14]: https://github.com/idea2app/Next-Bootstrap-TS/blob/main/pages/scroll-list.tsx

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mobx-restful-table",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "license": "LGPL-3.0",
   "author": "shiy2008@gmail.com",
   "description": "A Pagination Table & Scroll List component suite for CRUD operation, which is based on MobX RESTful & React.",
@@ -26,37 +26,37 @@
   "module": "dist/index.esm.js",
   "main": "dist/index.js",
   "dependencies": {
-    "@swc/helpers": "^0.4.14",
+    "@swc/helpers": "^0.5.1",
     "classnames": "^2.3.2",
     "lodash": "^4.17.21",
-    "react-bootstrap": "^2.7.4",
-    "regenerator-runtime": "^0.13.11",
-    "web-utility": "^4.0.0"
+    "react-bootstrap": "^2.8.0",
+    "regenerator-runtime": "^0.14.0",
+    "web-utility": "^4.1.0"
   },
   "peerDependencies": {
-    "mobx": ">=4 <6",
-    "mobx-i18n": "^0.3",
-    "mobx-react": "^6",
+    "mobx": ">=4",
+    "mobx-i18n": "^0.4.0-rc.0",
+    "mobx-react": ">=6",
     "mobx-restful": "^0.6",
     "react": ">=16.8"
   },
   "devDependencies": {
-    "@parcel/packager-ts": "~2.8.3",
-    "@parcel/transformer-typescript-types": "~2.8.3",
-    "@types/lodash": "^4.14.195",
-    "@types/react": "^17.0.60",
+    "@parcel/packager-ts": "~2.9.3",
+    "@parcel/transformer-typescript-types": "~2.9.3",
+    "@types/lodash": "^4.14.197",
+    "@types/react": "^18.2.20",
     "husky": "^8.0.3",
-    "lint-staged": "^13.2.2",
-    "mobx": "^5.15.7",
-    "mobx-i18n": "^0.3.15",
-    "mobx-react": "^6.3.1",
-    "mobx-restful": "^0.6.5",
-    "parcel": "~2.8.3",
-    "prettier": "^2.8.8",
-    "react": "^17.0.2",
+    "lint-staged": "^14.0.1",
+    "mobx": "^6.10.0",
+    "mobx-i18n": "^0.4.0-rc.0",
+    "mobx-react": "^9.0.0",
+    "mobx-restful": "^0.6.6",
+    "parcel": "~2.9.3",
+    "prettier": "^3.0.2",
+    "react": "^18.2.0",
     "typedoc": "^0.24.8",
     "typedoc-plugin-mdn-links": "^3.0.3",
-    "typescript": "~5.1.3"
+    "typescript": "~5.1.6"
   },
   "prettier": {
     "singleQuote": true,