diff --git a/viewer/package-lock.json b/viewer/package-lock.json
index 5d71f3b..c77b8c9 100644
--- a/viewer/package-lock.json
+++ b/viewer/package-lock.json
@@ -10,19 +10,19 @@
"eventemitter3": "^4.0.7",
"memoize-one": "^5.2.1",
"prop-types": "^15.7.2",
- "react": "^17.0.2",
- "react-dom": "^17.0.2",
+ "react": "^18.1.0",
+ "react-dom": "^18.1.0",
"react-icons": "^4.2.0",
- "react-redux": "^7.2.5",
- "redux": "^4.1.1",
+ "react-redux": "^8.0.1",
+ "redux": "^4.2.0",
"redux-saga": "^1.1.3",
"redux-thunk": "^2.3.0",
"reselect": "^4.0.0",
- "styled-components": "^5.3.1"
+ "styled-components": "^5.3.5"
},
"devDependencies": {
"@craco/craco": "^6.3.0",
- "babel-plugin-styled-components": "^1.13.2",
+ "babel-plugin-styled-components": "^2.0.7",
"cypress": "^8.3.1",
"npm-run-all": "^4.1.5",
"react-scripts": "^4.0.3"
@@ -101,11 +101,11 @@
}
},
"node_modules/@babel/helper-annotate-as-pure": {
- "version": "7.14.5",
- "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.14.5.tgz",
- "integrity": "sha512-EivH9EgBIb+G8ij1B2jAwSH36WnGvkQSEC6CkX/6v6ZFlw5fVOHvsgGF4uiEHO2GzMvunZb6tDLQEQSdrdocrA==",
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz",
+ "integrity": "sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==",
"dependencies": {
- "@babel/types": "^7.14.5"
+ "@babel/types": "^7.16.7"
},
"engines": {
"node": ">=6.9.0"
@@ -275,11 +275,11 @@
}
},
"node_modules/@babel/helper-module-imports": {
- "version": "7.14.5",
- "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.14.5.tgz",
- "integrity": "sha512-SwrNHu5QWS84XlHwGYPDtCxcA0hrSlL2yhWYLgeOc0w7ccOl2qv4s/nARI0aYZW+bSwAL5CukeXA47B/1NKcnQ==",
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz",
+ "integrity": "sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==",
"dependencies": {
- "@babel/types": "^7.14.5"
+ "@babel/types": "^7.16.7"
},
"engines": {
"node": ">=6.9.0"
@@ -390,9 +390,9 @@
}
},
"node_modules/@babel/helper-validator-identifier": {
- "version": "7.14.9",
- "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz",
- "integrity": "sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g==",
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz",
+ "integrity": "sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==",
"engines": {
"node": ">=6.9.0"
}
@@ -1895,11 +1895,11 @@
}
},
"node_modules/@babel/types": {
- "version": "7.15.0",
- "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.0.tgz",
- "integrity": "sha512-OBvfqnllOIdX4ojTHpwZbpvz4j3EWyjkZEdmjH0/cgsd6QOdSgU8rLSk6ard/pcW7rlmjdVSX/AWOaORR1uNOQ==",
+ "version": "7.18.0",
+ "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.18.0.tgz",
+ "integrity": "sha512-vhAmLPAiC8j9K2GnsnLPCIH5wCrPpYIVBCWRBFDCB7Y/BXLqi/O+1RSTTM2bsmg6U/551+FCf9PNPxjABmxHTw==",
"dependencies": {
- "@babel/helper-validator-identifier": "^7.14.9",
+ "@babel/helper-validator-identifier": "^7.16.7",
"to-fast-properties": "^2.0.0"
},
"engines": {
@@ -2023,17 +2023,17 @@
}
},
"node_modules/@emotion/is-prop-valid": {
- "version": "0.8.8",
- "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
- "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
+ "version": "1.1.2",
+ "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz",
+ "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==",
"dependencies": {
- "@emotion/memoize": "0.7.4"
+ "@emotion/memoize": "^0.7.4"
}
},
"node_modules/@emotion/memoize": {
- "version": "0.7.4",
- "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
- "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
+ "version": "0.7.5",
+ "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz",
+ "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ=="
},
"node_modules/@emotion/stylis": {
"version": "0.8.5",
@@ -3154,9 +3154,9 @@
"dev": true
},
"node_modules/@types/prop-types": {
- "version": "15.7.4",
- "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
- "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+ "version": "15.7.5",
+ "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
+ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
},
"node_modules/@types/q": {
"version": "1.5.5",
@@ -3165,26 +3165,15 @@
"dev": true
},
"node_modules/@types/react": {
- "version": "17.0.18",
- "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.18.tgz",
- "integrity": "sha512-YTLgu7oS5zvSqq49X5Iue5oAbVGhgPc5Au29SJC4VeE17V6gASoOxVkUDy9pXFMRFxCWCD9fLeweNFizo3UzOg==",
+ "version": "18.0.9",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.9.tgz",
+ "integrity": "sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==",
"dependencies": {
"@types/prop-types": "*",
"@types/scheduler": "*",
"csstype": "^3.0.2"
}
},
- "node_modules/@types/react-redux": {
- "version": "7.1.18",
- "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.18.tgz",
- "integrity": "sha512-9iwAsPyJ9DLTRH+OFeIrm9cAbIj1i2ANL3sKQFATqnPWRbg+jEFXyZOKHiQK/N86pNRXbb4HRxAxo0SIX1XwzQ==",
- "dependencies": {
- "@types/hoist-non-react-statics": "^3.3.0",
- "@types/react": "*",
- "hoist-non-react-statics": "^3.3.0",
- "redux": "^4.0.0"
- }
- },
"node_modules/@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -3247,6 +3236,11 @@
"node": ">=0.10.0"
}
},
+ "node_modules/@types/use-sync-external-store": {
+ "version": "0.0.3",
+ "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
+ "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
+ },
"node_modules/@types/webpack": {
"version": "4.41.30",
"resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.30.tgz",
@@ -4486,14 +4480,15 @@
}
},
"node_modules/babel-plugin-styled-components": {
- "version": "1.13.2",
- "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.13.2.tgz",
- "integrity": "sha512-Vb1R3d4g+MUfPQPVDMCGjm3cDocJEUTR7Xq7QS95JWWeksN1wdFRYpD2kulDgI3Huuaf1CZd+NK4KQmqUFh5dA==",
+ "version": "2.0.7",
+ "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.7.tgz",
+ "integrity": "sha512-i7YhvPgVqRKfoQ66toiZ06jPNA3p6ierpfUuEWxNF+fV27Uv5gxBkf8KZLHUCc1nFA9j6+80pYoIpqCeyW3/bA==",
"dependencies": {
- "@babel/helper-annotate-as-pure": "^7.0.0",
- "@babel/helper-module-imports": "^7.0.0",
+ "@babel/helper-annotate-as-pure": "^7.16.0",
+ "@babel/helper-module-imports": "^7.16.0",
"babel-plugin-syntax-jsx": "^6.18.0",
- "lodash": "^4.17.11"
+ "lodash": "^4.17.11",
+ "picomatch": "^2.3.0"
},
"peerDependencies": {
"styled-components": ">= 2"
@@ -4502,7 +4497,7 @@
"node_modules/babel-plugin-syntax-jsx": {
"version": "6.18.0",
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
- "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
+ "integrity": "sha512-qrPaCSo9c8RHNRHIotaufGbuOBN8rtdC4QrrFFc43vyWCCz7Kl7GL1PGaXtMGQZUXrkCjNEgxDfmAuAabr/rlw=="
},
"node_modules/babel-plugin-syntax-object-rest-spread": {
"version": "6.13.0",
@@ -6815,9 +6810,9 @@
"dev": true
},
"node_modules/csstype": {
- "version": "3.0.8",
- "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.8.tgz",
- "integrity": "sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw=="
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz",
+ "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA=="
},
"node_modules/cyclist": {
"version": "1.0.1",
@@ -14850,7 +14845,6 @@
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
"integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
- "dev": true,
"engines": {
"node": ">=8.6"
},
@@ -16844,12 +16838,11 @@
}
},
"node_modules/react": {
- "version": "17.0.2",
- "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
- "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz",
+ "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==",
"dependencies": {
- "loose-envify": "^1.1.0",
- "object-assign": "^4.1.1"
+ "loose-envify": "^1.1.0"
},
"engines": {
"node": ">=0.10.0"
@@ -17106,16 +17099,15 @@
}
},
"node_modules/react-dom": {
- "version": "17.0.2",
- "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
- "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz",
+ "integrity": "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==",
"dependencies": {
"loose-envify": "^1.1.0",
- "object-assign": "^4.1.1",
- "scheduler": "^0.20.2"
+ "scheduler": "^0.22.0"
},
"peerDependencies": {
- "react": "17.0.2"
+ "react": "^18.1.0"
}
},
"node_modules/react-error-overlay": {
@@ -17138,33 +17130,47 @@
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
},
"node_modules/react-redux": {
- "version": "7.2.5",
- "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.5.tgz",
- "integrity": "sha512-Dt29bNyBsbQaysp6s/dN0gUodcq+dVKKER8Qv82UrpeygwYeX1raTtil7O/fftw/rFqzaf6gJhDZRkkZnn6bjg==",
+ "version": "8.0.1",
+ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.1.tgz",
+ "integrity": "sha512-LMZMsPY4DYdZfLJgd7i79n5Kps5N9XVLCJJeWAaPYTV+Eah2zTuBjTxKtNEbjiyitbq80/eIkm55CYSLqAub3w==",
"dependencies": {
"@babel/runtime": "^7.12.1",
- "@types/react-redux": "^7.1.16",
+ "@types/hoist-non-react-statics": "^3.3.1",
+ "@types/use-sync-external-store": "^0.0.3",
"hoist-non-react-statics": "^3.3.2",
- "loose-envify": "^1.4.0",
- "prop-types": "^15.7.2",
- "react-is": "^16.13.1"
+ "react-is": "^18.0.0",
+ "use-sync-external-store": "^1.0.0"
},
"peerDependencies": {
- "react": "^16.8.3 || ^17"
+ "@types/react": "^16.8 || ^17.0 || ^18.0",
+ "@types/react-dom": "^16.8 || ^17.0 || ^18.0",
+ "react": "^16.8 || ^17.0 || ^18.0",
+ "react-dom": "^16.8 || ^17.0 || ^18.0",
+ "react-native": ">=0.59",
+ "redux": "^4"
},
"peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ },
+ "@types/react-dom": {
+ "optional": true
+ },
"react-dom": {
"optional": true
},
"react-native": {
"optional": true
+ },
+ "redux": {
+ "optional": true
}
}
},
"node_modules/react-redux/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=="
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.1.0.tgz",
+ "integrity": "sha512-Fl7FuabXsJnV5Q1qIOQwx/sagGF18kogb4gpfcG4gjLBWO0WDiiz1ko/ExayuxE7InyQkBLkxRFG5oxY6Uu3Kg=="
},
"node_modules/react-refresh": {
"version": "0.8.3",
@@ -17546,9 +17552,9 @@
}
},
"node_modules/redux": {
- "version": "4.1.1",
- "resolved": "https://registry.npmjs.org/redux/-/redux-4.1.1.tgz",
- "integrity": "sha512-hZQZdDEM25UY2P493kPYuKqviVwZ58lEmGQNeQ+gXa+U0gYPUBf7NKYazbe3m+bs/DzM/ahN12DbF+NG8i0CWw==",
+ "version": "4.2.0",
+ "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.0.tgz",
+ "integrity": "sha512-oSBmcKKIuIR4ME29/AeNUnl5L+hvBq7OaJWzaptTQJAntaPvxIJqfnjbaEiCzzaIz+XmVILfqAM3Ob0aXLPfjA==",
"dependencies": {
"@babel/runtime": "^7.9.2"
}
@@ -18580,12 +18586,11 @@
}
},
"node_modules/scheduler": {
- "version": "0.20.2",
- "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
- "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+ "version": "0.22.0",
+ "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz",
+ "integrity": "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==",
"dependencies": {
- "loose-envify": "^1.1.0",
- "object-assign": "^4.1.1"
+ "loose-envify": "^1.1.0"
}
},
"node_modules/schema-utils": {
@@ -19782,13 +19787,14 @@
}
},
"node_modules/styled-components": {
- "version": "5.3.1",
- "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.1.tgz",
- "integrity": "sha512-JThv2JRzyH0NOIURrk9iskdxMSAAtCfj/b2Sf1WJaCUsloQkblepy1jaCLX/bYE+mhYo3unmwVSI9I5d9ncSiQ==",
+ "version": "5.3.5",
+ "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.5.tgz",
+ "integrity": "sha512-ndETJ9RKaaL6q41B69WudeqLzOpY1A/ET/glXkNZ2T7dPjPqpPCXXQjDFYZWwNnE5co0wX+gTCqx9mfxTmSIPg==",
+ "hasInstallScript": true,
"dependencies": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/traverse": "^7.4.5",
- "@emotion/is-prop-valid": "^0.8.8",
+ "@emotion/is-prop-valid": "^1.1.0",
"@emotion/stylis": "^0.8.4",
"@emotion/unitless": "^0.7.4",
"babel-plugin-styled-components": ">= 1.12.0",
@@ -21075,6 +21081,14 @@
"node": ">=0.10.0"
}
},
+ "node_modules/use-sync-external-store": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.1.0.tgz",
+ "integrity": "sha512-SEnieB2FPKEVne66NpXPd1Np4R1lTNKfjuy3XdIoPQKYBAFdzbzSZlSn1KJZUiihQLQC5Znot4SBz1EOTBwQAQ==",
+ "peerDependencies": {
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+ }
+ },
"node_modules/util": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz",
@@ -23281,11 +23295,11 @@
}
},
"@babel/helper-annotate-as-pure": {
- "version": "7.14.5",
- "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.14.5.tgz",
- "integrity": "sha512-EivH9EgBIb+G8ij1B2jAwSH36WnGvkQSEC6CkX/6v6ZFlw5fVOHvsgGF4uiEHO2GzMvunZb6tDLQEQSdrdocrA==",
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz",
+ "integrity": "sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==",
"requires": {
- "@babel/types": "^7.14.5"
+ "@babel/types": "^7.16.7"
}
},
"@babel/helper-builder-binary-assignment-operator-visitor": {
@@ -23411,11 +23425,11 @@
}
},
"@babel/helper-module-imports": {
- "version": "7.14.5",
- "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.14.5.tgz",
- "integrity": "sha512-SwrNHu5QWS84XlHwGYPDtCxcA0hrSlL2yhWYLgeOc0w7ccOl2qv4s/nARI0aYZW+bSwAL5CukeXA47B/1NKcnQ==",
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz",
+ "integrity": "sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==",
"requires": {
- "@babel/types": "^7.14.5"
+ "@babel/types": "^7.16.7"
}
},
"@babel/helper-module-transforms": {
@@ -23499,9 +23513,9 @@
}
},
"@babel/helper-validator-identifier": {
- "version": "7.14.9",
- "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz",
- "integrity": "sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g=="
+ "version": "7.16.7",
+ "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz",
+ "integrity": "sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw=="
},
"@babel/helper-validator-option": {
"version": "7.14.5",
@@ -24527,11 +24541,11 @@
}
},
"@babel/types": {
- "version": "7.15.0",
- "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.0.tgz",
- "integrity": "sha512-OBvfqnllOIdX4ojTHpwZbpvz4j3EWyjkZEdmjH0/cgsd6QOdSgU8rLSk6ard/pcW7rlmjdVSX/AWOaORR1uNOQ==",
+ "version": "7.18.0",
+ "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.18.0.tgz",
+ "integrity": "sha512-vhAmLPAiC8j9K2GnsnLPCIH5wCrPpYIVBCWRBFDCB7Y/BXLqi/O+1RSTTM2bsmg6U/551+FCf9PNPxjABmxHTw==",
"requires": {
- "@babel/helper-validator-identifier": "^7.14.9",
+ "@babel/helper-validator-identifier": "^7.16.7",
"to-fast-properties": "^2.0.0"
}
},
@@ -24632,17 +24646,17 @@
}
},
"@emotion/is-prop-valid": {
- "version": "0.8.8",
- "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz",
- "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==",
+ "version": "1.1.2",
+ "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz",
+ "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==",
"requires": {
- "@emotion/memoize": "0.7.4"
+ "@emotion/memoize": "^0.7.4"
}
},
"@emotion/memoize": {
- "version": "0.7.4",
- "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
- "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
+ "version": "0.7.5",
+ "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz",
+ "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ=="
},
"@emotion/stylis": {
"version": "0.8.5",
@@ -25537,9 +25551,9 @@
"dev": true
},
"@types/prop-types": {
- "version": "15.7.4",
- "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
- "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+ "version": "15.7.5",
+ "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
+ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
},
"@types/q": {
"version": "1.5.5",
@@ -25548,26 +25562,15 @@
"dev": true
},
"@types/react": {
- "version": "17.0.18",
- "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.18.tgz",
- "integrity": "sha512-YTLgu7oS5zvSqq49X5Iue5oAbVGhgPc5Au29SJC4VeE17V6gASoOxVkUDy9pXFMRFxCWCD9fLeweNFizo3UzOg==",
+ "version": "18.0.9",
+ "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.9.tgz",
+ "integrity": "sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==",
"requires": {
"@types/prop-types": "*",
"@types/scheduler": "*",
"csstype": "^3.0.2"
}
},
- "@types/react-redux": {
- "version": "7.1.18",
- "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.18.tgz",
- "integrity": "sha512-9iwAsPyJ9DLTRH+OFeIrm9cAbIj1i2ANL3sKQFATqnPWRbg+jEFXyZOKHiQK/N86pNRXbb4HRxAxo0SIX1XwzQ==",
- "requires": {
- "@types/hoist-non-react-statics": "^3.3.0",
- "@types/react": "*",
- "hoist-non-react-statics": "^3.3.0",
- "redux": "^4.0.0"
- }
- },
"@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -25629,6 +25632,11 @@
}
}
},
+ "@types/use-sync-external-store": {
+ "version": "0.0.3",
+ "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
+ "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
+ },
"@types/webpack": {
"version": "4.41.30",
"resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.30.tgz",
@@ -26598,20 +26606,21 @@
}
},
"babel-plugin-styled-components": {
- "version": "1.13.2",
- "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.13.2.tgz",
- "integrity": "sha512-Vb1R3d4g+MUfPQPVDMCGjm3cDocJEUTR7Xq7QS95JWWeksN1wdFRYpD2kulDgI3Huuaf1CZd+NK4KQmqUFh5dA==",
+ "version": "2.0.7",
+ "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.7.tgz",
+ "integrity": "sha512-i7YhvPgVqRKfoQ66toiZ06jPNA3p6ierpfUuEWxNF+fV27Uv5gxBkf8KZLHUCc1nFA9j6+80pYoIpqCeyW3/bA==",
"requires": {
- "@babel/helper-annotate-as-pure": "^7.0.0",
- "@babel/helper-module-imports": "^7.0.0",
+ "@babel/helper-annotate-as-pure": "^7.16.0",
+ "@babel/helper-module-imports": "^7.16.0",
"babel-plugin-syntax-jsx": "^6.18.0",
- "lodash": "^4.17.11"
+ "lodash": "^4.17.11",
+ "picomatch": "^2.3.0"
}
},
"babel-plugin-syntax-jsx": {
"version": "6.18.0",
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
- "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
+ "integrity": "sha512-qrPaCSo9c8RHNRHIotaufGbuOBN8rtdC4QrrFFc43vyWCCz7Kl7GL1PGaXtMGQZUXrkCjNEgxDfmAuAabr/rlw=="
},
"babel-plugin-syntax-object-rest-spread": {
"version": "6.13.0",
@@ -28512,9 +28521,9 @@
}
},
"csstype": {
- "version": "3.0.8",
- "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.8.tgz",
- "integrity": "sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw=="
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz",
+ "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA=="
},
"cyclist": {
"version": "1.0.1",
@@ -34819,8 +34828,7 @@
"picomatch": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
- "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
- "dev": true
+ "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw=="
},
"pidtree": {
"version": "0.3.1",
@@ -36460,12 +36468,11 @@
}
},
"react": {
- "version": "17.0.2",
- "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
- "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react/-/react-18.1.0.tgz",
+ "integrity": "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==",
"requires": {
- "loose-envify": "^1.1.0",
- "object-assign": "^4.1.1"
+ "loose-envify": "^1.1.0"
}
},
"react-app-polyfill": {
@@ -36667,13 +36674,12 @@
}
},
"react-dom": {
- "version": "17.0.2",
- "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
- "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz",
+ "integrity": "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==",
"requires": {
"loose-envify": "^1.1.0",
- "object-assign": "^4.1.1",
- "scheduler": "^0.20.2"
+ "scheduler": "^0.22.0"
}
},
"react-error-overlay": {
@@ -36694,22 +36700,22 @@
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
},
"react-redux": {
- "version": "7.2.5",
- "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.5.tgz",
- "integrity": "sha512-Dt29bNyBsbQaysp6s/dN0gUodcq+dVKKER8Qv82UrpeygwYeX1raTtil7O/fftw/rFqzaf6gJhDZRkkZnn6bjg==",
+ "version": "8.0.1",
+ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.1.tgz",
+ "integrity": "sha512-LMZMsPY4DYdZfLJgd7i79n5Kps5N9XVLCJJeWAaPYTV+Eah2zTuBjTxKtNEbjiyitbq80/eIkm55CYSLqAub3w==",
"requires": {
"@babel/runtime": "^7.12.1",
- "@types/react-redux": "^7.1.16",
+ "@types/hoist-non-react-statics": "^3.3.1",
+ "@types/use-sync-external-store": "^0.0.3",
"hoist-non-react-statics": "^3.3.2",
- "loose-envify": "^1.4.0",
- "prop-types": "^15.7.2",
- "react-is": "^16.13.1"
+ "react-is": "^18.0.0",
+ "use-sync-external-store": "^1.0.0"
},
"dependencies": {
"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=="
+ "version": "18.1.0",
+ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.1.0.tgz",
+ "integrity": "sha512-Fl7FuabXsJnV5Q1qIOQwx/sagGF18kogb4gpfcG4gjLBWO0WDiiz1ko/ExayuxE7InyQkBLkxRFG5oxY6Uu3Kg=="
}
}
},
@@ -36991,9 +36997,9 @@
}
},
"redux": {
- "version": "4.1.1",
- "resolved": "https://registry.npmjs.org/redux/-/redux-4.1.1.tgz",
- "integrity": "sha512-hZQZdDEM25UY2P493kPYuKqviVwZ58lEmGQNeQ+gXa+U0gYPUBf7NKYazbe3m+bs/DzM/ahN12DbF+NG8i0CWw==",
+ "version": "4.2.0",
+ "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.0.tgz",
+ "integrity": "sha512-oSBmcKKIuIR4ME29/AeNUnl5L+hvBq7OaJWzaptTQJAntaPvxIJqfnjbaEiCzzaIz+XmVILfqAM3Ob0aXLPfjA==",
"requires": {
"@babel/runtime": "^7.9.2"
}
@@ -37813,12 +37819,11 @@
}
},
"scheduler": {
- "version": "0.20.2",
- "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
- "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+ "version": "0.22.0",
+ "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz",
+ "integrity": "sha512-6QAm1BgQI88NPYymgGQLCZgvep4FyePDWFpXVK+zNSUgHwlqpJy8VEh8Et0KxTACS4VWwMousBElAZOH9nkkoQ==",
"requires": {
- "loose-envify": "^1.1.0",
- "object-assign": "^4.1.1"
+ "loose-envify": "^1.1.0"
}
},
"schema-utils": {
@@ -38822,13 +38827,13 @@
}
},
"styled-components": {
- "version": "5.3.1",
- "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.1.tgz",
- "integrity": "sha512-JThv2JRzyH0NOIURrk9iskdxMSAAtCfj/b2Sf1WJaCUsloQkblepy1jaCLX/bYE+mhYo3unmwVSI9I5d9ncSiQ==",
+ "version": "5.3.5",
+ "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.5.tgz",
+ "integrity": "sha512-ndETJ9RKaaL6q41B69WudeqLzOpY1A/ET/glXkNZ2T7dPjPqpPCXXQjDFYZWwNnE5co0wX+gTCqx9mfxTmSIPg==",
"requires": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/traverse": "^7.4.5",
- "@emotion/is-prop-valid": "^0.8.8",
+ "@emotion/is-prop-valid": "^1.1.0",
"@emotion/stylis": "^0.8.4",
"@emotion/unitless": "^0.7.4",
"babel-plugin-styled-components": ">= 1.12.0",
@@ -39840,6 +39845,12 @@
"integrity": "sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==",
"dev": true
},
+ "use-sync-external-store": {
+ "version": "1.1.0",
+ "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.1.0.tgz",
+ "integrity": "sha512-SEnieB2FPKEVne66NpXPd1Np4R1lTNKfjuy3XdIoPQKYBAFdzbzSZlSn1KJZUiihQLQC5Znot4SBz1EOTBwQAQ==",
+ "requires": {}
+ },
"util": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz",
diff --git a/viewer/package.json b/viewer/package.json
index 723ad65..59e5188 100644
--- a/viewer/package.json
+++ b/viewer/package.json
@@ -5,7 +5,7 @@
"cracoConfig": "craco.config.cjs",
"devDependencies": {
"@craco/craco": "^6.3.0",
- "babel-plugin-styled-components": "^1.13.2",
+ "babel-plugin-styled-components": "^2.0.7",
"cypress": "^8.3.1",
"npm-run-all": "^4.1.5",
"react-scripts": "^4.0.3"
@@ -15,15 +15,15 @@
"eventemitter3": "^4.0.7",
"memoize-one": "^5.2.1",
"prop-types": "^15.7.2",
- "react": "^17.0.2",
- "react-dom": "^17.0.2",
+ "react": "^18.1.0",
+ "react-dom": "^18.1.0",
"react-icons": "^4.2.0",
- "react-redux": "^7.2.5",
- "redux": "^4.1.1",
+ "react-redux": "^8.0.1",
+ "redux": "^4.2.0",
"redux-saga": "^1.1.3",
"redux-thunk": "^2.3.0",
"reselect": "^4.0.0",
- "styled-components": "^5.3.1"
+ "styled-components": "^5.3.5"
},
"scripts": {
"test:open": "cypress open",
diff --git a/viewer/src/DjVuViewer.js b/viewer/src/DjVuViewer.js
index 8feb9dd..1d56c25 100644
--- a/viewer/src/DjVuViewer.js
+++ b/viewer/src/DjVuViewer.js
@@ -1,5 +1,5 @@
import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
import { Provider } from 'react-redux'
import App from './components/App.jsx';
import Actions from './actions/actions';
@@ -40,7 +40,7 @@ export default class DjVuViewer extends EventEmitter {
if (process.env.NODE_ENV === 'development') { // because CRA's Fast Refresh works bad
if (module.hot) {
module.hot.accept('./components/App', () => {
- this._render(this.htmlElement);
+ this._render();
});
}
}
@@ -89,25 +89,26 @@ export default class DjVuViewer extends EventEmitter {
return get.fileName(this.store.getState());
}
- _render(element) {
- ReactDOM.render(
+ _render() {
+ this.reactRoot.render(
-
+
- , element
);
}
render(element) {
this.unmount();
this.htmlElement = element;
+ this.reactRoot = createRoot(element);
//this.shadow = element.attachShadow({ mode: 'open' });
- this._render(this.htmlElement);
+ this._render();
}
unmount() {
- this.htmlElement && ReactDOM.unmountComponentAtNode(this.htmlElement);
+ this.reactRoot && this.reactRoot.unmount();
+ this.reactRoot = null;
this.htmlElement = null;
}
diff --git a/viewer/src/components/Toolbar/PageNumber.jsx b/viewer/src/components/Toolbar/PageNumber.jsx
index a65bb90..7d39edb 100644
--- a/viewer/src/components/Toolbar/PageNumber.jsx
+++ b/viewer/src/components/Toolbar/PageNumber.jsx
@@ -1,19 +1,36 @@
import React from 'react';
import PropTypes from 'prop-types';
-import styled, { css } from 'styled-components';
+import styled from 'styled-components';
import { styledInput } from '../cssMixins';
-const style = css`
- flex: 1 1 auto;
- min-width: 1em;
+const Root = styled.span`
+ flex: 0 0 auto;
+ min-width: 4em;
max-width: 8em;
+ height: 90%;
+ line-height: normal;
+ box-sizing: border-box;
white-space: nowrap;
-`;
+ position: relative;
+ text-align: center;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+
+ & > * {
+ text-align: center;
+ box-sizing: border-box;
+ }
-const Input = styled.input`
- ${style};
- ${styledInput};
- max-width: 4em;
+ & > input {
+ ${styledInput};
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 1;
+ }
`;
export default class PageNumber extends React.Component {
@@ -74,7 +91,7 @@ export default class PageNumber extends React.Component {
};
- onKeyPress = (e) => {
+ onKeyDown = (e) => {
if (e.key === 'Enter') {
this.finishPageNumberEditing(e);
}
@@ -89,27 +106,25 @@ export default class PageNumber extends React.Component {
}
render() {
- if (this.state.isEditing) {
- return (
-
- );
- } else {
- var st = this.props.pagesQuantity ? " / " + this.props.pagesQuantity : "";
- return (
+ return (
+
+ {this.state.isEditing ?
+ : null}
- {this.props.pageNumber + st}
+ {this.props.pageNumber + (this.props.pagesQuantity ? " / " + this.props.pagesQuantity : "")}
- );
- }
+
+ )
}
}
\ No newline at end of file
diff --git a/viewer/src/components/Toolbar/PageNumberBlock.jsx b/viewer/src/components/Toolbar/PageNumberBlock.jsx
index f582f01..86810d4 100644
--- a/viewer/src/components/Toolbar/PageNumberBlock.jsx
+++ b/viewer/src/components/Toolbar/PageNumberBlock.jsx
@@ -17,6 +17,7 @@ const Root = styled.div`
flex-wrap: nowrap;
justify-content: center;
align-items: center;
+ height: 100%;
`;
const navButtonStyle = css`