From 77f985dad8c8a6ebfa1a73e993a72b4f732ed422 Mon Sep 17 00:00:00 2001 From: unknown Date: Mon, 24 Aug 2020 23:47:22 +0300 Subject: [PATCH] wheel & arrow Up/Down key events have added --- example/package-lock.json | 185 +++++++++++--------- src/components/bar/bar.tsx | 1 + src/components/gantt/gantt.module.css | 1 + src/components/gantt/gantt.tsx | 64 ++++++- src/components/gantt/task-gantt-content.tsx | 22 ++- src/components/gantt/task-gantt.tsx | 8 +- src/components/other/scroll.tsx | 14 +- src/components/task-list/task-list.tsx | 8 +- 8 files changed, 203 insertions(+), 100 deletions(-) diff --git a/example/package-lock.json b/example/package-lock.json index f115f42..26f493b 100644 --- a/example/package-lock.json +++ b/example/package-lock.json @@ -16365,9 +16365,9 @@ } }, "@babel/generator": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.11.0.tgz", - "integrity": "sha512-fEm3Uzw7Mc9Xi//qU20cBKatTfs2aOtKqmvy/Vm7RkJEGFQ4xc9myCfbXxqK//ZS8MR/ciOHw6meGASJuKmDfQ==", + "version": "7.11.4", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.11.4.tgz", + "integrity": "sha512-Rn26vueFx0eOoz7iifCN2UHT6rGtnkSGWSoDRIy8jZN3B91PzeSULbswfLoOWuTuAcNwpG/mxy+uCTDnZ9Mp1g==", "requires": { "@babel/types": "^7.11.0", "jsesc": "^2.5.1", @@ -16463,11 +16463,10 @@ } }, "@babel/helper-explode-assignable-expression": { - "version": "7.10.4", - "resolved": "https://registry.npmjs.org/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.10.4.tgz", - "integrity": "sha512-4K71RyRQNPRrR85sr5QY4X3VwG4wtVoXZB9+L3r1Gp38DhELyHCtovqydRi7c1Ovb17eRGiQ/FD5s8JdU0Uy5A==", + "version": "7.11.4", + "resolved": "https://registry.npmjs.org/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.11.4.tgz", + "integrity": "sha512-ux9hm3zR4WV1Y3xXxXkdG/0gxF9nvI0YVmKVhvK9AfMoaQkemL3sJpXw+Xbz65azo8qJiEz2XVDUpK3KYhH3ZQ==", "requires": { - "@babel/traverse": "^7.10.4", "@babel/types": "^7.10.4" } }, @@ -16549,14 +16548,13 @@ } }, "@babel/helper-remap-async-to-generator": { - "version": "7.10.4", - "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.10.4.tgz", - "integrity": "sha512-86Lsr6NNw3qTNl+TBcF1oRZMaVzJtbWTyTko+CQL/tvNvcGYEFKbLXDPxtW0HKk3McNOk4KzY55itGWCAGK5tg==", + "version": "7.11.4", + "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.11.4.tgz", + "integrity": "sha512-tR5vJ/vBa9wFy3m5LLv2faapJLnDFxNWff2SAYkSE4rLUdbp7CdObYFgI7wK4T/Mj4UzpjPwzR8Pzmr5m7MHGA==", "requires": { "@babel/helper-annotate-as-pure": "^7.10.4", "@babel/helper-wrap-function": "^7.10.4", "@babel/template": "^7.10.4", - "@babel/traverse": "^7.10.4", "@babel/types": "^7.10.4" } }, @@ -16633,9 +16631,9 @@ } }, "@babel/parser": { - "version": "7.11.3", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.11.3.tgz", - "integrity": "sha512-REo8xv7+sDxkKvoxEywIdsNFiZLybwdI7hcT5uEPyQrSMB4YQ973BfC9OOrD/81MaIjh6UxdulIQXkjmiH3PcA==" + "version": "7.11.4", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.11.4.tgz", + "integrity": "sha512-MggwidiH+E9j5Sh8pbrX5sJvMcsqS5o+7iB42M9/k0CD63MjYbdP4nhSh7uB5wnv2/RVzTZFTxzF/kIa5mrCqA==" }, "@babel/plugin-proposal-async-generator-functions": { "version": "7.10.5", @@ -17905,9 +17903,9 @@ "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==" }, "@types/node": { - "version": "14.0.27", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.27.tgz", - "integrity": "sha512-kVrqXhbclHNHGu9ztnAwSncIgJv/FaxmzXJvGXNdcCpV1b8u1/Mi6z6m0vwy0LzKeXFTPLH0NzwmoJ3fNCIq0g==" + "version": "14.6.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-14.6.0.tgz", + "integrity": "sha512-mikldZQitV94akrc4sCcSjtJfsTKt4p+e/s0AGscVA6XArQ9kFclP+ZiYUMnq987rc6QlYxXv/EivqlfSLxpKA==" }, "@types/parse-json": { "version": "4.0.0", @@ -18160,9 +18158,9 @@ "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==" }, "abab": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.3.tgz", - "integrity": "sha512-tsFzPpcttalNjFBCFMqsKYQcWxxen1pgJR56by//QwvJc4/OUS3kPOOttx2tSIfjsylB0pYu7f5D3K1RCxUnUg==" + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.4.tgz", + "integrity": "sha512-Eu9ELJWCz/c1e9gTiCY+FceWxcqzjYEbqMgtndnuSqZSUCOL73TWNK2mHfIj4Cw2E/ongOp+JISVNCmovt2KYQ==" }, "accepts": { "version": "1.3.7", @@ -18252,18 +18250,18 @@ } }, "aggregate-error": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.0.1.tgz", - "integrity": "sha512-quoaXsZ9/BLNae5yiNoUz+Nhkwz83GhWwtYFglcjEQB2NDHCIpApbqXxIFnm4Pq/Nvhrsq5sYJFyohrrxnTGAA==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz", + "integrity": "sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==", "requires": { "clean-stack": "^2.0.0", "indent-string": "^4.0.0" } }, "ajv": { - "version": "6.12.3", - "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.3.tgz", - "integrity": "sha512-4K0cK3L1hsqk9xIb2z9vs/XU+PGJZ9PNpJRDS9YLzmNdX6jmVPfamLvTJr0aDAusnHyCHO6MjzlkAsgtqp9teA==", + "version": "6.12.4", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.4.tgz", + "integrity": "sha512-eienB2c9qVQs2KWexhkrdMLVDoIQCz5KSeLxwg9Lzk4DOfBtIK9PQwwufcsn1jjGuf9WZmqPMbGxOzfcuphJCQ==", "requires": { "fast-deep-equal": "^3.1.1", "fast-json-stable-stringify": "^2.0.0", @@ -18441,13 +18439,14 @@ } }, "asn1.js": { - "version": "4.10.1", - "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz", - "integrity": "sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw==", + "version": "5.4.1", + "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz", + "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==", "requires": { "bn.js": "^4.0.0", "inherits": "^2.0.1", - "minimalistic-assert": "^1.0.0" + "minimalistic-assert": "^1.0.0", + "safer-buffer": "^2.1.0" }, "dependencies": { "bn.js": { @@ -18707,13 +18706,13 @@ } }, "parse-json": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.0.1.tgz", - "integrity": "sha512-ztoZ4/DYeXQq4E21v169sC8qWINGpcosGv9XhTDvg9/hWvx/zrFkc9BiWxR58OJLHGk28j5BL0SDLeV2WmFZlQ==", + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.1.0.tgz", + "integrity": "sha512-+mi/lmVVNKFNVyLXV31ERiy2CY5E1/F6QtJFEzoChPRwwngMNXRDQ9GJ5WdE2Z2P4AujsOi0/+2qHID68KwfIQ==", "requires": { "@babel/code-frame": "^7.0.0", "error-ex": "^1.3.1", - "json-parse-better-errors": "^1.0.1", + "json-parse-even-better-errors": "^2.3.0", "lines-and-columns": "^1.1.6" } }, @@ -19043,9 +19042,9 @@ "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==" }, "bn.js": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.1.2.tgz", - "integrity": "sha512-40rZaf3bUNKTVYu9sIeeEGOg7g14Yvnj9kH7b50EiwX0Q7A6umbvfI5tvHaOERH0XigqKkfLkFQxzb4e6CIXnA==" + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.1.3.tgz", + "integrity": "sha512-GkTiFpjFtUzU9CbMeJ5iazkCzGL3jrhzerzZIuqLABjbwRaFt33I9tUdSNryIptM+RxDet6OKm2WnLXzW51KsQ==" }, "body-parser": { "version": "1.19.0", @@ -19401,9 +19400,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001113", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001113.tgz", - "integrity": "sha512-qMvjHiKH21zzM/VDZr6oosO6Ri3U0V2tC015jRXjOecwQCJtsU5zklTNTk31jQbIOP8gha0h1ccM/g0ECP+4BA==" + "version": "1.0.30001117", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001117.tgz", + "integrity": "sha512-4tY0Fatzdx59kYjQs+bNxUwZB03ZEBgVmJ1UkFPz/Q8OLiUUbjct2EdpnXj0fvFTPej2EkbPIG0w8BWsjAyk1Q==" }, "capture-exit": { "version": "2.0.0", @@ -19908,12 +19907,12 @@ } }, "create-ecdh": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.3.tgz", - "integrity": "sha512-GbEHQPMOswGpKXM9kCWVrremUcBmjteUaQ01T9rkKCPDXfUHX0IoP9LpHYo2NPFampa4e+/pFDc3jQdxrxQLaw==", + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz", + "integrity": "sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A==", "requires": { "bn.js": "^4.1.0", - "elliptic": "^6.0.0" + "elliptic": "^6.5.3" }, "dependencies": { "bn.js": { @@ -20642,9 +20641,9 @@ "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==" }, "duplexer": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz", - "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E=" + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", + "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==" }, "duplexify": { "version": "3.7.1", @@ -20696,9 +20695,9 @@ "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=" }, "electron-to-chromium": { - "version": "1.3.533", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.533.tgz", - "integrity": "sha512-YqAL+NXOzjBnpY+dcOKDlZybJDCOzgsq4koW3fvyty/ldTmsb4QazZpOWmVvZ2m0t5jbBf7L0lIGU3BUipwG+A==" + "version": "1.3.544", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.544.tgz", + "integrity": "sha512-jx6H7M1db76Q/dI3MadZC4qwNTvpiq8tdYEJswxexrIm5bH+LKRdg+VAteMF1tJJbBLrcuogE9N3nxT3Dp1gag==" }, "elliptic": { "version": "6.5.3", @@ -21361,9 +21360,9 @@ "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc=" }, "eventemitter3": { - "version": "4.0.4", - "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz", - "integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==" + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.5.tgz", + "integrity": "sha512-QR0rh0YiPuxuDQ6+T9GAO/xWTExXpxIes1Nl9RykNGTnE1HJmkuEfxJH9cubjIOQZ/GH4qNBR4u8VSHaKiWs4g==" }, "events": { "version": "3.2.0", @@ -21530,9 +21529,9 @@ }, "dependencies": { "type": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/type/-/type-2.0.0.tgz", - "integrity": "sha512-KBt58xCHry4Cejnc2ISQAF7QY+ORngsWfxezO68+12hKV6lQY8P/psIkcbjeHWn7MqcgciWJyCCevFMJdIXpow==" + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/type/-/type-2.1.0.tgz", + "integrity": "sha512-G9absDWvhAWCV2gmF1zKud3OyC61nZDwWvBL2DApaVFogI07CprggiQAOOjvp2NRjYWFzPyu7vwtDrQFq8jeSA==" } } }, @@ -22872,6 +22871,11 @@ "is-extglob": "^2.1.1" } }, + "is-negative-zero": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.0.tgz", + "integrity": "sha1-lVOxIbD6wohp2p7UWeIMdUN4hGE=" + }, "is-number": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz", @@ -23660,6 +23664,11 @@ "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz", "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==" }, + "json-parse-even-better-errors": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.0.tgz", + "integrity": "sha512-o3aP+RsWDJZayj1SbHNQAI8x0v3T3SKiGoZlNYfbUP1S3omJQ6i9CnqADqkSPaOAxwua4/1YWx5CM7oiChJt2Q==" + }, "json-schema": { "version": "0.2.3", "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz", @@ -24739,17 +24748,17 @@ } }, "onetime": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.0.tgz", - "integrity": "sha512-5NcSkPHhwTVFIQN+TUqXoS5+dlElHXdpAWu9I0HP20YOtIi+aZ0Ct82jdlILDxjLEAWwvm+qj1m6aEtsDVmm6Q==", + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz", + "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==", "requires": { "mimic-fn": "^2.1.0" } }, "open": { - "version": "7.1.0", - "resolved": "https://registry.npmjs.org/open/-/open-7.1.0.tgz", - "integrity": "sha512-lLPI5KgOwEYCDKXf4np7y1PBEkj7HYIyP2DY8mVDRnx0VIIu6bNrRB0R66TuO7Mack6EnTNLm4uvcl1UoklTpA==", + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/open/-/open-7.2.0.tgz", + "integrity": "sha512-4HeyhxCvBTI5uBePsAdi55C5fmqnWZ2e2MlmvWi5KW5tdH5rxoiv/aMtbeVxKZc3eWkT1GymMnLG8XC4Rq4TDQ==", "requires": { "is-docker": "^2.0.0", "is-wsl": "^2.1.1" @@ -24932,13 +24941,12 @@ } }, "parse-asn1": { - "version": "5.1.5", - "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.5.tgz", - "integrity": "sha512-jkMYn1dcJqF6d5CpU689bq7w/b5ALS9ROVSpQDPrZsqqesUJii9qutvoT5ltGedNXMO2e16YUWIghG9KxaViTQ==", + "version": "5.1.6", + "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.6.tgz", + "integrity": "sha512-RnZRo1EPU6JBnra2vGHj0yhp6ebyjBZpmUCLHWiFhxlzvBCCpAuZ7elsBp1PVAbQN0/04VD/19rfzlBSwLstMw==", "requires": { - "asn1.js": "^4.0.0", + "asn1.js": "^5.2.0", "browserify-aes": "^1.0.0", - "create-hash": "^1.1.0", "evp_bytestokey": "^1.0.0", "pbkdf2": "^3.0.3", "safe-buffer": "^5.1.1" @@ -25175,9 +25183,9 @@ } }, "postcss-calc": { - "version": "7.0.2", - "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-7.0.2.tgz", - "integrity": "sha512-rofZFHUg6ZIrvRwPeFktv06GdbDYLcGqh9EwiMutZg+a0oePCCw1zHOEiji6LCpyRcjTREtPASuUqeAvYlEVvQ==", + "version": "7.0.3", + "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-7.0.3.tgz", + "integrity": "sha512-IB/EAEmZhIMEIhG7Ov4x+l47UaXOS1n2f4FBUk/aKllQhtSCxWhTzn0nJgkqN7fo/jcWySvWTSB6Syk9L+31bA==", "requires": { "postcss": "^7.0.27", "postcss-selector-parser": "^6.0.2", @@ -26250,9 +26258,9 @@ "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM=" }, "querystringify": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.1.tgz", - "integrity": "sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA==" + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", + "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==" }, "raf": { "version": "3.4.1", @@ -27305,12 +27313,33 @@ "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==" }, "side-channel": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.2.tgz", - "integrity": "sha512-7rL9YlPHg7Ancea1S96Pa8/QWb4BtXL/TZvS6B8XFetGBeuhAsfmUspK6DokBeZ64+Kj9TCNRD/30pVz1BvQNA==", + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.3.tgz", + "integrity": "sha512-A6+ByhlLkksFoUepsGxfj5x1gTSrs+OydsRptUxeNCabQpCFUvcwIczgOigI8vhY/OJCnPnyE9rGiwgvr9cS1g==", "requires": { - "es-abstract": "^1.17.0-next.1", - "object-inspect": "^1.7.0" + "es-abstract": "^1.18.0-next.0", + "object-inspect": "^1.8.0" + }, + "dependencies": { + "es-abstract": { + "version": "1.18.0-next.0", + "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.18.0-next.0.tgz", + "integrity": "sha512-elZXTZXKn51hUBdJjSZGYRujuzilgXo8vSPQzjGYXLvSlGiCo8VO8ZGV3kjo9a0WNJJ57hENagwbtlRuHuzkcQ==", + "requires": { + "es-to-primitive": "^1.2.1", + "function-bind": "^1.1.1", + "has": "^1.0.3", + "has-symbols": "^1.0.1", + "is-callable": "^1.2.0", + "is-negative-zero": "^2.0.0", + "is-regex": "^1.1.1", + "object-inspect": "^1.8.0", + "object-keys": "^1.1.1", + "object.assign": "^4.1.0", + "string.prototype.trimend": "^1.0.1", + "string.prototype.trimstart": "^1.0.1" + } + } } }, "signal-exit": { diff --git a/src/components/bar/bar.tsx b/src/components/bar/bar.tsx index 37e7885..61170f8 100644 --- a/src/components/bar/bar.tsx +++ b/src/components/bar/bar.tsx @@ -54,6 +54,7 @@ export const Bar: React.FC = ({ break; } } + e.stopPropagation(); }} onMouseEnter={e => { onEventStart(e, "mouseenter", task); diff --git a/src/components/gantt/gantt.module.css b/src/components/gantt/gantt.module.css index 39e74b9..66b6af4 100644 --- a/src/components/gantt/gantt.module.css +++ b/src/components/gantt/gantt.module.css @@ -17,4 +17,5 @@ padding: 0; margin: 0; list-style: none; + outline: none; } diff --git a/src/components/gantt/gantt.tsx b/src/components/gantt/gantt.tsx index 3047efc..5596b47 100644 --- a/src/components/gantt/gantt.tsx +++ b/src/components/gantt/gantt.tsx @@ -43,20 +43,66 @@ export const Gantt: React.SFC = ({ onTaskDelete, }) => { const [ganttTasks, setGanttTasks] = useState(tasks); - const [scroll, setScroll] = useState(0); + const [scrollY, setScrollY] = useState(0); const [startDate, endDate] = ganttDateRange(ganttTasks, viewMode); const dates = seedDates(startDate, endDate, viewMode); const svgHeight = rowHeight * tasks.length; const gridWidth = dates.length * columnWidth; + const ganttFullHeight = ganttTasks.length * rowHeight; const onTasksDateChange = (tasks: Task[]) => { setGanttTasks(tasks); }; const handleScroll = (event: SyntheticEvent) => { - setScroll(event.currentTarget.scrollTop); + setScrollY(event.currentTarget.scrollTop); + }; + + const handleWheel = (event: React.WheelEvent) => { + const newScrollY = scrollY + event.deltaY; + if (newScrollY < 0) { + setScrollY(0); + } else if (newScrollY > ganttFullHeight - ganttHeight) { + setScrollY(ganttFullHeight - ganttHeight); + } else { + setScrollY(scrollY + event.deltaY); + } + }; + + const handleKeyDown = (event: React.KeyboardEvent) => { + let newScrollY = 0; + let isX = true; + switch (event.key) { + case "Down": // IE/Edge specific value + case "ArrowDown": + newScrollY = scrollY + rowHeight; + isX = false; + break; + case "Up": // IE/Edge specific value + case "ArrowUp": + newScrollY = scrollY - rowHeight; + isX = false; + break; + case "ArrowLeft": + // Do something for "left arrow" key press. + break; + case "Right": // IE/Edge specific value + case "ArrowRight": + // Do something for "right arrow" key press. + break; + } + if (isX) { + } else { + if (newScrollY < 0) { + setScrollY(0); + } else if (newScrollY > ganttFullHeight - ganttHeight) { + setScrollY(ganttFullHeight - ganttHeight); + } else { + setScrollY(newScrollY); + } + } }; const gridProps: GridProps = { @@ -110,7 +156,7 @@ export const Gantt: React.SFC = ({ tasks: ganttTasks, locale, headerHeight, - scroll, + scrollY, ganttHeight, horizontalContainerClass: styles.horizontalContainer, TaskListHeader, @@ -118,19 +164,25 @@ export const Gantt: React.SFC = ({ }; return ( -
+
{listCellWidth && }
diff --git a/src/components/gantt/task-gantt-content.tsx b/src/components/gantt/task-gantt-content.tsx index 0666803..4c35283 100644 --- a/src/components/gantt/task-gantt-content.tsx +++ b/src/components/gantt/task-gantt-content.tsx @@ -19,6 +19,7 @@ export type GanttContentMoveAction = | BarMoveAction; export type BarEvent = { selectedTask?: BarTask; + originalTask?: BarTask; action: GanttContentMoveAction; }; export type TaskGanttContentProps = { @@ -143,7 +144,7 @@ export const TaskGanttContent: React.FC = ({ } } else if (action === "mouseenter") { if (!barEvent.action) { - setBarEvent({ action, selectedTask }); + setBarEvent({ action, selectedTask, originalTask: selectedTask }); } } else if (action === "mouseleave") { if (barEvent.action === "mouseenter") { @@ -156,13 +157,14 @@ export const TaskGanttContent: React.FC = ({ svg.current.getScreenCTM()?.inverse() ); setInitEventX1Delta(cursor.x - selectedTask.x1); - setBarEvent({ action, selectedTask }); + setBarEvent({ action, selectedTask, originalTask: selectedTask }); } else if (action === "dblclick") { !!onDoubleClick && onDoubleClick(selectedTask); } else { setBarEvent({ action, selectedTask, + originalTask: selectedTask, }); } }; @@ -194,8 +196,9 @@ export const TaskGanttContent: React.FC = ({ }; const handleMouseUp = async (event: MouseEvent) => { - const { selectedTask, action } = barEvent; - if (!selectedTask || !point || !svg?.current) return; + const { selectedTask, action, originalTask } = barEvent; + + if (!selectedTask || !point || !svg?.current || !originalTask) return; event.preventDefault(); point.x = event.clientX; @@ -211,16 +214,23 @@ export const TaskGanttContent: React.FC = ({ timeStep, initEventX1Delta ); + + const isNotLikeOriginal = + originalTask.start !== changedTask.start || + originalTask.end !== changedTask.end || + originalTask.progress !== changedTask.progress; + if ( (action === "move" || action === "end" || action === "start") && - onDateChange + onDateChange && + isNotLikeOriginal ) { await onDateChange(changedTask); const newTasks = barTasks.map(t => t.id === changedTask.id ? changedTask : t ); onTasksDateChange(newTasks); - } else if (onProgressChange) { + } else if (onProgressChange && isNotLikeOriginal) { await onProgressChange(changedTask); } svg.current.removeEventListener("mousemove", handleMouseMove); diff --git a/src/components/gantt/task-gantt.tsx b/src/components/gantt/task-gantt.tsx index 3f8c290..a4d1d72 100644 --- a/src/components/gantt/task-gantt.tsx +++ b/src/components/gantt/task-gantt.tsx @@ -9,14 +9,14 @@ export type TaskGanttProps = { calendarProps: CalendarProps; barProps: TaskGanttContentProps; ganttHeight: number; - scroll: number; + scrollY: number; }; export const TaskGantt: React.FC = ({ gridProps, calendarProps, barProps, ganttHeight, - scroll, + scrollY, }) => { const ganttSVGRef = useRef(null); const horizontalContainerRef = useRef(null); @@ -24,9 +24,9 @@ export const TaskGantt: React.FC = ({ useEffect(() => { if (horizontalContainerRef.current) { - horizontalContainerRef.current.scrollTop = scroll; + horizontalContainerRef.current.scrollTop = scrollY; } - }, [scroll]); + }, [scrollY]); return (
diff --git a/src/components/other/scroll.tsx b/src/components/other/scroll.tsx index bec2f16..49c5563 100644 --- a/src/components/other/scroll.tsx +++ b/src/components/other/scroll.tsx @@ -1,17 +1,27 @@ -import React, { SyntheticEvent } from "react"; +import React, { SyntheticEvent, useRef, useEffect } from "react"; import styles from "./scroll.module.css"; export const Scroll: React.FC<{ + scroll: number; ganttHeight: number; ganttFullHeight: number; headerHeight: number; onScroll: (event: SyntheticEvent) => void; -}> = ({ ganttHeight, ganttFullHeight, headerHeight, onScroll }) => { +}> = ({ scroll, ganttHeight, ganttFullHeight, headerHeight, onScroll }) => { + const scrollRef = useRef(null); + + useEffect(() => { + if (scrollRef.current) { + scrollRef.current.scrollTop = scroll; + } + }, [scroll]); + return (
diff --git a/src/components/task-list/task-list.tsx b/src/components/task-list/task-list.tsx index 92ee29f..0b86c83 100644 --- a/src/components/task-list/task-list.tsx +++ b/src/components/task-list/task-list.tsx @@ -8,7 +8,7 @@ export type TaskListProps = { fontSize: string; rowHeight: number; ganttHeight: number; - scroll: number; + scrollY: number; locale: string; tasks: Task[]; horizontalContainerClass?: string; @@ -34,7 +34,7 @@ export const TaskList: React.FC = ({ fontSize, rowWidth, rowHeight, - scroll, + scrollY, tasks, locale, ganttHeight, @@ -45,9 +45,9 @@ export const TaskList: React.FC = ({ const horizontalContainerRef = useRef(null); useEffect(() => { if (horizontalContainerRef.current) { - horizontalContainerRef.current.scrollTop = scroll; + horizontalContainerRef.current.scrollTop = scrollY; } - }, [scroll]); + }, [scrollY]); const headerProps = { headerHeight,