From 0bbeb98dfd6f1d5561ead573c437f90b5a20226a Mon Sep 17 00:00:00 2001
From: Ayo <ramon.aycojr@gmail.com>
Date: Mon, 26 Sep 2022 11:27:26 +0200
Subject: [PATCH] udpate deps, update showcase, fix props

---
 package-lock.json                            | 14 +++----
 package.json                                 |  2 +-
 src/pages/showcase/astro-github-stats.astro  | 11 +++--
 src/pages/showcase/astro-reactive-form.astro | 43 ++++++++++++++------
 src/pages/showcase/index.astro               |  8 ++--
 5 files changed, 51 insertions(+), 27 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 8ad5d33..d36288b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,7 +10,7 @@
       "dependencies": {
         "astro": "^1.2.6",
         "astro-github-stats": "^0.1.4",
-        "astro-reactive-form": "^0.0.2"
+        "astro-reactive-form": "^0.0.7"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -998,9 +998,9 @@
       }
     },
     "node_modules/astro-reactive-form": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/astro-reactive-form/-/astro-reactive-form-0.0.2.tgz",
-      "integrity": "sha512-9ozKnnDWzLboqBazp/PYGos2tObSCC/uIPioXgZXFaECUTGp1sC7I7ajqD4Pxxkctm0y/xTE6Sy/PW7JeApBzg==",
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/astro-reactive-form/-/astro-reactive-form-0.0.7.tgz",
+      "integrity": "sha512-mCeentQ4swmruXc+Ph3bBSq0vSl8d7pJviC7Vtmr22xqQKp0seUGTLyiLeeZjisX1OENeoOGv0Ca/8FwCv6xWA==",
       "peerDependencies": {
         "astro": "^1.0.0"
       }
@@ -6593,9 +6593,9 @@
       "requires": {}
     },
     "astro-reactive-form": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/astro-reactive-form/-/astro-reactive-form-0.0.2.tgz",
-      "integrity": "sha512-9ozKnnDWzLboqBazp/PYGos2tObSCC/uIPioXgZXFaECUTGp1sC7I7ajqD4Pxxkctm0y/xTE6Sy/PW7JeApBzg==",
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/astro-reactive-form/-/astro-reactive-form-0.0.7.tgz",
+      "integrity": "sha512-mCeentQ4swmruXc+Ph3bBSq0vSl8d7pJviC7Vtmr22xqQKp0seUGTLyiLeeZjisX1OENeoOGv0Ca/8FwCv6xWA==",
       "requires": {}
     },
     "bail": {
diff --git a/package.json b/package.json
index 4c2c0fa..e790f14 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,6 @@
   "dependencies": {
     "astro": "^1.2.6",
     "astro-github-stats": "^0.1.4",
-    "astro-reactive-form": "^0.0.2"
+    "astro-reactive-form": "^0.0.7"
   }
 }
diff --git a/src/pages/showcase/astro-github-stats.astro b/src/pages/showcase/astro-github-stats.astro
index ffd1d7e..1327965 100644
--- a/src/pages/showcase/astro-github-stats.astro
+++ b/src/pages/showcase/astro-github-stats.astro
@@ -4,7 +4,8 @@ import Footer from "../../components/Footer.astro";
 import Back from "../../components/Back.astro";
 import GithubStats from "astro-github-stats";
 ---
-<Layout>
+
+<Layout title="Ayo Ayco | Showcase | Astro Github Stats">
   <main>
     <Back url="/showcase" />
     <h1>Astro GitHub Stats ✨</h1>
@@ -12,10 +13,14 @@ import GithubStats from "astro-github-stats";
     <h2>Links</h2>
     <ol>
       <li>
-        GitHub repo: <a href="https://github.com/ayoayco/astro-github-stats">astro-github-stats</a>
+        GitHub repo: <a href="https://github.com/ayoayco/astro-github-stats"
+          >astro-github-stats</a
+        >
       </li>
       <li>
-        NPM registry: <a href="https://npmjs.org/astro-github-stats">astro-github-stats</a>
+        NPM registry: <a href="https://npmjs.org/astro-github-stats"
+          >astro-github-stats</a
+        >
       </li>
     </ol>
     <Footer />
diff --git a/src/pages/showcase/astro-reactive-form.astro b/src/pages/showcase/astro-reactive-form.astro
index bdac4b3..d2eb7b3 100644
--- a/src/pages/showcase/astro-reactive-form.astro
+++ b/src/pages/showcase/astro-reactive-form.astro
@@ -2,21 +2,36 @@
 import Layout from "../../layouts/Layout.astro";
 import Footer from "../../components/Footer.astro";
 import Back from "../../components/Back.astro";
-import Form, {FormGroup} from "astro-reactive-form";
+import Form, { FormGroup } from "astro-reactive-form";
 const form = new FormGroup([
   {
-    name: 'first-name',
-    value: 'Ayo',
-    label: 'First Name'
+    name: "first-name",
+    value: "Ayo",
+    label: "First Name",
   },
-   {
-    name: 'last-name',
-    value: 'Ayco',
-    label: 'Last Name'
+  {
+    name: "last-name",
+    value: "Ayco",
+    label: "Last Name",
   },
-])
+  {
+    name: "is-awesome",
+    type: "checkbox",
+    value: "checked",
+    label: "Is Awesome?",
+    labelPosition: "right",
+  },
+  {
+    name: "is-good-looking",
+    type: "radio",
+    value: "checked",
+    label: "Is Good-Looking?",
+    labelPosition: "right",
+  },
+]);
 ---
-<Layout>
+
+<Layout title="Ayo Ayco | Showcase | Astro Reactive Form">
   <main>
     <Back url="/showcase" />
     <h1>Astro Reactive Form 🔥</h1>
@@ -26,10 +41,14 @@ const form = new FormGroup([
     <h2>Links</h2>
     <ol>
       <li>
-        GitHub repo: <a href="https://github.com/ayoayco/astro-reactive-form">astro-reactive-form</a>
+        GitHub repo: <a href="https://github.com/ayoayco/astro-reactive-form"
+          >astro-reactive-form</a
+        >
       </li>
       <li>
-        NPM registry: <a href="https://npmjs.org/astro-reactive-form">astro-reactive-form</a>
+        NPM registry: <a href="https://npmjs.org/astro-reactive-form"
+          >astro-reactive-form</a
+        >
       </li>
     </ol>
     <Footer />
diff --git a/src/pages/showcase/index.astro b/src/pages/showcase/index.astro
index 45ca988..983a00f 100644
--- a/src/pages/showcase/index.astro
+++ b/src/pages/showcase/index.astro
@@ -5,21 +5,21 @@ import Card from "../../components/Card.astro";
 import Back from "../../components/Back.astro";
 ---
 
-<Layout>
+<Layout title="Ayo Ayco | Showcase">
   <main>
     <Back url="/" />
     <h1>Showcase <span class="text-gradient">Components</span></h1>
-    <ul list=role>
+    <ul role="list">
       <Card
         href="/showcase/astro-reactive-form"
         title="Astro Reactive Form"
         body="The reactive form component for Astro 🔥"
-        />
+      />
       <Card
         href="/showcase/astro-github-stats"
         title="Astro GitHub Stats"
         body="Embed GitHub stats on your Astro page ✨"
-        />
+      />
     </ul>
     <Footer />
   </main>