+
+ {colors.map((color) => (
+ e.preventDefault()}
+ onDragEnd={(e) => e.preventDefault()}
+ onDragStart={(e) => handleDragStart(e, color)}
+ onDoubleClick={(e) => handleDoubleClick(e, color)}
+ />
+ ))}
+
+
+ {
+ cases.map((cs, i) => (
+
+ ))
+ }
+
+
+ {win}
+ {lose}
+ >
+ )
+}
+
+export default Game
diff --git a/src/objects/Line/Line.css b/src/objects/Line/Line.css
new file mode 100644
index 0000000..fc0ae13
--- /dev/null
+++ b/src/objects/Line/Line.css
@@ -0,0 +1,19 @@
+.line {
+ display: flex;
+ flex-direction: row;
+ width: calc(100% - 1em - 1em);
+ height: 58px;
+ padding: 1em;
+}
+
+.cases {
+ flex-direction: row;
+ display: flex;
+ width: 80%;
+}
+
+button {
+ width: calc(20% - 1em);
+ margin-left: 1em;
+ padding: 0;
+}
\ No newline at end of file
diff --git a/src/objects/Line/Line.tsx b/src/objects/Line/Line.tsx
new file mode 100644
index 0000000..db68629
--- /dev/null
+++ b/src/objects/Line/Line.tsx
@@ -0,0 +1,106 @@
+// import { useState } from 'react'
+// import * as React from "react";
+import "./Line.css";
+import Case, {CaseInfo} from "../Case/Case.tsx";
+import Color from "../Color.ts";
+import * as React from "react";
+
+enum Place {
+ PRESENT,
+ ABSENT,
+ WELL_PLACED
+}
+
+interface LineProps {
+ li: number;
+ n: number;
+ isActive: boolean;
+ combination: string[]
+ changeLine?: (arg0: number) => void;
+ checkLine: (combination: Color[]) => boolean;
+ cases: CaseInfo[]
+ setCases: React.Dispatch