pretty

6 files changed, 53 insertions, 73 deletions

diff --git a/packages/demobank-ui/src/components/fields/DateInput.tsx b/packages/demobank-ui/src/components/fields/DateInput.tsx
index 06ec4b6a7..22a83c93c 100644
--- a/packages/demobank-ui/src/components/fields/DateInput.tsx
+++ b/packages/demobank-ui/src/components/fields/DateInput.tsx
@@ -1,7 +1,7 @@
-import { format, subYears } from 'date-fns';
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
-import { DatePicker } from '../picker/DatePicker';
+import { format, subYears } from "date-fns";
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
+import { DatePicker } from "../picker/DatePicker";
 
 export interface DateInputProps {
   label: string;
@@ -16,13 +16,11 @@ export interface DateInputProps {
 export function DateInput(props: DateInputProps): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (props.grabFocus) 
-      inputRef.current?.focus();
-    
+    if (props.grabFocus) inputRef.current?.focus();
   }, [props.grabFocus]);
   const [opened, setOpened] = useState(false);
 
-  const value = props.bind[0] || '';
+  const value = props.bind[0] || "";
   const [dirty, setDirty] = useState(false);
   const showError = dirty && props.error;
 
@@ -43,12 +41,10 @@ export function DateInput(props: DateInputProps): VNode {
           <p class="control">
             <input
               type="text"
-              class={showError ? 'input is-danger' : 'input'}
+              class={showError ? "input is-danger" : "input"}
               value={value}
               onKeyPress={(e) => {
-                if (e.key === 'Enter' && props.onConfirm) 
-                  props.onConfirm()
-                
+                if (e.key === "Enter" && props.onConfirm) props.onConfirm();
               }}
               onInput={(e) => {
                 const text = e.currentTarget.value;
@@ -81,7 +77,7 @@ export function DateInput(props: DateInputProps): VNode {
         closeFunction={() => setOpened(false)}
         dateReceiver={(d) => {
           setDirty(true);
-          const v = format(d, 'yyyy-MM-dd');
+          const v = format(d, "yyyy-MM-dd");
           props.bind[1](v);
         }}
       />
diff --git a/packages/demobank-ui/src/components/fields/EmailInput.tsx b/packages/demobank-ui/src/components/fields/EmailInput.tsx
index 8b64264ed..2a22b26e8 100644
--- a/packages/demobank-ui/src/components/fields/EmailInput.tsx
+++ b/packages/demobank-ui/src/components/fields/EmailInput.tsx
@@ -1,5 +1,5 @@
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
 
 export interface TextInputProps {
   label: string;
@@ -14,9 +14,7 @@ export interface TextInputProps {
 export function EmailInput(props: TextInputProps): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (props.grabFocus) 
-      inputRef.current?.focus();
-    
+    if (props.grabFocus) inputRef.current?.focus();
   }, [props.grabFocus]);
   const value = props.bind[0];
   const [dirty, setDirty] = useState(false);
@@ -37,18 +35,16 @@ export function EmailInput(props: TextInputProps): VNode {
           required
           placeholder={props.placeholder}
           type="email"
-          class={showError ? 'input is-danger' : 'input'}
+          class={showError ? "input is-danger" : "input"}
           onKeyPress={(e) => {
-            if (e.key === 'Enter' && props.onConfirm) 
-              props.onConfirm()
-            
+            if (e.key === "Enter" && props.onConfirm) props.onConfirm();
           }}
           onInput={(e) => {
             setDirty(true);
             props.bind[1]((e.target as HTMLInputElement).value);
           }}
           ref={inputRef}
-          style={{ display: 'block' }}
+          style={{ display: "block" }}
         />
       </div>
       {showError && <p class="help is-danger">{props.error}</p>}
diff --git a/packages/demobank-ui/src/components/fields/FileInput.tsx b/packages/demobank-ui/src/components/fields/FileInput.tsx
index 17413b907..79cd76f30 100644
--- a/packages/demobank-ui/src/components/fields/FileInput.tsx
+++ b/packages/demobank-ui/src/components/fields/FileInput.tsx
@@ -18,8 +18,8 @@
  *
  * @author Sebastian Javier Marchano (sebasjm)
  */
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
 
 const MAX_IMAGE_UPLOAD_SIZE = 1024 * 1024;
 
@@ -42,9 +42,7 @@ export interface FileInputProps {
 export function FileInput(props: FileInputProps): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (props.grabFocus) 
-      inputRef.current?.focus();
-    
+    if (props.grabFocus) inputRef.current?.focus();
   }, [props.grabFocus]);
 
   const fileInputRef = useRef<HTMLInputElement>(null);
@@ -56,9 +54,7 @@ export function FileInput(props: FileInputProps): VNode {
           <div class="icon is-small ">
             <i class="mdi mdi-folder" />
           </div>
-          <span>
-            {props.label}
-          </span>
+          <span>{props.label}</span>
         </a>
         {props.tooltip && (
           <span class="icon has-tooltip-right" data-tooltip={props.tooltip}>
@@ -69,15 +65,14 @@ export function FileInput(props: FileInputProps): VNode {
       <div class="control">
         <input
           ref={fileInputRef}
-          style={{ display: 'none' }}
+          style={{ display: "none" }}
           type="file"
           // name={String(name)}
           onChange={(e) => {
             const f: FileList | null = e.currentTarget.files;
-            if (!f || f.length != 1) 
-              return props.onChange(undefined);
-            
-            console.log(f)
+            if (!f || f.length != 1) return props.onChange(undefined);
+
+            console.log(f);
             if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) {
               setSizeError(true);
               return props.onChange(undefined);
@@ -87,10 +82,14 @@ export function FileInput(props: FileInputProps): VNode {
               const b64 = btoa(
                 new Uint8Array(b).reduce(
                   (data, byte) => data + String.fromCharCode(byte),
-                  '',
+                  "",
                 ),
               );
-              return props.onChange({content: `data:${f[0].type};base64,${b64}`, name: f[0].name, type: f[0].type});
+              return props.onChange({
+                content: `data:${f[0].type};base64,${b64}`,
+                name: f[0].name,
+                type: f[0].type,
+              });
             });
           }}
         />
diff --git a/packages/demobank-ui/src/components/fields/ImageInput.tsx b/packages/demobank-ui/src/components/fields/ImageInput.tsx
index 98457af21..c190de9a9 100644
--- a/packages/demobank-ui/src/components/fields/ImageInput.tsx
+++ b/packages/demobank-ui/src/components/fields/ImageInput.tsx
@@ -18,19 +18,17 @@
  *
  * @author Sebastian Javier Marchano (sebasjm)
  */
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
-import emptyImage from '../../assets/empty.png';
-import { TextInputProps } from './TextInput';
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
+import emptyImage from "../../assets/empty.png";
+import { TextInputProps } from "./TextInput";
 
 const MAX_IMAGE_UPLOAD_SIZE = 1024 * 1024;
 
 export function ImageInput(props: TextInputProps): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (props.grabFocus) 
-      inputRef.current?.focus();
-    
+    if (props.grabFocus) inputRef.current?.focus();
   }, [props.grabFocus]);
 
   const value = props.bind[0];
@@ -59,14 +57,13 @@ export function ImageInput(props: TextInputProps): VNode {
         />
         <input
           ref={image}
-          style={{ display: 'none' }}
+          style={{ display: "none" }}
           type="file"
           name={String(name)}
           onChange={(e) => {
             const f: FileList | null = e.currentTarget.files;
-            if (!f || f.length != 1) 
-              return onChange(emptyImage);
-            
+            if (!f || f.length != 1) return onChange(emptyImage);
+
             if (f[0].size > MAX_IMAGE_UPLOAD_SIZE) {
               setSizeError(true);
               return onChange(emptyImage);
@@ -76,7 +73,7 @@ export function ImageInput(props: TextInputProps): VNode {
               const b64 = btoa(
                 new Uint8Array(b).reduce(
                   (data, byte) => data + String.fromCharCode(byte),
-                  '',
+                  "",
                 ),
               );
               return onChange(`data:${f[0].type};base64,${b64}` as any);
diff --git a/packages/demobank-ui/src/components/fields/NumberInput.tsx b/packages/demobank-ui/src/components/fields/NumberInput.tsx
index 881c61c57..1a54d24b6 100644
--- a/packages/demobank-ui/src/components/fields/NumberInput.tsx
+++ b/packages/demobank-ui/src/components/fields/NumberInput.tsx
@@ -1,5 +1,5 @@
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
 
 export interface TextInputProps {
   label: string;
@@ -14,9 +14,7 @@ export interface TextInputProps {
 export function PhoneNumberInput(props: TextInputProps): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (props.grabFocus) 
-      inputRef.current?.focus();
-    
+    if (props.grabFocus) inputRef.current?.focus();
   }, [props.grabFocus]);
   const value = props.bind[0];
   const [dirty, setDirty] = useState(false);
@@ -36,18 +34,16 @@ export function PhoneNumberInput(props: TextInputProps): VNode {
           value={value}
           type="tel"
           placeholder={props.placeholder}
-          class={showError ? 'input is-danger' : 'input'}
+          class={showError ? "input is-danger" : "input"}
           onKeyPress={(e) => {
-            if (e.key === 'Enter' && props.onConfirm) 
-              props.onConfirm()
-            
+            if (e.key === "Enter" && props.onConfirm) props.onConfirm();
           }}
           onInput={(e) => {
             setDirty(true);
             props.bind[1]((e.target as HTMLInputElement).value);
           }}
           ref={inputRef}
-          style={{ display: 'block' }}
+          style={{ display: "block" }}
         />
       </div>
       {showError && <p class="help is-danger">{props.error}</p>}
diff --git a/packages/demobank-ui/src/components/fields/TextInput.tsx b/packages/demobank-ui/src/components/fields/TextInput.tsx
index 5cc9f32ad..cc7104cf5 100644
--- a/packages/demobank-ui/src/components/fields/TextInput.tsx
+++ b/packages/demobank-ui/src/components/fields/TextInput.tsx
@@ -1,8 +1,8 @@
-import { h, VNode } from 'preact';
-import { useLayoutEffect, useRef, useState } from 'preact/hooks';
+import { h, VNode } from "preact";
+import { useLayoutEffect, useRef, useState } from "preact/hooks";
 
 export interface TextInputProps {
-  inputType?: 'text' | 'number' | 'multiline' | 'password';
+  inputType?: "text" | "number" | "multiline" | "password";
   label: string;
   grabFocus?: boolean;
   disabled?: boolean;
@@ -16,13 +16,11 @@ export interface TextInputProps {
 const TextInputType = function ({ inputType, grabFocus, ...rest }: any): VNode {
   const inputRef = useRef<HTMLInputElement>(null);
   useLayoutEffect(() => {
-    if (grabFocus) 
-      inputRef.current?.focus();
-    
+    if (grabFocus) inputRef.current?.focus();
   }, [grabFocus]);
 
-  return inputType === 'multiline' ? (
-    <textarea {...rest} rows={5} ref={inputRef} style={{ height: 'unset' }} />
+  return inputType === "multiline" ? (
+    <textarea {...rest} rows={5} ref={inputRef} style={{ height: "unset" }} />
   ) : (
     <input {...rest} type={inputType} ref={inputRef} />
   );
@@ -49,17 +47,15 @@ export function TextInput(props: TextInputProps): VNode {
           grabFocus={props.grabFocus}
           disabled={props.disabled}
           placeholder={props.placeholder}
-          class={showError ? 'input is-danger' : 'input'}
+          class={showError ? "input is-danger" : "input"}
           onKeyPress={(e: any) => {
-            if (e.key === 'Enter' && props.onConfirm) 
-              props.onConfirm();
-            
+            if (e.key === "Enter" && props.onConfirm) props.onConfirm();
           }}
           onInput={(e: any) => {
             setDirty(true);
             props.bind[1]((e.target as HTMLInputElement).value);
           }}
-          style={{ display: 'block' }}
+          style={{ display: "block" }}
         />
       </div>
       {showError && <p class="help is-danger">{props.error}</p>}