Update examples

shakacode · Feb 22, 2024 · 493b893 · 493b893
1 parent d014123
commit 493b893
Show file tree

Hide file tree

Showing 8 changed files with 81 additions and 74 deletions.
diff --git a/examples/bsconfig.json b/examples/bsconfig.json
diff --git a/examples/package.json b/examples/package.json
@@ -1,32 +1,32 @@
 {
-  "name": "re-formality-examples",
-  "version": "0.0.0",
-  "private": true,
-  "scripts": {
-    "start": "parcel src/index.html",
-    "prestart": "yarn run clean && yarn run res:build",
-    "build": "parcel build src/index.html",
-    "prebuild": "yarn run clean && yarn run res:build",
-    "clean": "yarn run dist:clean && yarn run res:clean",
-    "res:build": "rescript build -with-deps",
-    "res:watch": "rescript build -with-deps -w",
-    "res:clean": "rescript clean",
-    "dist:clean": "rm -rf dist",
-    "format": "rescript format -all",
-    "test": "exit 0",
-    "deploy": "now deploy dist --prod --name re-formality",
-    "predeploy": "yarn run build"
-  },
-  "dependencies": {
-    "@rescript/react": "0.11.0",
-    "re-formality": "*",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "rescript-classnames": "6.0.0"
-  },
-  "devDependencies": {
-    "parcel": "2.8.3",
-    "process": "0.11.10",
-    "rescript": "10.1.3"
-  }
+    "name": "re-formality-examples",
+    "version": "0.0.0",
+    "private": true,
+    "scripts": {
+        "start": "parcel src/index.html",
+        "prestart": "yarn run clean && yarn run res:build",
+        "build": "parcel build src/index.html",
+        "prebuild": "yarn run clean && yarn run res:build",
+        "clean": "yarn run dist:clean && yarn run res:clean",
+        "res:build": "rescript build -with-deps",
+        "res:watch": "rescript build -with-deps -w",
+        "res:clean": "rescript clean",
+        "dist:clean": "rm -rf dist",
+        "format": "rescript format -all",
+        "test": "exit 0",
+        "deploy": "now deploy dist --prod --name re-formality",
+        "predeploy": "yarn run build"
+    },
+    "dependencies": {
+        "@rescript/react": "0.12.1",
+        "re-formality": "*",
+        "react": "18.2.0",
+        "react-dom": "18.2.0",
+        "rescript-classnames": "7.0.0"
+    },
+    "devDependencies": {
+        "parcel": "2.8.3",
+        "process": "0.11.10",
+        "rescript": "11.0.1"
+    }
 }
diff --git a/examples/rescript.json b/examples/rescript.json
@@ -0,0 +1,26 @@
+{
+    "name": "re-formality-examples",
+    "sources": [
+        "src"
+    ],
+    "bs-dependencies": [
+        "@rescript/react",
+        "re-formality",
+        "rescript-classnames"
+    ],
+    "jsx": {
+        "version": 4
+    },
+    "bsc-flags": [
+        "-open Belt",
+        "-open Cx"
+    ],
+    "ppx-flags": [
+        "../_build/default/ppx/bin/bin.exe"
+    ],
+    "package-specs": {
+        "module": "es6",
+        "in-source": true
+    },
+    "suffix": ".res.js"
+}
diff --git a/examples/src/Api.res b/examples/src/Api.res
@@ -7,11 +7,11 @@ let validateEmail = value =>
       value !== takenEmail
         ? {
             Js.log("Remote validation succeeded")
-            resolve(. true)
+            resolve(true)
           }
         : {
             Js.log("Remote validation failed")
-            resolve(. false)
+            resolve(false)
           }
     , 1500)->ignore
   })
diff --git a/examples/src/BlogPostForm.res b/examples/src/BlogPostForm.res
@@ -99,7 +99,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -135,7 +135,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -182,7 +182,7 @@ let make = () => {
               )}
           />
           <button type_="button" className="control" onClick={_ => form.removeAuthor(~at=index)}>
-            {j`✕`->React.string}
+            {"✕"->React.string}
           </button>
           {switch form.authorNameResult(~at=index) {
           | Some(Error(message)) =>
@@ -193,7 +193,7 @@ let make = () => {
           | Some(Ok(_)) =>
             <div
               className={cx(["form-message", "form-message-for-field-of-collection", "success"])}>
-              {j`✓`->React.string}
+              {"✓"->React.string}
             </div>
           | None => React.null
           }}
@@ -214,7 +214,7 @@ let make = () => {
         </button>
         {switch form.status {
         | Submitted =>
-          <div className={cx(["form-status", "success"])}> {j`✓ Posted`->React.string} </div>
+          <div className={cx(["form-status", "success"])}> {"✓ Posted"->React.string} </div>
         | _ => React.null
         }}
       </div>

diff --git a/examples/src/LoginForm.res b/examples/src/LoginForm.res
@@ -69,7 +69,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -95,7 +95,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -122,7 +122,7 @@ let make = () => {
         </button>
         {switch form.status {
         | Submitted =>
-          <div className={cx(["form-status", "success"])}> {j`✓ Logged In`->React.string} </div>
+          <div className={cx(["form-status", "success"])}> {"✓ Logged In"->React.string} </div>
         | _ => React.null
         }}
       </div>

diff --git a/examples/src/SignupForm.res b/examples/src/SignupForm.res
@@ -19,7 +19,7 @@ module SignupForm = %form(
         open Js.Promise
         email
         ->Api.validateEmail
-        ->then_(valid => valid ? Ok(email)->resolve : Error("Email is already taken")->resolve, _)
+        ->(then_(valid => valid ? Ok(email)->resolve : Error("Email is already taken")->resolve, _))
       },
     },
     password: {
@@ -28,7 +28,8 @@ module SignupForm = %form(
         let minLength = 4
         switch password {
         | "" => Error("Password is required")
-        | _ if password->Js.String.length < minLength => Error(j` $(minLength)+ characters, please`)
+        | _ if password->Js.String.length < minLength =>
+          Error(` ${minLength->Int.toString}+ characters, please`)
         | _ => Ok(password)
         }
       },
@@ -90,7 +91,7 @@ let make = () => {
           </div>
         | Some(Result(Ok(_))) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -119,7 +120,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -147,7 +148,7 @@ let make = () => {
           </div>
         | Some(Ok(_)) =>
           <div className={cx(["form-message", "form-message-for-field", "success"])}>
-            {j`✓`->React.string}
+            {"✓"->React.string}
           </div>
         | None => React.null
         }}
@@ -158,7 +159,7 @@ let make = () => {
         </button>
         {switch form.status {
         | Submitted =>
-          <div className={cx(["form-status", "success"])}> {j`✓ Signed Up`->React.string} </div>
+          <div className={cx(["form-status", "success"])}> {"✓ Signed Up"->React.string} </div>
         | _ => React.null
         }}
       </div>

diff --git a/examples/src/index.html b/examples/src/index.html
@@ -1,12 +1,15 @@
 <!DOCTYPE html>
 <html>
-  <head>
+
+<head>
     <meta charset="utf-8">
     <title>re-formality</title>
     <link rel="stylesheet" href="./index.css" />
-  </head>
-  <body>
+</head>
+
+<body>
     <div id="app" />
-    <script type="module" src="./index.bs.js"></script>
-  </body>
+    <script type="module" src="./index.res.js"></script>
+</body>
+
 </html>