diff --git a/package-lock.json b/package-lock.json index 1cd6eab6..b01002c0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -75,7 +75,8 @@ "socket.io": "^4.5.0", "socket.io-client": "^4.5.0", "styled-components": "5.3.3", - "swiper": "^9.0.5" + "swiper": "^9.0.5", + "tw-elements-react": "^1.0.0-alpha2" }, "devDependencies": { "@babel/eslint-parser": "^7.15.7", @@ -1988,6 +1989,26 @@ "node": ">=0.1.90" } }, + "node_modules/@cspotcode/source-map-support": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", + "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==", + "dependencies": { + "@jridgewell/trace-mapping": "0.3.9" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/@cspotcode/source-map-support/node_modules/@jridgewell/trace-mapping": { + "version": "0.3.9", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz", + "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==", + "dependencies": { + "@jridgewell/resolve-uri": "^3.0.3", + "@jridgewell/sourcemap-codec": "^1.4.10" + } + }, "node_modules/@cypress/request": { "version": "2.88.10", "license": "Apache-2.0", @@ -3099,11 +3120,11 @@ } }, "node_modules/@remix-run/router": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", - "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==", + "version": "1.13.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.13.0.tgz", + "integrity": "sha512-5dMOnVnefRsl4uRnAdoWjtVTdh8e6aZqgM4puy9nmEADH72ck+uXwzpJLEKE9Q6F8ZljNewLgmTfkxUrBdv4WA==", "engines": { - "node": ">=14" + "node": ">=14.0.0" } }, "node_modules/@rollup/plugin-alias": { @@ -3282,6 +3303,26 @@ "react-dom": "*" } }, + "node_modules/@tsconfig/node10": { + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz", + "integrity": "sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==" + }, + "node_modules/@tsconfig/node12": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz", + "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==" + }, + "node_modules/@tsconfig/node14": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz", + "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==" + }, + "node_modules/@tsconfig/node16": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz", + "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==" + }, "node_modules/@types/accepts": { "version": "1.3.5", "dev": true, @@ -3996,7 +4037,6 @@ }, "node_modules/acorn": { "version": "8.8.1", - "devOptional": true, "license": "MIT", "bin": { "acorn": "bin/acorn" @@ -4013,6 +4053,14 @@ "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" } }, + "node_modules/acorn-walk": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz", + "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==", + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/agent-base": { "version": "5.1.1", "dev": true, @@ -5139,6 +5187,19 @@ "node": ">=4" } }, + "node_modules/chart.js": { + "version": "3.9.1", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.9.1.tgz", + "integrity": "sha512-Ro2JbLmvg83gXF5F4sniaQ+lTbSv18E+TIf2cOeiH1Iqd2PGFOtem+DUufMZsCJwFE7ywPOpfXFBwRTGq7dh6w==" + }, + "node_modules/chartjs-plugin-datalabels": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/chartjs-plugin-datalabels/-/chartjs-plugin-datalabels-2.2.0.tgz", + "integrity": "sha512-14ZU30lH7n89oq+A4bWaJPnAG8a7ZTk7dKf48YAzMvJjQtjrgg5Dpk9f+LbjCF6bpx3RAGTeL13IXpKQYyRvlw==", + "peerDependencies": { + "chart.js": ">=3.0.0" + } + }, "node_modules/check-error": { "version": "1.0.2", "dev": true, @@ -5648,6 +5709,11 @@ "node": ">=10" } }, + "node_modules/create-require": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", + "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==" + }, "node_modules/crelt": { "version": "1.0.5", "license": "MIT" @@ -6439,9 +6505,9 @@ "license": "MIT" }, "node_modules/deepmerge": { - "version": "4.2.2", - "dev": true, - "license": "MIT", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", + "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", "engines": { "node": ">=0.10.0" } @@ -10101,6 +10167,11 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/make-error": { + "version": "1.3.6", + "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz", + "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==" + }, "node_modules/map-cache": { "version": "0.2.2", "license": "MIT", @@ -11829,6 +11900,20 @@ "react-dom": ">0.13.0" } }, + "node_modules/react-popper": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", + "integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==", + "dependencies": { + "react-fast-compare": "^3.0.1", + "warning": "^4.0.2" + }, + "peerDependencies": { + "@popperjs/core": "^2.0.0", + "react": "^16.8.0 || ^17 || ^18", + "react-dom": "^16.8.0 || ^17 || ^18" + } + }, "node_modules/react-remove-scroll": { "version": "2.5.6", "resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.5.6.tgz", @@ -11875,29 +11960,29 @@ } }, "node_modules/react-router": { - "version": "6.10.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", - "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.20.0.tgz", + "integrity": "sha512-pVvzsSsgUxxtuNfTHC4IxjATs10UaAtvLGVSA1tbUE4GDaOSU1Esu2xF5nWLz7KPiMuW8BJWuPFdlGYJ7/rW0w==", "dependencies": { - "@remix-run/router": "1.5.0" + "@remix-run/router": "1.13.0" }, "engines": { - "node": ">=14" + "node": ">=14.0.0" }, "peerDependencies": { "react": ">=16.8" } }, "node_modules/react-router-dom": { - "version": "6.10.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", - "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.20.0.tgz", + "integrity": "sha512-CbcKjEyiSVpA6UtCHOIYLUYn/UJfwzp55va4yEfpk7JBN3GPqWfHrdLkAvNCcpXr8QoihcDMuk0dzWZxtlB/mQ==", "dependencies": { - "@remix-run/router": "1.5.0", - "react-router": "6.10.0" + "@remix-run/router": "1.13.0", + "react-router": "6.20.0" }, "engines": { - "node": ">=14" + "node": ">=14.0.0" }, "peerDependencies": { "react": ">=16.8", @@ -13734,6 +13819,61 @@ "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==" }, + "node_modules/ts-node": { + "version": "10.9.1", + "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.1.tgz", + "integrity": "sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==", + "dependencies": { + "@cspotcode/source-map-support": "^0.8.0", + "@tsconfig/node10": "^1.0.7", + "@tsconfig/node12": "^1.0.7", + "@tsconfig/node14": "^1.0.0", + "@tsconfig/node16": "^1.0.2", + "acorn": "^8.4.1", + "acorn-walk": "^8.1.1", + "arg": "^4.1.0", + "create-require": "^1.1.0", + "diff": "^4.0.1", + "make-error": "^1.1.1", + "v8-compile-cache-lib": "^3.0.1", + "yn": "3.1.1" + }, + "bin": { + "ts-node": "dist/bin.js", + "ts-node-cwd": "dist/bin-cwd.js", + "ts-node-esm": "dist/bin-esm.js", + "ts-node-script": "dist/bin-script.js", + "ts-node-transpile-only": "dist/bin-transpile.js", + "ts-script": "dist/bin-script-deprecated.js" + }, + "peerDependencies": { + "@swc/core": ">=1.2.50", + "@swc/wasm": ">=1.2.50", + "@types/node": "*", + "typescript": ">=2.7" + }, + "peerDependenciesMeta": { + "@swc/core": { + "optional": true + }, + "@swc/wasm": { + "optional": true + } + } + }, + "node_modules/ts-node/node_modules/arg": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz", + "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==" + }, + "node_modules/ts-node/node_modules/diff": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", + "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", + "engines": { + "node": ">=0.3.1" + } + }, "node_modules/tsconfig-paths": { "version": "3.14.1", "dev": true, @@ -13780,6 +13920,22 @@ "node": "*" } }, + "node_modules/tw-elements-react": { + "version": "1.0.0-alpha2", + "resolved": "https://registry.npmjs.org/tw-elements-react/-/tw-elements-react-1.0.0-alpha2.tgz", + "integrity": "sha512-RPsc4HQXTEujQsqusl5uCBjTC+4JmYUq9FTz/tYSSGrRl1SfoPo2vxy+YLa/II/6J8cQB+iuraNK3SisJBmGmQ==", + "dependencies": { + "@popperjs/core": "^2.11.8", + "chart.js": "^3.7.1", + "chartjs-plugin-datalabels": "^2.0.0", + "deepmerge": "^4.3.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-popper": "^2.3.0", + "react-router-dom": "^6.11.1", + "ts-node": "^10.9.1" + } + }, "node_modules/tweetnacl": { "version": "0.14.5", "license": "Unlicense", @@ -13833,6 +13989,19 @@ "node": ">= 10" } }, + "node_modules/typescript": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz", + "integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==", + "peer": true, + "bin": { + "tsc": "bin/tsc", + "tsserver": "bin/tsserver" + }, + "engines": { + "node": ">=14.17" + } + }, "node_modules/typical": { "version": "4.0.0", "dev": true, @@ -14096,6 +14265,11 @@ "uuid": "dist/bin/uuid" } }, + "node_modules/v8-compile-cache-lib": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", + "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==" + }, "node_modules/v8-to-istanbul": { "version": "8.1.1", "dev": true, @@ -14271,6 +14445,14 @@ "version": "2.2.6", "license": "MIT" }, + "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/webidl-conversions": { "version": "7.0.0", "dev": true, @@ -14665,6 +14847,14 @@ "node": ">= 4.0.0" } }, + "node_modules/yn": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz", + "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==", + "engines": { + "node": ">=6" + } + }, "node_modules/yocto-queue": { "version": "0.1.0", "devOptional": true, @@ -16062,6 +16252,25 @@ "version": "1.5.0", "optional": true }, + "@cspotcode/source-map-support": { + "version": "0.8.1", + "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", + "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==", + "requires": { + "@jridgewell/trace-mapping": "0.3.9" + }, + "dependencies": { + "@jridgewell/trace-mapping": { + "version": "0.3.9", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz", + "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==", + "requires": { + "@jridgewell/resolve-uri": "^3.0.3", + "@jridgewell/sourcemap-codec": "^1.4.10" + } + } + } + }, "@cypress/request": { "version": "2.88.10", "optional": true, @@ -16756,9 +16965,9 @@ } }, "@remix-run/router": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", - "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==" + "version": "1.13.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.13.0.tgz", + "integrity": "sha512-5dMOnVnefRsl4uRnAdoWjtVTdh8e6aZqgM4puy9nmEADH72ck+uXwzpJLEKE9Q6F8ZljNewLgmTfkxUrBdv4WA==" }, "@rollup/plugin-alias": { "version": "3.1.9", @@ -16871,6 +17080,26 @@ "@testing-library/dom": "^7.28.1" } }, + "@tsconfig/node10": { + "version": "1.0.9", + "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.9.tgz", + "integrity": "sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==" + }, + "@tsconfig/node12": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz", + "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==" + }, + "@tsconfig/node14": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz", + "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==" + }, + "@tsconfig/node16": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz", + "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==" + }, "@types/accepts": { "version": "1.3.5", "dev": true, @@ -17430,14 +17659,18 @@ } }, "acorn": { - "version": "8.8.1", - "devOptional": true + "version": "8.8.1" }, "acorn-jsx": { "version": "5.3.2", "devOptional": true, "requires": {} }, + "acorn-walk": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz", + "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==" + }, "agent-base": { "version": "5.1.1", "dev": true @@ -18120,6 +18353,17 @@ "supports-color": "^5.3.0" } }, + "chart.js": { + "version": "3.9.1", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.9.1.tgz", + "integrity": "sha512-Ro2JbLmvg83gXF5F4sniaQ+lTbSv18E+TIf2cOeiH1Iqd2PGFOtem+DUufMZsCJwFE7ywPOpfXFBwRTGq7dh6w==" + }, + "chartjs-plugin-datalabels": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/chartjs-plugin-datalabels/-/chartjs-plugin-datalabels-2.2.0.tgz", + "integrity": "sha512-14ZU30lH7n89oq+A4bWaJPnAG8a7ZTk7dKf48YAzMvJjQtjrgg5Dpk9f+LbjCF6bpx3RAGTeL13IXpKQYyRvlw==", + "requires": {} + }, "check-error": { "version": "1.0.2", "dev": true @@ -18452,6 +18696,11 @@ "yaml": "^1.10.0" } }, + "create-require": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", + "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==" + }, "crelt": { "version": "1.0.5" }, @@ -19008,8 +19257,9 @@ "devOptional": true }, "deepmerge": { - "version": "4.2.2", - "dev": true + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", + "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==" }, "define-lazy-prop": { "version": "2.0.0", @@ -21287,6 +21537,11 @@ "semver": "^6.0.0" } }, + "make-error": { + "version": "1.3.6", + "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz", + "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==" + }, "map-cache": { "version": "0.2.2" }, @@ -22413,6 +22668,15 @@ "resize-observer-polyfill": "^1.5.0" } }, + "react-popper": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", + "integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==", + "requires": { + "react-fast-compare": "^3.0.1", + "warning": "^4.0.2" + } + }, "react-remove-scroll": { "version": "2.5.6", "resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.5.6.tgz", @@ -22435,20 +22699,20 @@ } }, "react-router": { - "version": "6.10.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", - "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.20.0.tgz", + "integrity": "sha512-pVvzsSsgUxxtuNfTHC4IxjATs10UaAtvLGVSA1tbUE4GDaOSU1Esu2xF5nWLz7KPiMuW8BJWuPFdlGYJ7/rW0w==", "requires": { - "@remix-run/router": "1.5.0" + "@remix-run/router": "1.13.0" } }, "react-router-dom": { - "version": "6.10.0", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", - "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", + "version": "6.20.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.20.0.tgz", + "integrity": "sha512-CbcKjEyiSVpA6UtCHOIYLUYn/UJfwzp55va4yEfpk7JBN3GPqWfHrdLkAvNCcpXr8QoihcDMuk0dzWZxtlB/mQ==", "requires": { - "@remix-run/router": "1.5.0", - "react-router": "6.10.0" + "@remix-run/router": "1.13.0", + "react-router": "6.20.0" } }, "react-select": { @@ -23672,6 +23936,38 @@ "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==" }, + "ts-node": { + "version": "10.9.1", + "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.1.tgz", + "integrity": "sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==", + "requires": { + "@cspotcode/source-map-support": "^0.8.0", + "@tsconfig/node10": "^1.0.7", + "@tsconfig/node12": "^1.0.7", + "@tsconfig/node14": "^1.0.0", + "@tsconfig/node16": "^1.0.2", + "acorn": "^8.4.1", + "acorn-walk": "^8.1.1", + "arg": "^4.1.0", + "create-require": "^1.1.0", + "diff": "^4.0.1", + "make-error": "^1.1.1", + "v8-compile-cache-lib": "^3.0.1", + "yn": "3.1.1" + }, + "dependencies": { + "arg": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz", + "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==" + }, + "diff": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", + "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==" + } + } + }, "tsconfig-paths": { "version": "3.14.1", "dev": true, @@ -23707,6 +24003,22 @@ "safe-buffer": "^5.0.1" } }, + "tw-elements-react": { + "version": "1.0.0-alpha2", + "resolved": "https://registry.npmjs.org/tw-elements-react/-/tw-elements-react-1.0.0-alpha2.tgz", + "integrity": "sha512-RPsc4HQXTEujQsqusl5uCBjTC+4JmYUq9FTz/tYSSGrRl1SfoPo2vxy+YLa/II/6J8cQB+iuraNK3SisJBmGmQ==", + "requires": { + "@popperjs/core": "^2.11.8", + "chart.js": "^3.7.1", + "chartjs-plugin-datalabels": "^2.0.0", + "deepmerge": "^4.3.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-popper": "^2.3.0", + "react-router-dom": "^6.11.1", + "ts-node": "^10.9.1" + } + }, "tweetnacl": { "version": "0.14.5", "optional": true @@ -23737,6 +24049,12 @@ "typed-function": { "version": "2.1.0" }, + "typescript": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.2.tgz", + "integrity": "sha512-6l+RyNy7oAHDfxC4FzSJcz9vnjTKxrLpDG5M2Vu4SHRVNg6xzqZp6LYSR9zjqQTu8DU/f5xwxUdADOkbrIX2gQ==", + "peer": true + }, "typical": { "version": "4.0.0", "dev": true @@ -23881,6 +24199,11 @@ "version": "8.3.2", "optional": true }, + "v8-compile-cache-lib": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", + "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==" + }, "v8-to-istanbul": { "version": "8.1.1", "dev": true, @@ -23982,6 +24305,14 @@ "w3c-keyname": { "version": "2.2.6" }, + "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" + } + }, "webidl-conversions": { "version": "7.0.0", "dev": true @@ -24245,6 +24576,11 @@ "version": "1.3.2", "dev": true }, + "yn": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz", + "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==" + }, "yocto-queue": { "version": "0.1.0", "devOptional": true diff --git a/package.json b/package.json index 9e14a6f3..a6a68e78 100644 --- a/package.json +++ b/package.json @@ -93,7 +93,8 @@ "socket.io": "^4.5.0", "socket.io-client": "^4.5.0", "styled-components": "5.3.3", - "swiper": "^9.0.5" + "swiper": "^9.0.5", + "tw-elements-react": "^1.0.0-alpha2" }, "devDependencies": { "@babel/eslint-parser": "^7.15.7", diff --git a/src/Viewer/renderers/slider.jsx b/src/Viewer/renderers/slider.jsx index f44d8f0d..5bdb6046 100644 --- a/src/Viewer/renderers/slider.jsx +++ b/src/Viewer/renderers/slider.jsx @@ -9,6 +9,87 @@ import { useSetRecoilState } from "recoil"; import { rendererState } from "../useDoenetRenderer"; import { MathJax } from "better-react-mathjax"; +// Commented code below: Tailwind version of slider ~ by Lee +// Code commented due to differences in how the current slider works and this NEW slider works, different props/way of using props +// Ex1: steps in the current slider refers to the difference between ticks, this new slider refers it to how far the thumb jumps +// Ex2: ticks in the new slider refers to the number of ticks on the whole slider, which can't be controlled in the current slider +// Code sandbox link to view how this component works: https://codesandbox.io/p/devbox/slider-component-tj9pr6?file=%2Fmy-project%2Fsrc%2Fcomponents%2FSlider.jsx +// To run: go to terminal, run 'cd my-project', then 'npm start', navigate to 'App.jsx' to modify and test with difference props + +// export default function Slider({ +// min = 0, +// max = 100, +// label, +// step, +// options, +// value, +// onChange, +// disabled, +// ticks, +// }) { +// const [tickValues, setTickValues] = useState([]); + +// const getDecimalPlaces = (number) => { +// if (Math.floor(number) === number) return 0; +// return number.toString().split(".")[1].length || 0; +// }; + +// useEffect(() => { +// if (options) { +// if (options.length > 1) setTickValues(options); +// else console.log("At least 2 options should be provided..."); +// } else if (ticks) { +// let difference = max - min; +// if (difference > ticks) { +// while (difference % ticks !== 0) ticks--; +// } else { +// while (getDecimalPlaces(difference / ticks) > 2) ticks--; +// } +// let marks = []; +// let tickStep = difference / ticks; +// for (let i = min; Math.round(i * 100) / 100 <= max; i += tickStep) { +// marks.push(i.toFixed(getDecimalPlaces(tickStep))); +// } +// setTickValues(marks); +// } +// }, []); + +// return ( +//
+// {label && ( +// {label} +// )} +//
+// onChange && onChange(event.target.value)} +// disabled={disabled} +// /> +//
+// {tickValues.length > 0 && ( +//
+// {tickValues.map((tick, idx) => ( +// onChange && onChange(tick)} +// > +// {tick} +// +// ))} +//
+// )} +//
+// ); +// } + let round_to_decimals = (x, n) => me.round_numbers_to_decimals(x, n).tree; const SliderContainer = styled.div` diff --git a/src/Viewer/renderers/solution.jsx b/src/Viewer/renderers/solution.jsx index 17394f22..63715e8b 100644 --- a/src/Viewer/renderers/solution.jsx +++ b/src/Viewer/renderers/solution.jsx @@ -1,26 +1,12 @@ import React, { useEffect } from "react"; import useDoenetRenderer from "../useDoenetRenderer"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faPuzzlePiece as puzzle } from "@fortawesome/free-solid-svg-icons"; +import { + faChevronDown, + faPuzzlePiece, +} from "@fortawesome/free-solid-svg-icons"; import VisibilitySensor from "react-visibility-sensor-v2"; -import styled from "styled-components"; -import P from "../../Core/components/P"; -const SpanStyling = styled.span` - // display: block; - // margin: SVs.open ? 12px 4px 0px 4px : 12px 4px 12px 4px; - // padding: 6px; - // border: 2px solid black; - // border-top-left-radius: 5px; - // border-top-right-radius: 5px; - // border-bottom-left-radius: SVs.open ? 0px : 5px; - // border-bottom-right-radius: SVs.open ? 0px : 5px; - // background-color: var(--mainGray); - // cursor: pointer; - &: focus { - outline: 2px solid var(--canvastext); - outline-offset: 2px; - } -`; +import { TECollapse } from "tw-elements-react"; export default React.memo(function Solution(props) { let { name, id, SVs, children, actions, callAction } = @@ -41,95 +27,63 @@ export default React.memo(function Solution(props) { }); }; }, []); - let openCloseText = "open"; if (SVs.hidden) { return null; } - let icon; - let childrenToRender = null; - let infoBlockStyle = { display: "none" }; - - let onClickFunction; - let cursorStyle; - let onKeyPressFunction; - - if (SVs.open) { - icon = ; - openCloseText = "close"; - childrenToRender = children; - infoBlockStyle = { - display: "block", - margin: "0px 4px 12px 4px", - padding: "6px", - border: "2px solid var(--canvastext)", - borderTop: "0px", - borderBottomLeftRadius: "5px", - borderBottomRightRadius: "5px", - backgroundColor: "var(--canvas)", - }; - onKeyPressFunction = (e) => { - if (e.key === "Enter") { - callAction({ - action: actions.closeSolution, - }); - } - }; - - if (SVs.canBeClosed) { - cursorStyle = "pointer"; - onClickFunction = () => { - callAction({ - action: actions.closeSolution, - }); - }; - } else { - onClickFunction = () => {}; - } - } else { - icon = ; - cursorStyle = "pointer"; - onClickFunction = () => { - callAction({ - action: actions.revealSolution, - }); - }; - onKeyPressFunction = (e) => { - if (e.key === "Enter") { - callAction({ - action: actions.revealSolution, - }); - } - }; - } + let onHeaderClick = () => { + callAction({ + action: + SVs.open && SVs.canBeClosed + ? actions.closeSolution + : actions.revealSolution, + }); + }; return ( - +
+ {children} +
+ + ); }); diff --git a/src/Viewer/renderers/textInput.jsx b/src/Viewer/renderers/textInput.jsx index 22668c00..2bd63768 100644 --- a/src/Viewer/renderers/textInput.jsx +++ b/src/Viewer/renderers/textInput.jsx @@ -16,6 +16,7 @@ import { MathJax } from "better-react-mathjax"; import { BoardContext } from "./graph"; import me from "math-expressions"; import { getPositionFromAnchorByCoordinate } from "../../Core/utils/graphical"; +import { Label, TextInput as Input, Textarea } from 'flowbite-react'; // Moved most of checkWorkStyle styling into Button const Button = styled.button` @@ -37,35 +38,6 @@ const Button = styled.button` } `; -const TextArea = styled.textarea` - width: ${(props) => props.width}; - height: ${(props) => - props.height}; // Same height as the checkWorkButton, accounting for the borders - font-size: 14px; - border: ${(props) => - props.disabled ? "2px solid var(--mainGray)" : "var(--mainBorder)"}; - cursor: ${(props) => (props.disabled ? "not-allowed" : "auto")}; - - &:focus { - outline: var(--mainBorder); - outline-offset: 2px; - } -`; - -const Input = styled.input` - width: ${(props) => props.width}; - height: 20px; // Same height as the checkWorkButton, accounting for the borders - font-size: 14px; - border: ${(props) => - props.disabled ? "2px solid var(--mainGray)" : "var(--mainBorder)"}; - cursor: ${(props) => (props.disabled ? "not-allowed" : "auto")}; - - &:focus { - outline: var(--mainBorder); - outline-offset: 2px; - } -`; - export default function TextInput(props) { let { name, @@ -711,50 +683,39 @@ export default function TextInput(props) { } if (SVs.expanded) { input = ( -