update eslint

packages/components/src/Form/docs/forms-concept/accessValue.tsx

@@ -2,23 +2,23 @@ import { Button, ButtonGroup, Form, TextField } from "@hopper-ui/components";
 import { useState, type FormEvent } from "react";
 
 export default function Example() {
-  let [name, setName] = useState("");
+    const [name, setName] = useState("");
 
-  let onSubmit = (e: FormEvent) => {
-    e.preventDefault();
+    const onSubmit = (e: FormEvent) => {
+        e.preventDefault();
 
-    // Submit data to your backend API...
-    alert(name);
-  };
+        // Submit data to your backend API...
+        alert(name);
+    };
 
-  return (
-    <Form onSubmit={onSubmit}>
-      <TextField label="Name" value={name} onChange={setName} />
-      <div>You entered: {name}</div>
-      <ButtonGroup>
-        <Button type="submit" variant="primary">Submit</Button>
-        <Button type="reset" variant="secondary">Reset</Button>
-      </ButtonGroup>
-    </Form>
-  );
+    return (
+        <Form onSubmit={onSubmit}>
+            <TextField label="Name" value={name} onChange={setName} />
+            <div>You entered: {name}</div>
+            <ButtonGroup>
+                <Button type="submit" variant="primary">Submit</Button>
+                <Button type="reset" variant="secondary">Reset</Button>
+            </ButtonGroup>
+        </Form>
+    );
 }

packages/components/src/Form/docs/forms-concept/customValidation.tsx

@@ -2,14 +2,14 @@ import { Button, ButtonGroup, Form, TextField } from "@hopper-ui/components";
 import { useState, type FormEvent } from "react";
 
 export default function Example() {
-    let [submitted, setSubmitted] = useState<Record<string, FormDataEntryValue> | null>(null);
+    const [submitted, setSubmitted] = useState<Record<string, FormDataEntryValue> | null>(null);
 
-    let onSubmit = (e: FormEvent<HTMLFormElement>) => {
+    const onSubmit = (e: FormEvent<HTMLFormElement>) => {
         // Prevent default browser page refresh.
         e.preventDefault();
 
         // Get form data as an object.
-        let data = Object.fromEntries(new FormData(e.currentTarget));
+        const data = Object.fromEntries(new FormData(e.currentTarget));
 
         // Submit to your backend API...
         setSubmitted(data);

packages/components/src/Form/docs/forms-concept/formData.tsx

@@ -5,7 +5,7 @@ export default function Example() {
         <Form validationBehavior="native">
             <TextField
                 label="Username"
-                validate={value => value === 'admin' ? 'Nice try!' : null}
+                validate={value => value === "admin" ? "Nice try!" : null}
             />
             <ButtonGroup>
                 <Button type="submit" variant="primary">Submit</Button>

packages/components/src/Form/docs/forms-concept/reactHookForm.tsx

@@ -1,46 +1,47 @@
 import { Button, Form, TextField } from "@hopper-ui/components";
 import { Controller, useForm } from "react-hook-form";
 
-type FormValues = {
-  name: string
+interface FormValues {
+    name: string;
 }
 
 
 export default function Example() {
-  const {handleSubmit, control} = useForm({
-    defaultValues: {
-      name: "",
-    },
-  });
+    const { handleSubmit, control } = useForm({
+        defaultValues: {
+            name: ""
+        }
+    });
 
-  const onSubmit = (data: FormValues) => {
-    // Call your API here...
-  };
+    const onSubmit = (data: FormValues) => {
+        // Call your API here...
+        window.alert(data);
+    };
 
-  return (
-    <Form onSubmit={handleSubmit(onSubmit)}>
-      <Controller
-        control={control}
-        name="name"
-        rules={{ required: "Name is required." }}
-        render={({
-          field: { name, value, onChange, onBlur, ref },
-          fieldState: { invalid, error },
-        }) => (
-          <TextField
-            label="Name"
-            name={name}
-            value={value}
-            onChange={onChange}
-            onBlur={onBlur}
-            ref={ref}
-            isRequired
-            isInvalid={invalid}
-            errorMessage={error?.message}
-          />
-        )}
-      />
-      <Button type="submit" variant="primary">Submit</Button>
-    </Form>
-  );
+    return (
+        <Form onSubmit={handleSubmit(onSubmit)}>
+            <Controller
+                control={control}
+                name="name"
+                rules={{ required: "Name is required." }}
+                render={({
+                    field: { name, value, onChange, onBlur, ref },
+                    fieldState: { invalid, error }
+                }) => (
+                    <TextField
+                        label="Name"
+                        name={name}
+                        value={value}
+                        onChange={onChange}
+                        onBlur={onBlur}
+                        ref={ref}
+                        isRequired
+                        isInvalid={invalid}
+                        errorMessage={error?.message}
+                    />
+                )}
+            />
+            <Button type="submit" variant="primary">Submit</Button>
+        </Form>
+    );
 }