From 2f861230387231cc6987daa7e9156005ed71ae4b Mon Sep 17 00:00:00 2001
From: koji <kk2796@nyu.edu>
Date: Sat, 19 Oct 2019 22:32:37 -0400
Subject: [PATCH 1/2] created select base

---
 src/Dialog/index.tsx   |  2 +-
 src/Dropdown/index.tsx | 32 +++++++++++++++++++++++++++++---
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/src/Dialog/index.tsx b/src/Dialog/index.tsx
index df1a5ee..7c93cce 100644
--- a/src/Dialog/index.tsx
+++ b/src/Dialog/index.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import 'nes.css';
+import "../../node_modules/nes.css/css/nes.css";
 
 type Props = {};
 
diff --git a/src/Dropdown/index.tsx b/src/Dropdown/index.tsx
index 8ae3e52..1cc4ede 100644
--- a/src/Dropdown/index.tsx
+++ b/src/Dropdown/index.tsx
@@ -1,12 +1,38 @@
 import * as React from 'react';
-import 'nes.css';
+import "../../node_modules/nes.css/css/nes.css";
 
-type Props = {};
+type Props = {
+  label?: string;
+  options: Array<string|number>;
+  value: Array<string|number>;
+  selectType?: "success" | "warning" | "error";
+  darkMode?: boolean
+};
 
+// NES.css select
 export class NesDropdown extends React.Component<Props> {
   render() {
+    const {label, options, value, selectType, darkMode } = this.props;
+    const optionElms = options.map((option, i) =>
+      <option key={`option-${i}`} value={value[i]}>{option}</option>
+    );
+    const labelType = label ? `${selectType}_select` : `default_select`;
+    const selectId = selectType ? `${selectType}_select` : `default_select`;
+    let selectClass = selectType ? `nes-select is-${selectType}` : `nes-select`;
+    selectClass = darkMode ? `${selectClass} is-dark` : `${selectClass}`;
     return (
-      <div></div>
+      <React.Fragment>
+      {
+        label && (
+            <label htmlFor={labelType}>{label}</label>
+        )
+      }
+      <div className={selectClass}>
+        <select required id={selectId}>
+          {optionElms}
+        </select>
+      </div>
+      </React.Fragment>
     )
   }
 }
\ No newline at end of file

From 3e71c94c47407368a316f59fcd8d3274967daa96 Mon Sep 17 00:00:00 2001
From: koji <kk2796@nyu.edu>
Date: Sun, 20 Oct 2019 00:31:41 -0400
Subject: [PATCH 2/2] added handleChange

---
 src/Dropdown/index.tsx | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/Dropdown/index.tsx b/src/Dropdown/index.tsx
index 1cc4ede..3e86f08 100644
--- a/src/Dropdown/index.tsx
+++ b/src/Dropdown/index.tsx
@@ -9,8 +9,22 @@ type Props = {
   darkMode?: boolean
 };
 
+type State = {
+  value: string | number;
+};
+
 // NES.css select
-export class NesDropdown extends React.Component<Props> {
+export class NesDropdown extends React.Component<Props, State> {
+
+  constructor(props: Props) {
+    super(props);
+    this.state = { value: 0 };
+  }
+
+  handleChange(e: React.FormEvent<HTMLSelectElement>) {
+    this.setState({ value: e.currentTarget.value });
+  }
+
   render() {
     const {label, options, value, selectType, darkMode } = this.props;
     const optionElms = options.map((option, i) =>
@@ -28,7 +42,7 @@ export class NesDropdown extends React.Component<Props> {
         )
       }
       <div className={selectClass}>
-        <select required id={selectId}>
+        <select required id={selectId} onChange={e => this.handleChange}>
           {optionElms}
         </select>
       </div>