From bb5787d04a3fb96a85c9c13fb8df2c769a46df49 Mon Sep 17 00:00:00 2001
From: abefernan <44572727+abefernan@users.noreply.github.com>
Date: Wed, 31 May 2023 12:15:32 +0200
Subject: [PATCH] Support checkbox and datetime-local in Input

---
 components/inputs/Input.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/components/inputs/Input.tsx b/components/inputs/Input.tsx
index 2a6632f..ee0d701 100644
--- a/components/inputs/Input.tsx
+++ b/components/inputs/Input.tsx
@@ -1,11 +1,11 @@
-import React from "react";
-
 interface Props {
   label?: string;
   type?: string;
   name?: string;
   onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
   value: number | string | undefined;
+  min?: string | number | undefined;
+  checked?: boolean;
   onBlur?: (e: React.ChangeEvent<HTMLInputElement>) => void;
   disabled?: boolean;
   error?: string;
@@ -21,6 +21,8 @@ const Input = (props: Props) => (
       name={props.name || "text-input"}
       onChange={props.onChange}
       value={props.value}
+      checked={props.checked}
+      min={props.type === "datetime-local" ? props.min : undefined}
       placeholder={props.placeholder || ""}
       autoComplete="off"
       onBlur={props.onBlur}
@@ -29,15 +31,16 @@ const Input = (props: Props) => (
     {props.error && <div className="error">{props.error}</div>}
     <style jsx>{`
       .text-input {
-        display: flex;
-        flex-direction: column;
         width: ${props.width ? props.width : "auto"};
+        display: flex;
+        flex-direction: ${props.type === "checkbox" ? "row" : "column"};
+        gap: ${props.type === "checkbox" ? "8px" : 0};
       }
 
       label {
         font-style: italic;
         font-size: 12px;
-        margin-bottom: 1em;
+        margin-bottom: ${props.type === "checkbox" ? 0 : "1em"};
       }
 
       input {