From fb671cd62adf3d8f371b38859a5b4ec792bac3fc Mon Sep 17 00:00:00 2001 From: mattuy Date: Mon, 27 Sep 2021 00:40:21 +0800 Subject: [PATCH] daily: 2021-09-26 --- package-lock.json | 1440 +++++++++++++++++ package.json | 3 + public/index.html | 55 +- src/App.js | 24 +- src/component/EditableContent/index.js | 109 ++ .../EditableContent/index.module.css | 21 + src/component/PopoverOnSvg/index.js | 275 ++++ src/component/PopoverOnSvg/index.module.css | 55 + src/index.js | 13 +- src/store/global.js | 17 + src/util/html-escape.js | 6 + src/view/Canvas/index.js | 19 + src/view/Canvas/index.module.css | 7 + src/view/Editor/index.js | 13 + src/view/Editor/index.module.css | 7 + src/view/Header/LeftInfoBlock/index.js | 110 ++ src/view/Header/RightInfoBlock/index.js | 52 + src/view/Header/Title/index.js | 34 + src/view/Header/index.js | 16 + src/view/Notation/index.js | 10 + src/view/Row/index.js | 28 + src/view/Text/index.js | 45 + 22 files changed, 2295 insertions(+), 64 deletions(-) create mode 100644 src/component/EditableContent/index.js create mode 100644 src/component/EditableContent/index.module.css create mode 100644 src/component/PopoverOnSvg/index.js create mode 100644 src/component/PopoverOnSvg/index.module.css create mode 100644 src/store/global.js create mode 100644 src/util/html-escape.js create mode 100644 src/view/Canvas/index.js create mode 100644 src/view/Canvas/index.module.css create mode 100644 src/view/Editor/index.js create mode 100644 src/view/Editor/index.module.css create mode 100644 src/view/Header/LeftInfoBlock/index.js create mode 100644 src/view/Header/RightInfoBlock/index.js create mode 100644 src/view/Header/Title/index.js create mode 100644 src/view/Header/index.js create mode 100644 src/view/Notation/index.js create mode 100644 src/view/Row/index.js create mode 100644 src/view/Text/index.js diff --git a/package-lock.json b/package-lock.json index 5b1186d..98b3245 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,12 +11,62 @@ "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^11.2.7", "@testing-library/user-event": "^12.8.3", + "antd": "^4.16.13", + "mobx": "^6.3.3", + "mobx-react-lite": "^3.2.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-scripts": "4.0.3", "web-vitals": "^1.1.2" } }, + "node_modules/@ant-design/colors": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@ant-design/colors/-/colors-6.0.0.tgz", + "integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==", + "dependencies": { + "@ctrl/tinycolor": "^3.4.0" + } + }, + "node_modules/@ant-design/icons": { + "version": "4.6.4", + "resolved": "https://registry.npmjs.org/@ant-design/icons/-/icons-4.6.4.tgz", + "integrity": "sha512-li02J8ym721E24N3bw1oXRzFDV7m2MYQWs+WtJgVVjhNRv4sc6vL2a2M7SS8rWX3Uc/3GJfrokIJnMrmbIMuXQ==", + "dependencies": { + "@ant-design/colors": "^6.0.0", + "@ant-design/icons-svg": "^4.0.0", + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-util": "^5.9.4" + }, + "engines": { + "node": ">=8" + }, + "peerDependencies": { + "react": ">=16.0.0", + "react-dom": ">=16.0.0" + } + }, + "node_modules/@ant-design/icons-svg": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@ant-design/icons-svg/-/icons-svg-4.1.0.tgz", + "integrity": "sha512-Fi03PfuUqRs76aI3UWYpP864lkrfPo0hluwGqh7NJdLhvH4iRDc3jbJqZIvRDLHKbXrvAfPPV3+zjUccfFvWOQ==" + }, + "node_modules/@ant-design/react-slick": { + "version": "0.28.4", + "resolved": "https://registry.npmjs.org/@ant-design/react-slick/-/react-slick-0.28.4.tgz", + "integrity": "sha512-j9eAHTn7GxbXUFNknJoHS2ceAsqrQi2j8XykjZE1IXCD8kJF+t28EvhBLniDpbOsBk/3kjalnhriTfZcjBHNqg==", + "dependencies": { + "@babel/runtime": "^7.10.4", + "classnames": "^2.2.5", + "json2mq": "^0.2.0", + "lodash": "^4.17.21", + "resize-observer-polyfill": "^1.5.0" + }, + "peerDependencies": { + "react": ">=16.9.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.14.5", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.14.5.tgz", @@ -1763,6 +1813,14 @@ "resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-10.1.0.tgz", "integrity": "sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg==" }, + "node_modules/@ctrl/tinycolor": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.0.tgz", + "integrity": "sha512-JZButFdZ1+/xAfpguQHoabIXkcqRRKpMrWKBkpEZZyxfY9C1DpADFB8PEqGSTeFr135SaTRfKqGKx5xSCLI7ZQ==", + "engines": { + "node": ">=10" + } + }, "node_modules/@eslint/eslintrc": { "version": "0.4.3", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.3.tgz", @@ -4325,6 +4383,73 @@ "node": ">=4" } }, + "node_modules/antd": { + "version": "4.16.13", + "resolved": "https://registry.npmjs.org/antd/-/antd-4.16.13.tgz", + "integrity": "sha512-EMPD3fzKe7oayx9keD/GA1oKatcx7j5CGlkJj5eLS0/eEDDEkxVj3DFmKOPuHYt4BK7ltTzMFS+quSTmqUXPiw==", + "dependencies": { + "@ant-design/colors": "^6.0.0", + "@ant-design/icons": "^4.6.3", + "@ant-design/react-slick": "~0.28.1", + "@babel/runtime": "^7.12.5", + "array-tree-filter": "^2.1.0", + "classnames": "^2.2.6", + "copy-to-clipboard": "^3.2.0", + "lodash": "^4.17.21", + "moment": "^2.25.3", + "rc-cascader": "~1.4.0", + "rc-checkbox": "~2.3.0", + "rc-collapse": "~3.1.0", + "rc-dialog": "~8.6.0", + "rc-drawer": "~4.3.0", + "rc-dropdown": "~3.2.0", + "rc-field-form": "~1.20.0", + "rc-image": "~5.2.5", + "rc-input-number": "~7.1.0", + "rc-mentions": "~1.6.1", + "rc-menu": "~9.0.12", + "rc-motion": "^2.4.0", + "rc-notification": "~4.5.7", + "rc-pagination": "~3.1.9", + "rc-picker": "~2.5.10", + "rc-progress": "~3.1.0", + "rc-rate": "~2.9.0", + "rc-resize-observer": "^1.0.0", + "rc-select": "~12.1.6", + "rc-slider": "~9.7.1", + "rc-steps": "~4.1.0", + "rc-switch": "~3.2.0", + "rc-table": "~7.15.1", + "rc-tabs": "~11.10.0", + "rc-textarea": "~0.3.0", + "rc-tooltip": "~5.1.1", + "rc-tree": "~4.2.1", + "rc-tree-select": "~4.3.0", + "rc-trigger": "^5.2.10", + "rc-upload": "~4.3.0", + "rc-util": "^5.13.1", + "scroll-into-view-if-needed": "^2.2.25" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/ant-design" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/antd/node_modules/@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "dependencies": { + "regenerator-runtime": "^0.13.4" + }, + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/anymatch": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", @@ -4414,6 +4539,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/array-tree-filter": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz", + "integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw==" + }, "node_modules/array-union": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz", @@ -4561,6 +4691,11 @@ "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz", "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==" }, + "node_modules/async-validator": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-3.5.2.tgz", + "integrity": "sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==" + }, "node_modules/asynckit": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", @@ -5939,6 +6074,11 @@ "node": ">=0.10.0" } }, + "node_modules/classnames": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz", + "integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==" + }, "node_modules/clean-css": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", @@ -6137,6 +6277,11 @@ "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" }, + "node_modules/compute-scroll-into-view": { + "version": "1.0.17", + "resolved": "https://registry.npmjs.org/compute-scroll-into-view/-/compute-scroll-into-view-1.0.17.tgz", + "integrity": "sha512-j4dx+Fb0URmzbwwMUrhqWM2BEWHdFGx+qZ9qqASHRPqvTYdqvWnHg0H1hIbcyLnvgnoNAVMlwkepyqM3DaIFUg==" + }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -6251,6 +6396,14 @@ "node": ">=0.10.0" } }, + "node_modules/copy-to-clipboard": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.1.tgz", + "integrity": "sha512-i13qo6kIHTTpCm8/Wup+0b1mVWETvu2kIMzKoK8FpkLkFxlt0znUAHcMzox+T8sPlqtZXq3CulEjQHsYiGFJUw==", + "dependencies": { + "toggle-selection": "^1.0.6" + } + }, "node_modules/core-js": { "version": "3.18.0", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.18.0.tgz", @@ -6824,6 +6977,23 @@ "node": ">=10" } }, + "node_modules/date-fns": { + "version": "2.24.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.24.0.tgz", + "integrity": "sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw==", + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } + }, + "node_modules/dayjs": { + "version": "1.10.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz", + "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig==" + }, "node_modules/debug": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz", @@ -7252,6 +7422,11 @@ "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.7.tgz", "integrity": "sha512-ml3lJIq9YjUfM9TUnEPvEYWFSwivwIGBPKpewX7tii7fwCazA8yCioGdqQcNsItPpfFvSJ3VIdMQPj60LJhcQA==" }, + "node_modules/dom-align": { + "version": "1.12.2", + "resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.12.2.tgz", + "integrity": "sha512-pHuazgqrsTFrGU2WLDdXxCFabkdQDx72ddkraZNih1KsMcN5qsRSTR9O4VJRlwTPCPb5COYg3LOfiMHHcPInHg==" + }, "node_modules/dom-converter": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz", @@ -13018,6 +13193,14 @@ "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz", "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=" }, + "node_modules/json2mq": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/json2mq/-/json2mq-0.2.0.tgz", + "integrity": "sha1-tje9O6nqvhIsg+lyBIOusQ0skEo=", + "dependencies": { + "string-convert": "^0.2.0" + } + }, "node_modules/json3": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.3.tgz", @@ -13693,6 +13876,44 @@ "mkdirp": "bin/cmd.js" } }, + "node_modules/mobx": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-6.3.3.tgz", + "integrity": "sha512-JoNU50rO6d1wHwKPJqKq4rmUMbYnI9CsJmBo+Cu4exBYenFvIN77LWrZENpzW6reZPADtXMmB1DicbDSfy8Clw==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mobx" + } + }, + "node_modules/mobx-react-lite": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/mobx-react-lite/-/mobx-react-lite-3.2.1.tgz", + "integrity": "sha512-hwURgfmP2apX3HQrB55V9DN47kuN3C6KlQvI5UIfJRibXma72C/JudcNt2r9dWjAdFMrcZoz1ivvtXMCkJ2aQA==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mobx" + }, + "peerDependencies": { + "mobx": "^6.1.0", + "react": "^16.8.0 || ^17" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + }, + "react-native": { + "optional": true + } + } + }, + "node_modules/moment": { + "version": "2.29.1", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz", + "integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==", + "engines": { + "node": "*" + } + }, "node_modules/move-concurrently": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz", @@ -16353,6 +16574,583 @@ "node": ">= 0.8" } }, + "node_modules/rc-align": { + "version": "4.0.11", + "resolved": "https://registry.npmjs.org/rc-align/-/rc-align-4.0.11.tgz", + "integrity": "sha512-n9mQfIYQbbNTbefyQnRHZPWuTEwG1rY4a9yKlIWHSTbgwI+XUMGRYd0uJ5pE2UbrNX0WvnMBA1zJ3Lrecpra/A==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "dom-align": "^1.7.0", + "lodash": "^4.17.21", + "rc-util": "^5.3.0", + "resize-observer-polyfill": "^1.5.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-cascader": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/rc-cascader/-/rc-cascader-1.4.3.tgz", + "integrity": "sha512-Q4l9Mv8aaISJ+giVnM9IaXxDeMqHUGLvi4F+LksS6pHlaKlN4awop/L+IMjIXpL+ug/ojaCyv/ixcVopJYYCVA==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "array-tree-filter": "^2.1.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.0.1", + "warning": "^4.0.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-cascader/node_modules/@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "dependencies": { + "regenerator-runtime": "^0.13.4" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/rc-checkbox": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/rc-checkbox/-/rc-checkbox-2.3.2.tgz", + "integrity": "sha512-afVi1FYiGv1U0JlpNH/UaEXdh6WUJjcWokj/nUN2TgG80bfG+MDdbfHKlLcNNba94mbjy2/SXJ1HDgrOkXGAjg==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-collapse": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/rc-collapse/-/rc-collapse-3.1.2.tgz", + "integrity": "sha512-HujcKq7mghk/gVKeI6EjzTbb8e19XUZpakrYazu1MblEZ3Hu3WBMSN4A3QmvbF6n1g7x6lUlZvsHZ5shABWYOQ==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.3.4", + "rc-util": "^5.2.1", + "shallowequal": "^1.1.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-dialog": { + "version": "8.6.0", + "resolved": "https://registry.npmjs.org/rc-dialog/-/rc-dialog-8.6.0.tgz", + "integrity": "sha512-GSbkfqjqxpZC5/zc+8H332+q5l/DKUhpQr0vdX2uDsxo5K0PhvaMEVjyoJUTkZ3+JstEADQji1PVLVb/2bJeOQ==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-motion": "^2.3.0", + "rc-util": "^5.6.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-drawer": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/rc-drawer/-/rc-drawer-4.3.1.tgz", + "integrity": "sha512-GMfFy4maqxS9faYXEhQ+0cA1xtkddEQzraf6SAdzWbn444DrrLogwYPk1NXSpdXjLCLxgxOj9MYtyYG42JsfXg==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-util": "^5.7.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-dropdown": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/rc-dropdown/-/rc-dropdown-3.2.0.tgz", + "integrity": "sha512-j1HSw+/QqlhxyTEF6BArVZnTmezw2LnSmRk6I9W7BCqNCKaRwleRmMMs1PHbuaG8dKHVqP6e21RQ7vPBLVnnNw==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-trigger": "^5.0.4" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, + "node_modules/rc-field-form": { + "version": "1.20.1", + "resolved": "https://registry.npmjs.org/rc-field-form/-/rc-field-form-1.20.1.tgz", + "integrity": "sha512-f64KEZop7zSlrG4ef/PLlH12SLn6iHDQ3sTG+RfKBM45hikwV1i8qMf53xoX12NvXXWg1VwchggX/FSso4bWaA==", + "dependencies": { + "@babel/runtime": "^7.8.4", + "async-validator": "^3.0.3", + "rc-util": "^5.8.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">= 16.9.0", + "react-dom": ">= 16.9.0" + } + }, + "node_modules/rc-image": { + "version": "5.2.5", + "resolved": "https://registry.npmjs.org/rc-image/-/rc-image-5.2.5.tgz", + "integrity": "sha512-qUfZjYIODxO0c8a8P5GeuclYXZjzW4hV/5hyo27XqSFo1DmTCs2HkVeQObkcIk5kNsJtgsj1KoPThVsSc/PXOw==", + "dependencies": { + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-dialog": "~8.6.0", + "rc-util": "^5.0.6" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-input-number": { + "version": "7.1.4", + "resolved": "https://registry.npmjs.org/rc-input-number/-/rc-input-number-7.1.4.tgz", + "integrity": "sha512-EG4iqkqyqzLRu/Dq+fw2od7nlgvXLEatE+J6uhi3HXE1qlM3C7L6a7o/hL9Ly9nimkES2IeQoj3Qda3I0izj3Q==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.9.8" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-mentions": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/rc-mentions/-/rc-mentions-1.6.1.tgz", + "integrity": "sha512-LDzGI8jJVGnkhpTZxZuYBhMz3avcZZqPGejikchh97xPni/g4ht714Flh7DVvuzHQ+BoKHhIjobHnw1rcP8erg==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-menu": "^9.0.0", + "rc-textarea": "^0.3.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.0.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-menu": { + "version": "9.0.12", + "resolved": "https://registry.npmjs.org/rc-menu/-/rc-menu-9.0.12.tgz", + "integrity": "sha512-8uy47DL36iDEwVZdUO/fjhhW5+4j0tYlrCsOzw6iy8MJqKL7/HC2pj7sL/S9ayp2+hk9fYQYB9Tu+UN+N2OOOQ==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.4.3", + "rc-overflow": "^1.2.0", + "rc-trigger": "^5.1.2", + "rc-util": "^5.12.0", + "shallowequal": "^1.1.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-motion": { + "version": "2.4.4", + "resolved": "https://registry.npmjs.org/rc-motion/-/rc-motion-2.4.4.tgz", + "integrity": "sha512-ms7n1+/TZQBS0Ydd2Q5P4+wJTSOrhIrwNxLXCZpR7Fa3/oac7Yi803HDALc2hLAKaCTQtw9LmQeB58zcwOsqlQ==", + "dependencies": { + "@babel/runtime": "^7.11.1", + "classnames": "^2.2.1", + "rc-util": "^5.2.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-notification": { + "version": "4.5.7", + "resolved": "https://registry.npmjs.org/rc-notification/-/rc-notification-4.5.7.tgz", + "integrity": "sha512-zhTGUjBIItbx96SiRu3KVURcLOydLUHZCPpYEn1zvh+re//Tnq/wSxN4FKgp38n4HOgHSVxcLEeSxBMTeBBDdw==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.2.0", + "rc-util": "^5.0.1" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-overflow": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/rc-overflow/-/rc-overflow-1.2.2.tgz", + "integrity": "sha512-X5kj9LDU1ue5wHkqvCprJWLKC+ZLs3p4He/oxjZ1Q4NKaqKBaYf5OdSzRSgh3WH8kSdrfU8LjvlbWnHgJOEkNQ==", + "dependencies": { + "@babel/runtime": "^7.11.1", + "classnames": "^2.2.1", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.5.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-pagination": { + "version": "3.1.9", + "resolved": "https://registry.npmjs.org/rc-pagination/-/rc-pagination-3.1.9.tgz", + "integrity": "sha512-IKBKaJ4icVPeEk9qRHrFBJmHxBUrCp3+nENBYob4Ofqsu3RXjBOy4N36zONO7oubgLyiG3PxVmyAuVlTkoc7Jg==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-picker": { + "version": "2.5.18", + "resolved": "https://registry.npmjs.org/rc-picker/-/rc-picker-2.5.18.tgz", + "integrity": "sha512-XyieTl8GOC5TeQFEvYbjx/Mtc0/CjruS7mKFT6Fy65FbGXmoFsWoWvIi+ylFx/BQHPGQi7a7vCNoZJ2TTqcZoA==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "date-fns": "2.x", + "dayjs": "1.x", + "moment": "^2.24.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.4.0", + "shallowequal": "^1.1.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-progress": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/rc-progress/-/rc-progress-3.1.4.tgz", + "integrity": "sha512-XBAif08eunHssGeIdxMXOmRQRULdHaDdIFENQ578CMb4dyewahmmfJRyab+hw4KH4XssEzzYOkAInTLS7JJG+Q==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-rate": { + "version": "2.9.1", + "resolved": "https://registry.npmjs.org/rc-rate/-/rc-rate-2.9.1.tgz", + "integrity": "sha512-MmIU7FT8W4LYRRHJD1sgG366qKtSaKb67D0/vVvJYR0lrCuRrCiVQ5qhfT5ghVO4wuVIORGpZs7ZKaYu+KMUzA==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.0.1" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-resize-observer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/rc-resize-observer/-/rc-resize-observer-1.0.1.tgz", + "integrity": "sha512-OxO2mJI9e8610CAWBFfm52SPvWib0eNKjaSsRbbKHmLaJIxw944P+D61DlLJ/w2vuOjGNcalJu8VdqyNm/XCRg==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-util": "^5.0.0", + "resize-observer-polyfill": "^1.5.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-select": { + "version": "12.1.13", + "resolved": "https://registry.npmjs.org/rc-select/-/rc-select-12.1.13.tgz", + "integrity": "sha512-cPI+aesP6dgCAaey4t4upDbEukJe+XN0DK6oO/6flcCX5o28o7KNZD7JAiVtC/6fCwqwI/kSs7S/43dvHmBl+A==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.0.1", + "rc-overflow": "^1.0.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.9.8", + "rc-virtual-list": "^3.2.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, + "node_modules/rc-slider": { + "version": "9.7.2", + "resolved": "https://registry.npmjs.org/rc-slider/-/rc-slider-9.7.2.tgz", + "integrity": "sha512-mVaLRpDo6otasBs6yVnG02ykI3K6hIrLTNfT5eyaqduFv95UODI9PDS6fWuVVehVpdS4ENgOSwsTjrPVun+k9g==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-tooltip": "^5.0.1", + "rc-util": "^5.0.0", + "shallowequal": "^1.1.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-steps": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/rc-steps/-/rc-steps-4.1.3.tgz", + "integrity": "sha512-GXrMfWQOhN3sVze3JnzNboHpQdNHcdFubOETUHyDpa/U3HEKBZC3xJ8XK4paBgF4OJ3bdUVLC+uBPc6dCxvDYA==", + "dependencies": { + "@babel/runtime": "^7.10.2", + "classnames": "^2.2.3", + "rc-util": "^5.0.1" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-switch": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/rc-switch/-/rc-switch-3.2.2.tgz", + "integrity": "sha512-+gUJClsZZzvAHGy1vZfnwySxj+MjLlGRyXKXScrtCTcmiYNPzxDFOxdQ/3pK1Kt/0POvwJ/6ALOR8gwdXGhs+A==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-util": "^5.0.1" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-table": { + "version": "7.15.2", + "resolved": "https://registry.npmjs.org/rc-table/-/rc-table-7.15.2.tgz", + "integrity": "sha512-TAs7kCpIZwc2mtvD8CMrXSM6TqJDUsy0rUEV1YgRru33T8bjtAtc+9xW/KC1VWROJlHSpU0R0kXjFs9h/6+IzQ==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.13.0", + "shallowequal": "^1.1.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-tabs": { + "version": "11.10.1", + "resolved": "https://registry.npmjs.org/rc-tabs/-/rc-tabs-11.10.1.tgz", + "integrity": "sha512-ey1i2uMyfnRNYbViLcUYGH+Y7hueJbdCVSLaXnXki9hxBcGqxJMPy9t5xR0n/3QFQspj7Tf6+2VTXVtmO7Yaug==", + "dependencies": { + "@babel/runtime": "^7.11.2", + "classnames": "2.x", + "rc-dropdown": "^3.2.0", + "rc-menu": "^9.0.0", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.5.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-textarea": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/rc-textarea/-/rc-textarea-0.3.5.tgz", + "integrity": "sha512-qa+k5vDn9ct65qr+SgD2KwJ9Xz6P84lG2z+TDht/RBr71WnM/K61PqHUAcUyU6YqTJD26IXgjPuuhZR7HMw7eA==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.7.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-tooltip": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/rc-tooltip/-/rc-tooltip-5.1.1.tgz", + "integrity": "sha512-alt8eGMJulio6+4/uDm7nvV+rJq9bsfxFDCI0ljPdbuoygUscbsMYb6EQgwib/uqsXQUvzk+S7A59uYHmEgmDA==", + "dependencies": { + "@babel/runtime": "^7.11.2", + "rc-trigger": "^5.0.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-tree": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/rc-tree/-/rc-tree-4.2.2.tgz", + "integrity": "sha512-V1hkJt092VrOVjNyfj5IYbZKRMHxWihZarvA5hPL/eqm7o2+0SNkeidFYm7LVVBrAKBpOpa0l8xt04uiqOd+6w==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.0.1", + "rc-util": "^5.0.0", + "rc-virtual-list": "^3.0.1" + }, + "engines": { + "node": ">=10.x" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, + "node_modules/rc-tree-select": { + "version": "4.3.3", + "resolved": "https://registry.npmjs.org/rc-tree-select/-/rc-tree-select-4.3.3.tgz", + "integrity": "sha512-0tilOHLJA6p+TNg4kD559XnDX3PTEYuoSF7m7ryzFLAYvdEEPtjn0QZc5z6L0sMKBiBlj8a2kf0auw8XyHU3lA==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-select": "^12.0.0", + "rc-tree": "^4.0.0", + "rc-util": "^5.0.5" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, + "node_modules/rc-trigger": { + "version": "5.2.10", + "resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-5.2.10.tgz", + "integrity": "sha512-FkUf4H9BOFDaIwu42fvRycXMAvkttph9AlbCZXssZDVzz2L+QZ0ERvfB/4nX3ZFPh1Zd+uVGr1DEDeXxq4J1TA==", + "dependencies": { + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-align": "^4.0.0", + "rc-motion": "^2.0.0", + "rc-util": "^5.5.0" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-upload": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/rc-upload/-/rc-upload-4.3.1.tgz", + "integrity": "sha512-W8Iyv0LRyEnFEzpv90ET/i1XG2jlPzPxKkkOVtDfgh9c3f4lZV770vgpUfiyQza+iLtQLVco3qIvgue8aDiOsQ==", + "dependencies": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.2.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-util": { + "version": "5.14.0", + "resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.14.0.tgz", + "integrity": "sha512-2vy6/Z1BJUcwLjm/UEJb/htjUTQPigITUIemCcFEo1fQevAumc9sA32x2z5qyWoa9uhrXbiAjSDpPIUqyg65sA==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "react-is": "^16.12.0", + "shallowequal": "^1.1.0" + }, + "peerDependencies": { + "react": ">=16.9.0", + "react-dom": ">=16.9.0" + } + }, + "node_modules/rc-util/node_modules/@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "dependencies": { + "regenerator-runtime": "^0.13.4" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/rc-util/node_modules/react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + }, + "node_modules/rc-virtual-list": { + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/rc-virtual-list/-/rc-virtual-list-3.4.1.tgz", + "integrity": "sha512-YexJy+Cx8qjnQdV8+0JBeM65VF2kvO9lnsfrIvHsL3lIH1adMZ85HqmePGUzKkKMZC+CRAJc2K4g2iJS1dOjPw==", + "dependencies": { + "classnames": "^2.2.6", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.0.7" + }, + "engines": { + "node": ">=8.x" + }, + "peerDependencies": { + "react": "*", + "react-dom": "*" + } + }, "node_modules/react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", @@ -17044,6 +17842,11 @@ "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz", "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=" }, + "node_modules/resize-observer-polyfill": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz", + "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==" + }, "node_modules/resolve": { "version": "1.18.1", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.18.1.tgz", @@ -17748,6 +18551,14 @@ "url": "https://opencollective.com/webpack" } }, + "node_modules/scroll-into-view-if-needed": { + "version": "2.2.28", + "resolved": "https://registry.npmjs.org/scroll-into-view-if-needed/-/scroll-into-view-if-needed-2.2.28.tgz", + "integrity": "sha512-8LuxJSuFVc92+0AdNv4QOxRL4Abeo1DgLnGNkn1XlaujPH/3cCFz3QI60r2VNu4obJJROzgnIUw5TKQkZvZI1w==", + "dependencies": { + "compute-scroll-into-view": "^1.0.17" + } + }, "node_modules/select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", @@ -17949,6 +18760,11 @@ "sha.js": "bin.js" } }, + "node_modules/shallowequal": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -18643,6 +19459,11 @@ } ] }, + "node_modules/string-convert": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/string-convert/-/string-convert-0.2.1.tgz", + "integrity": "sha1-aYLMMEn7tM2F+LJFaLnZvznu/5c=" + }, "node_modules/string-length": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz", @@ -19383,6 +20204,11 @@ "node": ">=8.0" } }, + "node_modules/toggle-selection": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz", + "integrity": "sha1-bkWxJj8gF/oKzH2J14sVuL932jI=" + }, "node_modules/toidentifier": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", @@ -19986,6 +20812,14 @@ "makeerror": "1.0.x" } }, + "node_modules/warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "dependencies": { + "loose-envify": "^1.0.0" + } + }, "node_modules/watchpack": { "version": "1.7.5", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", @@ -21815,6 +22649,43 @@ } }, "dependencies": { + "@ant-design/colors": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/@ant-design/colors/-/colors-6.0.0.tgz", + "integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==", + "requires": { + "@ctrl/tinycolor": "^3.4.0" + } + }, + "@ant-design/icons": { + "version": "4.6.4", + "resolved": "https://registry.npmjs.org/@ant-design/icons/-/icons-4.6.4.tgz", + "integrity": "sha512-li02J8ym721E24N3bw1oXRzFDV7m2MYQWs+WtJgVVjhNRv4sc6vL2a2M7SS8rWX3Uc/3GJfrokIJnMrmbIMuXQ==", + "requires": { + "@ant-design/colors": "^6.0.0", + "@ant-design/icons-svg": "^4.0.0", + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-util": "^5.9.4" + } + }, + "@ant-design/icons-svg": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/@ant-design/icons-svg/-/icons-svg-4.1.0.tgz", + "integrity": "sha512-Fi03PfuUqRs76aI3UWYpP864lkrfPo0hluwGqh7NJdLhvH4iRDc3jbJqZIvRDLHKbXrvAfPPV3+zjUccfFvWOQ==" + }, + "@ant-design/react-slick": { + "version": "0.28.4", + "resolved": "https://registry.npmjs.org/@ant-design/react-slick/-/react-slick-0.28.4.tgz", + "integrity": "sha512-j9eAHTn7GxbXUFNknJoHS2ceAsqrQi2j8XykjZE1IXCD8kJF+t28EvhBLniDpbOsBk/3kjalnhriTfZcjBHNqg==", + "requires": { + "@babel/runtime": "^7.10.4", + "classnames": "^2.2.5", + "json2mq": "^0.2.0", + "lodash": "^4.17.21", + "resize-observer-polyfill": "^1.5.0" + } + }, "@babel/code-frame": { "version": "7.14.5", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.14.5.tgz", @@ -22997,6 +23868,11 @@ "resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-10.1.0.tgz", "integrity": "sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg==" }, + "@ctrl/tinycolor": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.0.tgz", + "integrity": "sha512-JZButFdZ1+/xAfpguQHoabIXkcqRRKpMrWKBkpEZZyxfY9C1DpADFB8PEqGSTeFr135SaTRfKqGKx5xSCLI7ZQ==" + }, "@eslint/eslintrc": { "version": "0.4.3", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.3.tgz", @@ -24917,6 +25793,64 @@ "color-convert": "^1.9.0" } }, + "antd": { + "version": "4.16.13", + "resolved": "https://registry.npmjs.org/antd/-/antd-4.16.13.tgz", + "integrity": "sha512-EMPD3fzKe7oayx9keD/GA1oKatcx7j5CGlkJj5eLS0/eEDDEkxVj3DFmKOPuHYt4BK7ltTzMFS+quSTmqUXPiw==", + "requires": { + "@ant-design/colors": "^6.0.0", + "@ant-design/icons": "^4.6.3", + "@ant-design/react-slick": "~0.28.1", + "@babel/runtime": "^7.12.5", + "array-tree-filter": "^2.1.0", + "classnames": "^2.2.6", + "copy-to-clipboard": "^3.2.0", + "lodash": "^4.17.21", + "moment": "^2.25.3", + "rc-cascader": "~1.4.0", + "rc-checkbox": "~2.3.0", + "rc-collapse": "~3.1.0", + "rc-dialog": "~8.6.0", + "rc-drawer": "~4.3.0", + "rc-dropdown": "~3.2.0", + "rc-field-form": "~1.20.0", + "rc-image": "~5.2.5", + "rc-input-number": "~7.1.0", + "rc-mentions": "~1.6.1", + "rc-menu": "~9.0.12", + "rc-motion": "^2.4.0", + "rc-notification": "~4.5.7", + "rc-pagination": "~3.1.9", + "rc-picker": "~2.5.10", + "rc-progress": "~3.1.0", + "rc-rate": "~2.9.0", + "rc-resize-observer": "^1.0.0", + "rc-select": "~12.1.6", + "rc-slider": "~9.7.1", + "rc-steps": "~4.1.0", + "rc-switch": "~3.2.0", + "rc-table": "~7.15.1", + "rc-tabs": "~11.10.0", + "rc-textarea": "~0.3.0", + "rc-tooltip": "~5.1.1", + "rc-tree": "~4.2.1", + "rc-tree-select": "~4.3.0", + "rc-trigger": "^5.2.10", + "rc-upload": "~4.3.0", + "rc-util": "^5.13.1", + "scroll-into-view-if-needed": "^2.2.25" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "requires": { + "regenerator-runtime": "^0.13.4" + } + } + } + }, "anymatch": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", @@ -24985,6 +25919,11 @@ "is-string": "^1.0.5" } }, + "array-tree-filter": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/array-tree-filter/-/array-tree-filter-2.1.0.tgz", + "integrity": "sha512-4ROwICNlNw/Hqa9v+rk5h22KjmzB1JGTMVKP2AKJBOCgb0yL0ASf0+YvCcLNNwquOHNX48jkeZIJ3a+oOQqKcw==" + }, "array-union": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz", @@ -25106,6 +26045,11 @@ "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz", "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==" }, + "async-validator": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-3.5.2.tgz", + "integrity": "sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==" + }, "asynckit": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", @@ -26206,6 +27150,11 @@ } } }, + "classnames": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz", + "integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==" + }, "clean-css": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", @@ -26374,6 +27323,11 @@ } } }, + "compute-scroll-into-view": { + "version": "1.0.17", + "resolved": "https://registry.npmjs.org/compute-scroll-into-view/-/compute-scroll-into-view-1.0.17.tgz", + "integrity": "sha512-j4dx+Fb0URmzbwwMUrhqWM2BEWHdFGx+qZ9qqASHRPqvTYdqvWnHg0H1hIbcyLnvgnoNAVMlwkepyqM3DaIFUg==" + }, "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -26469,6 +27423,14 @@ "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz", "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40=" }, + "copy-to-clipboard": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.1.tgz", + "integrity": "sha512-i13qo6kIHTTpCm8/Wup+0b1mVWETvu2kIMzKoK8FpkLkFxlt0znUAHcMzox+T8sPlqtZXq3CulEjQHsYiGFJUw==", + "requires": { + "toggle-selection": "^1.0.6" + } + }, "core-js": { "version": "3.18.0", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.18.0.tgz", @@ -26917,6 +27879,16 @@ "whatwg-url": "^8.0.0" } }, + "date-fns": { + "version": "2.24.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.24.0.tgz", + "integrity": "sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw==" + }, + "dayjs": { + "version": "1.10.7", + "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz", + "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig==" + }, "debug": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.2.tgz", @@ -27253,6 +28225,11 @@ "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.7.tgz", "integrity": "sha512-ml3lJIq9YjUfM9TUnEPvEYWFSwivwIGBPKpewX7tii7fwCazA8yCioGdqQcNsItPpfFvSJ3VIdMQPj60LJhcQA==" }, + "dom-align": { + "version": "1.12.2", + "resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.12.2.tgz", + "integrity": "sha512-pHuazgqrsTFrGU2WLDdXxCFabkdQDx72ddkraZNih1KsMcN5qsRSTR9O4VJRlwTPCPb5COYg3LOfiMHHcPInHg==" + }, "dom-converter": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz", @@ -31535,6 +32512,14 @@ "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz", "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=" }, + "json2mq": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/json2mq/-/json2mq-0.2.0.tgz", + "integrity": "sha1-tje9O6nqvhIsg+lyBIOusQ0skEo=", + "requires": { + "string-convert": "^0.2.0" + } + }, "json3": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.3.tgz", @@ -32064,6 +33049,22 @@ "minimist": "^1.2.5" } }, + "mobx": { + "version": "6.3.3", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-6.3.3.tgz", + "integrity": "sha512-JoNU50rO6d1wHwKPJqKq4rmUMbYnI9CsJmBo+Cu4exBYenFvIN77LWrZENpzW6reZPADtXMmB1DicbDSfy8Clw==" + }, + "mobx-react-lite": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/mobx-react-lite/-/mobx-react-lite-3.2.1.tgz", + "integrity": "sha512-hwURgfmP2apX3HQrB55V9DN47kuN3C6KlQvI5UIfJRibXma72C/JudcNt2r9dWjAdFMrcZoz1ivvtXMCkJ2aQA==", + "requires": {} + }, + "moment": { + "version": "2.29.1", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz", + "integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==" + }, "move-concurrently": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz", @@ -34187,6 +35188,409 @@ } } }, + "rc-align": { + "version": "4.0.11", + "resolved": "https://registry.npmjs.org/rc-align/-/rc-align-4.0.11.tgz", + "integrity": "sha512-n9mQfIYQbbNTbefyQnRHZPWuTEwG1rY4a9yKlIWHSTbgwI+XUMGRYd0uJ5pE2UbrNX0WvnMBA1zJ3Lrecpra/A==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "dom-align": "^1.7.0", + "lodash": "^4.17.21", + "rc-util": "^5.3.0", + "resize-observer-polyfill": "^1.5.1" + } + }, + "rc-cascader": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/rc-cascader/-/rc-cascader-1.4.3.tgz", + "integrity": "sha512-Q4l9Mv8aaISJ+giVnM9IaXxDeMqHUGLvi4F+LksS6pHlaKlN4awop/L+IMjIXpL+ug/ojaCyv/ixcVopJYYCVA==", + "requires": { + "@babel/runtime": "^7.12.5", + "array-tree-filter": "^2.1.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.0.1", + "warning": "^4.0.1" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "requires": { + "regenerator-runtime": "^0.13.4" + } + } + } + }, + "rc-checkbox": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/rc-checkbox/-/rc-checkbox-2.3.2.tgz", + "integrity": "sha512-afVi1FYiGv1U0JlpNH/UaEXdh6WUJjcWokj/nUN2TgG80bfG+MDdbfHKlLcNNba94mbjy2/SXJ1HDgrOkXGAjg==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1" + } + }, + "rc-collapse": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/rc-collapse/-/rc-collapse-3.1.2.tgz", + "integrity": "sha512-HujcKq7mghk/gVKeI6EjzTbb8e19XUZpakrYazu1MblEZ3Hu3WBMSN4A3QmvbF6n1g7x6lUlZvsHZ5shABWYOQ==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.3.4", + "rc-util": "^5.2.1", + "shallowequal": "^1.1.0" + } + }, + "rc-dialog": { + "version": "8.6.0", + "resolved": "https://registry.npmjs.org/rc-dialog/-/rc-dialog-8.6.0.tgz", + "integrity": "sha512-GSbkfqjqxpZC5/zc+8H332+q5l/DKUhpQr0vdX2uDsxo5K0PhvaMEVjyoJUTkZ3+JstEADQji1PVLVb/2bJeOQ==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-motion": "^2.3.0", + "rc-util": "^5.6.1" + } + }, + "rc-drawer": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/rc-drawer/-/rc-drawer-4.3.1.tgz", + "integrity": "sha512-GMfFy4maqxS9faYXEhQ+0cA1xtkddEQzraf6SAdzWbn444DrrLogwYPk1NXSpdXjLCLxgxOj9MYtyYG42JsfXg==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-util": "^5.7.0" + } + }, + "rc-dropdown": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/rc-dropdown/-/rc-dropdown-3.2.0.tgz", + "integrity": "sha512-j1HSw+/QqlhxyTEF6BArVZnTmezw2LnSmRk6I9W7BCqNCKaRwleRmMMs1PHbuaG8dKHVqP6e21RQ7vPBLVnnNw==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-trigger": "^5.0.4" + } + }, + "rc-field-form": { + "version": "1.20.1", + "resolved": "https://registry.npmjs.org/rc-field-form/-/rc-field-form-1.20.1.tgz", + "integrity": "sha512-f64KEZop7zSlrG4ef/PLlH12SLn6iHDQ3sTG+RfKBM45hikwV1i8qMf53xoX12NvXXWg1VwchggX/FSso4bWaA==", + "requires": { + "@babel/runtime": "^7.8.4", + "async-validator": "^3.0.3", + "rc-util": "^5.8.0" + } + }, + "rc-image": { + "version": "5.2.5", + "resolved": "https://registry.npmjs.org/rc-image/-/rc-image-5.2.5.tgz", + "integrity": "sha512-qUfZjYIODxO0c8a8P5GeuclYXZjzW4hV/5hyo27XqSFo1DmTCs2HkVeQObkcIk5kNsJtgsj1KoPThVsSc/PXOw==", + "requires": { + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-dialog": "~8.6.0", + "rc-util": "^5.0.6" + } + }, + "rc-input-number": { + "version": "7.1.4", + "resolved": "https://registry.npmjs.org/rc-input-number/-/rc-input-number-7.1.4.tgz", + "integrity": "sha512-EG4iqkqyqzLRu/Dq+fw2od7nlgvXLEatE+J6uhi3HXE1qlM3C7L6a7o/hL9Ly9nimkES2IeQoj3Qda3I0izj3Q==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.9.8" + } + }, + "rc-mentions": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/rc-mentions/-/rc-mentions-1.6.1.tgz", + "integrity": "sha512-LDzGI8jJVGnkhpTZxZuYBhMz3avcZZqPGejikchh97xPni/g4ht714Flh7DVvuzHQ+BoKHhIjobHnw1rcP8erg==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6", + "rc-menu": "^9.0.0", + "rc-textarea": "^0.3.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.0.1" + } + }, + "rc-menu": { + "version": "9.0.12", + "resolved": "https://registry.npmjs.org/rc-menu/-/rc-menu-9.0.12.tgz", + "integrity": "sha512-8uy47DL36iDEwVZdUO/fjhhW5+4j0tYlrCsOzw6iy8MJqKL7/HC2pj7sL/S9ayp2+hk9fYQYB9Tu+UN+N2OOOQ==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.4.3", + "rc-overflow": "^1.2.0", + "rc-trigger": "^5.1.2", + "rc-util": "^5.12.0", + "shallowequal": "^1.1.0" + } + }, + "rc-motion": { + "version": "2.4.4", + "resolved": "https://registry.npmjs.org/rc-motion/-/rc-motion-2.4.4.tgz", + "integrity": "sha512-ms7n1+/TZQBS0Ydd2Q5P4+wJTSOrhIrwNxLXCZpR7Fa3/oac7Yi803HDALc2hLAKaCTQtw9LmQeB58zcwOsqlQ==", + "requires": { + "@babel/runtime": "^7.11.1", + "classnames": "^2.2.1", + "rc-util": "^5.2.1" + } + }, + "rc-notification": { + "version": "4.5.7", + "resolved": "https://registry.npmjs.org/rc-notification/-/rc-notification-4.5.7.tgz", + "integrity": "sha512-zhTGUjBIItbx96SiRu3KVURcLOydLUHZCPpYEn1zvh+re//Tnq/wSxN4FKgp38n4HOgHSVxcLEeSxBMTeBBDdw==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.2.0", + "rc-util": "^5.0.1" + } + }, + "rc-overflow": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/rc-overflow/-/rc-overflow-1.2.2.tgz", + "integrity": "sha512-X5kj9LDU1ue5wHkqvCprJWLKC+ZLs3p4He/oxjZ1Q4NKaqKBaYf5OdSzRSgh3WH8kSdrfU8LjvlbWnHgJOEkNQ==", + "requires": { + "@babel/runtime": "^7.11.1", + "classnames": "^2.2.1", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.5.1" + } + }, + "rc-pagination": { + "version": "3.1.9", + "resolved": "https://registry.npmjs.org/rc-pagination/-/rc-pagination-3.1.9.tgz", + "integrity": "sha512-IKBKaJ4icVPeEk9qRHrFBJmHxBUrCp3+nENBYob4Ofqsu3RXjBOy4N36zONO7oubgLyiG3PxVmyAuVlTkoc7Jg==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1" + } + }, + "rc-picker": { + "version": "2.5.18", + "resolved": "https://registry.npmjs.org/rc-picker/-/rc-picker-2.5.18.tgz", + "integrity": "sha512-XyieTl8GOC5TeQFEvYbjx/Mtc0/CjruS7mKFT6Fy65FbGXmoFsWoWvIi+ylFx/BQHPGQi7a7vCNoZJ2TTqcZoA==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "date-fns": "2.x", + "dayjs": "1.x", + "moment": "^2.24.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.4.0", + "shallowequal": "^1.1.0" + } + }, + "rc-progress": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/rc-progress/-/rc-progress-3.1.4.tgz", + "integrity": "sha512-XBAif08eunHssGeIdxMXOmRQRULdHaDdIFENQ578CMb4dyewahmmfJRyab+hw4KH4XssEzzYOkAInTLS7JJG+Q==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.6" + } + }, + "rc-rate": { + "version": "2.9.1", + "resolved": "https://registry.npmjs.org/rc-rate/-/rc-rate-2.9.1.tgz", + "integrity": "sha512-MmIU7FT8W4LYRRHJD1sgG366qKtSaKb67D0/vVvJYR0lrCuRrCiVQ5qhfT5ghVO4wuVIORGpZs7ZKaYu+KMUzA==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.0.1" + } + }, + "rc-resize-observer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/rc-resize-observer/-/rc-resize-observer-1.0.1.tgz", + "integrity": "sha512-OxO2mJI9e8610CAWBFfm52SPvWib0eNKjaSsRbbKHmLaJIxw944P+D61DlLJ/w2vuOjGNcalJu8VdqyNm/XCRg==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-util": "^5.0.0", + "resize-observer-polyfill": "^1.5.1" + } + }, + "rc-select": { + "version": "12.1.13", + "resolved": "https://registry.npmjs.org/rc-select/-/rc-select-12.1.13.tgz", + "integrity": "sha512-cPI+aesP6dgCAaey4t4upDbEukJe+XN0DK6oO/6flcCX5o28o7KNZD7JAiVtC/6fCwqwI/kSs7S/43dvHmBl+A==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.0.1", + "rc-overflow": "^1.0.0", + "rc-trigger": "^5.0.4", + "rc-util": "^5.9.8", + "rc-virtual-list": "^3.2.0" + } + }, + "rc-slider": { + "version": "9.7.2", + "resolved": "https://registry.npmjs.org/rc-slider/-/rc-slider-9.7.2.tgz", + "integrity": "sha512-mVaLRpDo6otasBs6yVnG02ykI3K6hIrLTNfT5eyaqduFv95UODI9PDS6fWuVVehVpdS4ENgOSwsTjrPVun+k9g==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-tooltip": "^5.0.1", + "rc-util": "^5.0.0", + "shallowequal": "^1.1.0" + } + }, + "rc-steps": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/rc-steps/-/rc-steps-4.1.3.tgz", + "integrity": "sha512-GXrMfWQOhN3sVze3JnzNboHpQdNHcdFubOETUHyDpa/U3HEKBZC3xJ8XK4paBgF4OJ3bdUVLC+uBPc6dCxvDYA==", + "requires": { + "@babel/runtime": "^7.10.2", + "classnames": "^2.2.3", + "rc-util": "^5.0.1" + } + }, + "rc-switch": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/rc-switch/-/rc-switch-3.2.2.tgz", + "integrity": "sha512-+gUJClsZZzvAHGy1vZfnwySxj+MjLlGRyXKXScrtCTcmiYNPzxDFOxdQ/3pK1Kt/0POvwJ/6ALOR8gwdXGhs+A==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-util": "^5.0.1" + } + }, + "rc-table": { + "version": "7.15.2", + "resolved": "https://registry.npmjs.org/rc-table/-/rc-table-7.15.2.tgz", + "integrity": "sha512-TAs7kCpIZwc2mtvD8CMrXSM6TqJDUsy0rUEV1YgRru33T8bjtAtc+9xW/KC1VWROJlHSpU0R0kXjFs9h/6+IzQ==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.13.0", + "shallowequal": "^1.1.0" + } + }, + "rc-tabs": { + "version": "11.10.1", + "resolved": "https://registry.npmjs.org/rc-tabs/-/rc-tabs-11.10.1.tgz", + "integrity": "sha512-ey1i2uMyfnRNYbViLcUYGH+Y7hueJbdCVSLaXnXki9hxBcGqxJMPy9t5xR0n/3QFQspj7Tf6+2VTXVtmO7Yaug==", + "requires": { + "@babel/runtime": "^7.11.2", + "classnames": "2.x", + "rc-dropdown": "^3.2.0", + "rc-menu": "^9.0.0", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.5.0" + } + }, + "rc-textarea": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/rc-textarea/-/rc-textarea-0.3.5.tgz", + "integrity": "sha512-qa+k5vDn9ct65qr+SgD2KwJ9Xz6P84lG2z+TDht/RBr71WnM/K61PqHUAcUyU6YqTJD26IXgjPuuhZR7HMw7eA==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.1", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.7.0" + } + }, + "rc-tooltip": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/rc-tooltip/-/rc-tooltip-5.1.1.tgz", + "integrity": "sha512-alt8eGMJulio6+4/uDm7nvV+rJq9bsfxFDCI0ljPdbuoygUscbsMYb6EQgwib/uqsXQUvzk+S7A59uYHmEgmDA==", + "requires": { + "@babel/runtime": "^7.11.2", + "rc-trigger": "^5.0.0" + } + }, + "rc-tree": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/rc-tree/-/rc-tree-4.2.2.tgz", + "integrity": "sha512-V1hkJt092VrOVjNyfj5IYbZKRMHxWihZarvA5hPL/eqm7o2+0SNkeidFYm7LVVBrAKBpOpa0l8xt04uiqOd+6w==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-motion": "^2.0.1", + "rc-util": "^5.0.0", + "rc-virtual-list": "^3.0.1" + } + }, + "rc-tree-select": { + "version": "4.3.3", + "resolved": "https://registry.npmjs.org/rc-tree-select/-/rc-tree-select-4.3.3.tgz", + "integrity": "sha512-0tilOHLJA6p+TNg4kD559XnDX3PTEYuoSF7m7ryzFLAYvdEEPtjn0QZc5z6L0sMKBiBlj8a2kf0auw8XyHU3lA==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "2.x", + "rc-select": "^12.0.0", + "rc-tree": "^4.0.0", + "rc-util": "^5.0.5" + } + }, + "rc-trigger": { + "version": "5.2.10", + "resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-5.2.10.tgz", + "integrity": "sha512-FkUf4H9BOFDaIwu42fvRycXMAvkttph9AlbCZXssZDVzz2L+QZ0ERvfB/4nX3ZFPh1Zd+uVGr1DEDeXxq4J1TA==", + "requires": { + "@babel/runtime": "^7.11.2", + "classnames": "^2.2.6", + "rc-align": "^4.0.0", + "rc-motion": "^2.0.0", + "rc-util": "^5.5.0" + } + }, + "rc-upload": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/rc-upload/-/rc-upload-4.3.1.tgz", + "integrity": "sha512-W8Iyv0LRyEnFEzpv90ET/i1XG2jlPzPxKkkOVtDfgh9c3f4lZV770vgpUfiyQza+iLtQLVco3qIvgue8aDiOsQ==", + "requires": { + "@babel/runtime": "^7.10.1", + "classnames": "^2.2.5", + "rc-util": "^5.2.0" + } + }, + "rc-util": { + "version": "5.14.0", + "resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.14.0.tgz", + "integrity": "sha512-2vy6/Z1BJUcwLjm/UEJb/htjUTQPigITUIemCcFEo1fQevAumc9sA32x2z5qyWoa9uhrXbiAjSDpPIUqyg65sA==", + "requires": { + "@babel/runtime": "^7.12.5", + "react-is": "^16.12.0", + "shallowequal": "^1.1.0" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.15.4", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.15.4.tgz", + "integrity": "sha512-99catp6bHCaxr4sJ/DbTGgHS4+Rs2RVd2g7iOap6SLGPDknRK9ztKNsE/Fg6QhSeh1FGE5f6gHGQmvvn3I3xhw==", + "requires": { + "regenerator-runtime": "^0.13.4" + } + }, + "react-is": { + "version": "16.13.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + } + } + }, + "rc-virtual-list": { + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/rc-virtual-list/-/rc-virtual-list-3.4.1.tgz", + "integrity": "sha512-YexJy+Cx8qjnQdV8+0JBeM65VF2kvO9lnsfrIvHsL3lIH1adMZ85HqmePGUzKkKMZC+CRAJc2K4g2iJS1dOjPw==", + "requires": { + "classnames": "^2.2.6", + "rc-resize-observer": "^1.0.0", + "rc-util": "^5.0.7" + } + }, "react": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", @@ -34730,6 +36134,11 @@ "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz", "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=" }, + "resize-observer-polyfill": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz", + "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==" + }, "resolve": { "version": "1.18.1", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.18.1.tgz", @@ -35266,6 +36675,14 @@ "ajv-keywords": "^3.5.2" } }, + "scroll-into-view-if-needed": { + "version": "2.2.28", + "resolved": "https://registry.npmjs.org/scroll-into-view-if-needed/-/scroll-into-view-if-needed-2.2.28.tgz", + "integrity": "sha512-8LuxJSuFVc92+0AdNv4QOxRL4Abeo1DgLnGNkn1XlaujPH/3cCFz3QI60r2VNu4obJJROzgnIUw5TKQkZvZI1w==", + "requires": { + "compute-scroll-into-view": "^1.0.17" + } + }, "select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", @@ -35445,6 +36862,11 @@ "safe-buffer": "^5.0.1" } }, + "shallowequal": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + }, "shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -36024,6 +37446,11 @@ } } }, + "string-convert": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/string-convert/-/string-convert-0.2.1.tgz", + "integrity": "sha1-aYLMMEn7tM2F+LJFaLnZvznu/5c=" + }, "string-length": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz", @@ -36589,6 +38016,11 @@ "is-number": "^7.0.0" } }, + "toggle-selection": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz", + "integrity": "sha1-bkWxJj8gF/oKzH2J14sVuL932jI=" + }, "toidentifier": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", @@ -37059,6 +38491,14 @@ "makeerror": "1.0.x" } }, + "warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "requires": { + "loose-envify": "^1.0.0" + } + }, "watchpack": { "version": "1.7.5", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", diff --git a/package.json b/package.json index a48231b..6d74c11 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,9 @@ "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^11.2.7", "@testing-library/user-event": "^12.8.3", + "antd": "^4.16.13", + "mobx": "^6.3.3", + "mobx-react-lite": "^3.2.1", "react": "^17.0.2", "react-dom": "^17.0.2", "react-scripts": "4.0.3", diff --git a/public/index.html b/public/index.html index aa069f2..9ea85f6 100644 --- a/public/index.html +++ b/public/index.html @@ -1,43 +1,20 @@ - - - - - - - - - - - - React App - - - -
- - - + \ No newline at end of file diff --git a/src/App.js b/src/App.js index 3784575..9f31d1d 100644 --- a/src/App.js +++ b/src/App.js @@ -1,24 +1,10 @@ -import logo from './logo.svg'; -import './App.css'; - +import Editor from "./view/Editor"; +import globalStore, { GlobalContext } from "./store/global"; function App() { return ( -
-
- logo -

- Edit src/App.js and save to reload. -

- - Learn React - -
-
+ + + ); } diff --git a/src/component/EditableContent/index.js b/src/component/EditableContent/index.js new file mode 100644 index 0000000..5547cd6 --- /dev/null +++ b/src/component/EditableContent/index.js @@ -0,0 +1,109 @@ +import React, { useCallback, useState } from "react"; +import { Button, Input, Menu, Select } from "antd"; +import PopoverOnSvg from "../PopoverOnSvg"; +import Styles from "./index.module.css"; + +function EditableContent({ + children, + title, + initialValue, + inputType, + options, + onChange, +}) { + const [inputValue, setInputValue] = useState(initialValue); + const [popoverVisible, setPopoverVisible] = useState(false); + const handleVisibilityChange = useCallback( + function (value) { + setPopoverVisible(value); + if (!value) { + setInputValue(initialValue); + } + }, + [initialValue] + ); + const handleInput = useCallback(function (ev) { + setInputValue(ev.target.value); + }, []); + const handleConfirm = useCallback( + async function (value) { + const v = value === undefined ? inputValue : value; + const success = await (onChange && onChange(v)); + success !== false && setPopoverVisible(false); + }, + [inputValue, onChange] + ); + const handleCancel = useCallback( + function () { + setInputValue(initialValue); + setPopoverVisible(false); + }, + [initialValue] + ); + const renderTextInputPopover = useCallback( + () => ( + <> + handleConfirm()} + /> +
+ + +
+ + ), + [inputValue, handleInput, handleConfirm, handleCancel] + ); + const renderSelectionPopover = useCallback(() => { + return ( + + {(options || []).map((option) => ( + handleConfirm(option.key)} + > + {option.text} + + ))} + + ); + }, [inputValue, options]); + let renderContent, renderPopover; + switch (inputType) { + case "select": + renderContent = renderSelectionPopover; + break; + case "number": + case "text": + default: + renderContent = renderTextInputPopover; + } + + return ( + + {children} + + ); +} + +export default EditableContent; diff --git a/src/component/EditableContent/index.module.css b/src/component/EditableContent/index.module.css new file mode 100644 index 0000000..109c2af --- /dev/null +++ b/src/component/EditableContent/index.module.css @@ -0,0 +1,21 @@ +.buttonGroup { + margin: 8px 0 4px 0; + width: 300px; + max-width: 100%; + text-align: right; +} +.button { + margin-right: 8px; +} +.menu { + max-height: 320px; + overflow: auto; +} +.menuItem:hover { + background-color: whitesmoke; + color: black !important; + user-select: none; +} +:global(.selected).menuItem { + background-color: whitesmoke; +} \ No newline at end of file diff --git a/src/component/PopoverOnSvg/index.js b/src/component/PopoverOnSvg/index.js new file mode 100644 index 0000000..6383583 --- /dev/null +++ b/src/component/PopoverOnSvg/index.js @@ -0,0 +1,275 @@ +import React, { useCallback, useEffect, useRef, useState } from "react"; +import { createPortal } from "react-dom"; +import Styles from "./index.module.css"; + +// ENHANCE: smart placement +function PopoverOnSvg({ + children, + renderContent, + renderPopover, + darkMode, + globalClassName, + offset, + placement, + style, + title, + trigger, + visible, + autoHide, + // TODO: complete this + showArrow, + onVisibilityChange, +}) { + const containerRef = useRef(); + const triggerBoxRef = useRef({ + x: 0, + y: 0, + width: 0, + height: 0, + top: 0, + bottom: 0, + left: 0, + right: 0, + }); + const initFlagRef = useRef(false); + const triggerRef = useRef(); + const popoverRef = useRef(); + // initially, always set innerVisible to false. If the prop *visible* is + // true, we'll update it after dom mounted, because we cannot calculate + // correct position of popover before react mounting it. + const [innerVisible, setInnerVisible] = useState(false); + const [, forceUpdate] = useState(); + const popoverClassNames = [Styles.popover, globalClassName].filter(Boolean); + const arrowClassNames = [Styles.arrow]; + const headerClassNames = [Styles.header]; + let offsetX = (offset && offset.x) || 0; + let offsetY = (offset && offset.y) || 0; + let mergedStyles = { + transform: "", + }; + const arrowStyles = {}; + placement = placement.toLowerCase(); + + const makeOffset = function (x, y = 0) { + offsetX += x; + offsetY += y; + }; + const changeVisibility = useCallback( + function (shouldShow) { + shouldShow = shouldShow ?? !innerVisible; + let newVisibility = visible === undefined ? shouldShow : visible; + if (newVisibility) { + if (!triggerRef.current) { + setTimeout(changeVisibility, 0); + return; + } + // re-get box of trigger element + triggerBoxRef.current = triggerRef.current.getBoundingClientRect(); + } + setInnerVisible(newVisibility); + // FIXME: visible由false变为true时React Warning: Cannot update a component (`EditableContent`) while rendering a different component (`PopoverOnSvg`). + onVisibilityChange && onVisibilityChange(shouldShow); + }, + [visible, innerVisible, onVisibilityChange] + ); + const handleContextMenu = useCallback( + (ev) => { + // TODO: working + console.log(ev.pageX, ev.pageY) + ev.preventDefault(); + changeVisibility(true); + }, + [changeVisibility] + ); + useEffect(() => { + initFlagRef.current = true; + }, []); + useEffect(() => { + if (autoHide === false) { + return; + } + const handler = (ev) => { + if (ev.type === "keydown" && ev.key === "Escape") { + changeVisibility(false); + } else if (ev.type === "mouseup") { + for (let target = ev.target; target; target = target.parentElement) { + if (target === popoverRef.current) { + return; + } else if (target === triggerRef.current) { + if (trigger === "context" && ev.button !== 2) { + continue; + } else if (trigger === "click" && ev.button !== 0) { + continue; + } + return; + } + } + changeVisibility(false); + } + }; + if (innerVisible) { + document.addEventListener("mouseup", handler); + document.addEventListener("keydown", handler); + } + return () => { + document.removeEventListener("mouseup", handler); + document.removeEventListener("keydown", handler); + }; + }, [innerVisible, autoHide, changeVisibility]); + + if (visible !== undefined && visible !== innerVisible) { + if (initFlagRef.current) { + changeVisibility(); + } else { + setTimeout(() => { + // this is the first-time render, trigger dom has not mounted, so we + // have to delay the rendering + forceUpdate([]); + }, 0); + } + } + if (!containerRef.current) { + containerRef.current = document.body.querySelector( + "body > div#svg-popover-container" + ); + if (!containerRef.current) { + containerRef.current = document.createElement("div"); + containerRef.current.id = "svg-popover-container"; + document.body.appendChild(containerRef.current); + } + } + const box = triggerBoxRef.current; + switch (true) { + case /^(left|right)(top|center|bottom)?$/i.test(placement): + mergedStyles.minHeight = "32px"; + if (placement.startsWith("right")) { + mergedStyles.left = box.right + "px"; + } else { + mergedStyles.left = box.left + "px"; + mergedStyles.transform += " translate(-100%, 0)"; + } + if (placement.endsWith("top")) { + mergedStyles.top = box.top + "px"; + mergedStyles.transform += " translate(0, 0)"; + arrowStyles.top = "16px"; + } else if (placement.endsWith("bottom")) { + mergedStyles.top = box.bottom + "px"; + mergedStyles.transform += " translate(0, -100%)"; + arrowStyles.bottom = "0"; + } else { + mergedStyles.top = box.y + box.height / 2 + "px"; + mergedStyles.transform += " translate(0, -50%)"; + arrowStyles.top = "50%"; + } + break; + case /^(top|bottom)(left|center|right)?$/i.test(placement): + default: + if (placement.startsWith("bottom")) { + mergedStyles.top = box.bottom + "px"; + } else { + mergedStyles.top = box.y + "px"; + mergedStyles.transform += " translate(0, -100%)"; + } + if (placement.endsWith("left")) { + mergedStyles.left = box.left + "px"; + arrowStyles.left = "16px"; + } else if (placement.endsWith("right")) { + mergedStyles.left = box.right + "px"; + mergedStyles.transform += " translate(-100%, 0)"; + arrowStyles.right = "0"; + } else { + mergedStyles.left = box.right - box.width / 2 + "px"; + mergedStyles.transform += " translateX(-50%)"; + arrowStyles.left = "50%"; + } + break; + } + switch (true) { + case !showArrow: + break; + case placement.startsWith("left"): + makeOffset(-8); + arrowClassNames.push("left"); + break; + case placement.startsWith("right"): + makeOffset(8); + arrowClassNames.push("right"); + break; + case placement.startsWith("bottom"): + makeOffset(0, 8); + arrowClassNames.push("bottom"); + break; + case placement.startsWith("top"): + default: + makeOffset(0, -8); + arrowClassNames.push("top"); + break; + } + mergedStyles.transform += ` translate(${offsetX}px, ${offsetY}px)`; + if (darkMode) { + popoverClassNames.push("dark"); + arrowClassNames.push("dark"); + headerClassNames.push("dark"); + } + mergedStyles = Object.assign(mergedStyles, style); + return ( + <> + [] + changeVisibility() : undefined} + onMouseEnter={ + trigger === "hover" ? () => changeVisibility(true) : undefined + } + onMouseLeave={ + trigger === "hover" ? () => changeVisibility(false) : undefined + } + onContextMenu={trigger === "context" ? handleContextMenu : undefined} + > + {children} + + {innerVisible && + createPortal( +
+ {renderPopover ? ( + typeof renderPopover === "function" ? ( + renderPopover() + ) : ( + renderPopover + ) + ) : ( + <> +
+ {title && ( +
+ {title} +
+ )} +
+ {typeof renderContent === "function" + ? renderContent() + : renderContent ?? null} +
+ + )} +
, + containerRef.current + )} + + ); +} + +PopoverOnSvg.defaultProps = { + trigger: "click", + placement: "top", +}; + +export default React.memo(PopoverOnSvg); diff --git a/src/component/PopoverOnSvg/index.module.css b/src/component/PopoverOnSvg/index.module.css new file mode 100644 index 0000000..ed9cb4d --- /dev/null +++ b/src/component/PopoverOnSvg/index.module.css @@ -0,0 +1,55 @@ +.popover { + position: absolute; + border-radius: 4px; + box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15); + background-color: white; + min-width: 32px; +} +:global(.dark).popover { + background-color: black; + color: white; +} +.arrow { + display: block; + position: absolute; + z-index: -1; + border: 8px solid white; + background-color: white; + width: 8px; + height: 8px; +} +:global(.dark).arrow { + border-color: black; + background-color: black; +} +:global(.left).arrow { + right: -12px; + transform: translate(-50%, -50%) rotate(135deg); + box-shadow: -2px -2px 6px -2px rgba(0, 0, 0, 0.06); +} +:global(.right).arrow { + left: 4px; + transform: translate(-50%, -50%) rotate(-45deg); + box-shadow: -2px -2px 6px -2px rgba(0, 0, 0, 0.06); +} +:global(.top).arrow { + bottom: -12px; + transform: translate(-50%, -50%) rotate(45deg); + box-shadow: 3px 3px 7px -2px rgba(0, 0, 0, 0.07); +} +:global(.bottom).arrow { + top: 4px; + transform: translate(-50%, -50%) rotate(45deg); + box-shadow: -3px -3px 8px -2px rgba(0, 0, 0, 0.07); +} +.content { + padding: 4px 8px; +} +.header { + border-bottom: 1px solid rgba(0, 0, 0, 0.08); + padding: 4px 8px; + line-height: 22px; +} +:global(.dark).header { + border-bottom: 1px solid rgba(255, 255, 255, 0.35); +} diff --git a/src/index.js b/src/index.js index ef2edf8..e2d22c9 100644 --- a/src/index.js +++ b/src/index.js @@ -1,14 +1,15 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import './index.css'; -import App from './App'; -import reportWebVitals from './reportWebVitals'; +import React from "react"; +import ReactDOM from "react-dom"; +import "antd/dist/antd.css"; +import App from "./App"; +import reportWebVitals from "./reportWebVitals"; +import "./index.css"; ReactDOM.render( , - document.getElementById('root') + document.getElementById("root") ); // If you want to start measuring performance in your app, pass a function diff --git a/src/store/global.js b/src/store/global.js new file mode 100644 index 0000000..5d8bf50 --- /dev/null +++ b/src/store/global.js @@ -0,0 +1,17 @@ +import React from "react"; +import { observable } from "mobx"; + +let globalStore = observable({ + canvasWidth: 1024, + canvasHeight: 1448, + title: "简谱", + tone: "♭D", + marginHorizontal: 32, + beat: [4, 4], + speed: 75, + authors: ["Haven Mattuy 制谱", "杨瑞光 作词"], + data: {}, +}); + +export default globalStore; +export const GlobalContext = React.createContext(globalStore); diff --git a/src/util/html-escape.js b/src/util/html-escape.js new file mode 100644 index 0000000..914c619 --- /dev/null +++ b/src/util/html-escape.js @@ -0,0 +1,6 @@ +// 为了解决svg text不渲染连续空格，对html转义并替换空格为  +export default function escapeHtml(text) { + const span = document.createElement("span"); + span.appendChild(document.createTextNode(text)); + return span.innerHTML.replace(/\s/g, " "); +} diff --git a/src/view/Canvas/index.js b/src/view/Canvas/index.js new file mode 100644 index 0000000..9baf416 --- /dev/null +++ b/src/view/Canvas/index.js @@ -0,0 +1,19 @@ +import { observer } from "mobx-react-lite"; +import store from "../../store/global"; +import Styles from "./index.module.css"; + +function Canvas({ children, ...props }) { + return ( + + {children} + + ); +} + +export default observer(Canvas); diff --git a/src/view/Canvas/index.module.css b/src/view/Canvas/index.module.css new file mode 100644 index 0000000..1b30ad6 --- /dev/null +++ b/src/view/Canvas/index.module.css @@ -0,0 +1,7 @@ +.svg { + border: 1px solid ghostwhite; + box-shadow: ghostwhite 0px 0px 10px; +} +.svg :global(text) { + user-select: none; +} \ No newline at end of file diff --git a/src/view/Editor/index.js b/src/view/Editor/index.js new file mode 100644 index 0000000..1464a82 --- /dev/null +++ b/src/view/Editor/index.js @@ -0,0 +1,13 @@ +import Canvas from "../Canvas"; +import Header from "../Header"; +import Styles from "./index.module.css"; + +export default function Editor() { + return ( +
+ +
+ +
+ ); +} diff --git a/src/view/Editor/index.module.css b/src/view/Editor/index.module.css new file mode 100644 index 0000000..cf2cb7b --- /dev/null +++ b/src/view/Editor/index.module.css @@ -0,0 +1,7 @@ +.container { + background-color: white; + height: 100%; + display: flex; + justify-content: center; + padding-top: 8px; +} diff --git a/src/view/Header/LeftInfoBlock/index.js b/src/view/Header/LeftInfoBlock/index.js new file mode 100644 index 0000000..de660be --- /dev/null +++ b/src/view/Header/LeftInfoBlock/index.js @@ -0,0 +1,110 @@ +import { action } from "mobx"; +import { message } from "antd"; +import { observer } from "mobx-react-lite"; +import EditableContent from "../../../component/EditableContent"; +import store from "../../../store/global"; +import Row from "../../Row"; +import Text from "../../Text"; + +const tones = [ + "A", + "B", + "C", + "D", + "E", + "F", + "G", + "♭A", + "♭B", + "♭C", + "♭D", + "♭E", + "♭F", + "♭G", +].map((t) => ({ key: t, text: t })); +const beats = ["4/4"].map((t) => ({ key: t, text: t })); +const handleChangeTone = action(function (value) { + store.tone = value; +}); +const handleChangeSpeed = action(function (value) { + store.speed = value; +}); +const handleChangeBeat = action(function (value) { + const beat = String(value).split("/"); + if (beat.length !== 2) { + message.error("请以【*/*】的格式输入节拍！"); + return false; + } + const [c, t] = [parseInt(beat[0], 10), parseInt(beat[1], 10)]; + if (c > 0 && t > 0) { + store.beat = [c, t]; + } else { + message.error("请输入大于0的拍数和时值！"); + return false; + } +}); + +function LeftInfoBlock() { + return ( + <> + + + 1  = + {store.tone.startsWith("♭") && ( + + ♭ + + )} + + + {store.tone.at(-1)} + + + + + + + {store.beat[0]} + + + {store.beat[1]} + + + + + + + ♩ + =  {store.speed} + + + + ); +} + +export default observer(LeftInfoBlock); diff --git a/src/view/Header/RightInfoBlock/index.js b/src/view/Header/RightInfoBlock/index.js new file mode 100644 index 0000000..159ad64 --- /dev/null +++ b/src/view/Header/RightInfoBlock/index.js @@ -0,0 +1,52 @@ +import { action } from "mobx"; +import { observer } from "mobx-react-lite"; +import EditableContent from "../../../component/EditableContent"; +import PopoverOnSvg from "../../../component/PopoverOnSvg"; +import escapeHtml from "../../../util/html-escape"; +import store from "../../../store/global"; +import Row from "../../Row"; +import Text from "../../Text"; + +const handleChangeAuthor = action((index, value) => { + store.authors[index] = value; +}); + +function RightInfoBlock() { + return ( + // TODO: working + + + + {store.authors.map((author, i) => ( + + + {author} + + + ))} + + + ); +} + +export default observer(RightInfoBlock); diff --git a/src/view/Header/Title/index.js b/src/view/Header/Title/index.js new file mode 100644 index 0000000..cc569f9 --- /dev/null +++ b/src/view/Header/Title/index.js @@ -0,0 +1,34 @@ +import { action } from "mobx"; +import { observer } from "mobx-react-lite"; +import EditableContent from "../../../component/EditableContent"; +import store from "../../../store/global"; +import Row from "../../Row"; +import Text from "../../Text"; +const handleChangeTitle = action((value) => { + store.title = value; +}); + +function Title() { + return ( + + + + {store.title} + + + + ); +} + +export default observer(Title); diff --git a/src/view/Header/index.js b/src/view/Header/index.js new file mode 100644 index 0000000..6727022 --- /dev/null +++ b/src/view/Header/index.js @@ -0,0 +1,16 @@ +import React from "react"; +import LeftInfoBlock from "./LeftInfoBlock"; +import RightInfoBlock from "./RightInfoBlock"; +import Title from "./Title"; + +function Header() { + return ( + <> + + + + + ); +} + +export default React.memo(Header); diff --git a/src/view/Notation/index.js b/src/view/Notation/index.js new file mode 100644 index 0000000..668de1e --- /dev/null +++ b/src/view/Notation/index.js @@ -0,0 +1,10 @@ +import Row from "../Row"; +import Text from "../Text"; + +export default function Notation(...props) { + return ( + + 1 + + ); +} diff --git a/src/view/Row/index.js b/src/view/Row/index.js new file mode 100644 index 0000000..d9fa7c7 --- /dev/null +++ b/src/view/Row/index.js @@ -0,0 +1,28 @@ +export default function Row({ + children, + type, + editable, + offset, + offsetX, + offsetY, + ...props +}) { + offsetX = (offset?.x ?? offsetX) | 0; + offsetY = (offset?.y ?? offsetY) | 0; + return ( + + {children} + + ); +} diff --git a/src/view/Text/index.js b/src/view/Text/index.js new file mode 100644 index 0000000..4bbc7ae --- /dev/null +++ b/src/view/Text/index.js @@ -0,0 +1,45 @@ +import escapeHtml from "../../util/html-escape"; + +export default function Text({ children, editable, ...props }) { + if (typeof children === "string") { + return ( + + ); + } + return ( + + {children} + + ); +}