example: update example project, link to local npm package

examples/simple/package.json

@@ -10,7 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@tembell/paresseux": "^0.2.0",
+    "@tembell/paresseux": "file:../../",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

examples/simple/src/App.tsx

@@ -1,46 +1,51 @@
 import { useState } from "react";
-import { useOpenModal } from "@tembell/paresseux"
+import useOpenModal from "../../../src/core/useOpenModal";
 import ChooseMathOpModal from "./components/ChooseMathOpModal";
 import NumbersModal from "./components/NumbersModal";
 
 function App() {
   const openModal = useOpenModal();
   const [count, setCount] = useState(0);
+
   const addModalFlow = async () => {
-    const mathOp = await openModal<"add" | "remove" | undefined>((resolve) =>
-      <ChooseMathOpModal
-        onAdd={() => resolve("add")}
-        onRemove={() => resolve("remove")}
-        onCancel={() => resolve(undefined)} />
-    );
-    if (!mathOp) return;
+    try {
+      const mathOp = await openModal<"add" | "remove">((resolve, reject) => (
+        <ChooseMathOpModal
+          onAdd={() => resolve("add")}
+          onRemove={() => resolve("remove")}
+          onCancel={() => reject()}
+        />
+      ));
 
-    const amount = await openModal<number | undefined>((resolve) =>
-      <NumbersModal
-        title="How Much?"
-        onCancel={() => resolve(undefined)}
-        onSubmit={(v) => resolve(v)} />
-    );
-    if (!amount) return;
+      const amount = await openModal<number>((resolve, reject) => (
+        <NumbersModal title="How Much?" onCancel={() => reject()} onSubmit={(v) => resolve(v)} />
+      ));
 
-    const mathOpMult = mathOp === "add" ? 1 : -1;
-    setCount(count + (amount * mathOpMult))
-  }
+      const mathOpMult = mathOp === "add" ? 1 : -1;
+      setCount(count + amount * mathOpMult);
+    } catch (error) {
+      console.log({ error });
+      return;
+    }
+  };
 
   return (
     <div className="flex flex-col justify-center items-center gap-2 w-screen h-screen">
       <div className="font-thin text-6xl">Paresseux Demo</div>
       <div className="text-gray-300">Click on the button to start the Demo flow</div>
-      <div className="text-lg">Your current count is <span className="text-4xl">{count}</span>.</div>
+      <div className="text-lg">
+        Your current count is <span className="text-4xl">{count}</span>.
+      </div>
       <div className="m-8">
         <div className="flex justify-center gap-4 mb-4">
           <button onClick={() => addModalFlow()}>Modify Count</button>
         </div>
       </div>
-      <p className="text-sm text-gray-400">Go to the <a>docs</a> to learn more</p>
+      <p className="text-sm text-gray-400">
+        Go to the <a>docs</a> to learn more
+      </p>
     </div>
   );
 }
 
-
 export default App;

examples/simple/src/components/CancelModal/index.tsx

@@ -1,11 +1,18 @@
 import { ReactNode } from "react";
 
-export default function CancelModal({ children, onCancel }: { children: ReactNode, onCancel: () => void }) {
+export default function CancelModal({
+  children,
+  onCancel,
+}: {
+  children: ReactNode;
+  onCancel: () => void;
+}) {
   return (
     <div className="flex justify-center items-center fixed top-0 right-0 bg-black/30 backdrop-blur w-screen h-screen">
       <div className="bg-gray-700 rounded p-8 flex flex-col gap-4">
         {children}
         <button onClick={() => onCancel()}>Cancel</button>
       </div>
-    </div>);
+    </div>
+  );
 }

examples/simple/src/components/ChooseMathOpModal/index.tsx

@@ -1,13 +1,17 @@
 import CancelModal from "../CancelModal";
 
-type Props = { onAdd: () => void, onRemove: () => void, onCancel: () => void };
+type Props = { onAdd: () => void; onRemove: () => void; onCancel: () => void };
 export default function ChooseMathOpModalBase({ onAdd, onRemove, onCancel }: Props) {
   return (
     <CancelModal onCancel={() => onCancel()}>
       <div className="text-3xl">What do you want to do?</div>
       <div className="flex gap-4 justify-between">
-        <button className="grow" onClick={() => onAdd()}>Add</button>
-        <button className="grow" onClick={() => onRemove()}>Remove</button>
+        <button className="grow" onClick={() => onAdd()}>
+          Add
+        </button>
+        <button className="grow" onClick={() => onRemove()}>
+          Remove
+        </button>
       </div>
     </CancelModal>
   );

examples/simple/src/components/Modal/index.tsx

@@ -3,8 +3,7 @@ import { ReactNode } from "react";
 export default function Modal({ children }: { children: ReactNode }) {
   return (
     <div className="flex justify-center items-center fixed top-0 right-0 bg-black/30 backdrop-blur w-screen h-screen">
-      <div className="bg-gray-700 rounded p-8">
-        {children}
-      </div>
-    </div>);
+      <div className="bg-gray-700 rounded p-8">{children}</div>
+    </div>
+  );
 }

examples/simple/src/components/NumbersModal/index.tsx

@@ -7,17 +7,26 @@ export default function NumbersModalBase({ onCancel, onSubmit, title }: Props) {
 
   const handleChange = (v: number) => {
     setAmount(v);
-  }
+  };
 
   return (
     <CancelModal onCancel={() => onCancel()}>
       <div className="text-3xl">{title}</div>
       <div className="flex gap-4">
-        <button className="grow" onClick={() => onSubmit(1)}>Just 1</button>
-        <button className="grow" onClick={() => onSubmit(42)}>to the moon!</button>
+        <button className="grow" onClick={() => onSubmit(1)}>
+          Just 1
+        </button>
+        <button className="grow" onClick={() => onSubmit(42)}>
+          to the moon!
+        </button>
       </div>
       <div className="flex  gap-4">
-        <input type="number" className="rounded p-2" placeholder="amount..." onChange={(e) => handleChange(Number(e.target.value))} />
+        <input
+          type="number"
+          className="rounded p-2"
+          placeholder="amount..."
+          onChange={(e) => handleChange(Number(e.target.value))}
+        />
         <button onClick={() => onSubmit(amount ?? 0)}>Selct Custom </button>
       </div>
     </CancelModal>

examples/simple/src/main.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
-import { ModalsProvider } from "@tembell/paresseux";
+import ModalsProvider from "../../../src/core/ModalsProvier";
 import App from "./App.tsx";
 import "./index.css";