feat: sync 2d chart spectrum colors (#1807)

* feat: sync 2d chart spectrum colors

* refactor: update dependencies

package.json

@@ -84,7 +84,7 @@
     "openchemlib-utils": "^2.0.0",
     "re-resizable": "^6.9.9",
     "react-d3-utils": "^0.5.1",
-    "react-dropzone": "^14.2.2",
+    "react-dropzone": "^14.2.3",
     "react-error-boundary": "^3.1.4",
     "react-icons": "^4.4.0",
     "react-inspector": "^6.0.1",
@@ -104,28 +104,28 @@
     "@babel/plugin-transform-modules-commonjs": "^7.18.6",
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.18.6",
-    "@playwright/test": "^1.26.1",
+    "@playwright/test": "^1.27.1",
     "@simbathesailor/use-what-changed": "^2.0.0",
     "@types/d3": "^7.4.0",
-    "@types/jest": "^29.1.1",
-    "@types/node": "^18.8.2",
+    "@types/jest": "^29.1.2",
+    "@types/node": "^18.8.5",
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "@vitejs/plugin-react": "^2.1.0",
     "@zakodium/eslint-config": "^6.0.0",
     "cross-env": "^7.0.3",
-    "eslint": "^8.24.0",
+    "eslint": "^8.25.0",
     "jest": "^29.1.2",
     "modern-normalize": "^1.1.0",
     "prettier": "^2.7.1",
     "rc-menu": "^9.6.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-router-dom": "^6.4.1",
+    "react-router-dom": "^6.4.2",
     "rimraf": "^3.0.2",
     "rollup-plugin-analyzer": "^4.0.0",
     "serve": "^14.0.1",
     "typescript": "~4.8.4",
-    "vite": "^3.1.4"
+    "vite": "^3.1.7"
   }
 }

src/component/2d/Left1DChart.tsx

@@ -81,7 +81,12 @@ function Left1DChart({
         </clipPath>
       </defs>
       <g clipPath={`url(#${displayerKey}clip-left)`}>
-        <path className="line" stroke="black" fill="none" d={paths} />
+        <path
+          className="line"
+          stroke={spectrum.display.color}
+          fill="none"
+          d={paths}
+        />
       </g>
     </svg>
   );

src/component/2d/Top1DChart.tsx

@@ -73,7 +73,7 @@ function Top1DChart({
       <g clipPath={`url(#${displayerKey}clip-top)`}>
         <path
           className="line"
-          stroke="red"
+          stroke={spectrum.display.color}
           fill="none"
           strokeWidth="1px"
           d={paths}