docs: Update basic docs (#17)

README.md

@@ -11,26 +11,47 @@ Getting started with the Javascript package is really easy. Just follow the step
 If your app is built on React, using the React widget is by far the easiest approach.
 
 ```jsx
-import "@worldcoin/idkit/build/index.css";
 import { IDKitWidget } from "@worldcoin/idkit";
 
-<IDKitWidget />;
+<IDKitWidget actionId="get_this_from_the_dev_portal" onSuccess={handleProof}>
+  {({ open }) => (
+    {/* You can render whatever you want here, and call open() to open the widget */}
+    <button onClick={open}>Click me</button>
+  )}
+</IDKitWidget>
+```
+
+Alternatively, you can render the component without children (on your layout, for exampld) and use the `useIDKit` hook to open it programmatically.
+
+```jsx
+import { useIDKit } from "@worldcoin/idkit";
+
+const { open, setOpen } = useIDKit({
+	actionId: "get_this_from_the_dev_portal",
+	onSuccess: handleProof,
+});
 ```
 
 ### Generic JS apps
 
 If your app doesn't have a framework or doesn't use React, continue here.
 
-1. Add a `<div>` in your HTML where you'd like to include IDKit.
+1. Initialize IDKit (please refer to the docs for further customization details).
 
-```html
-<div id="idkit-js"></div>
+```js
+IDKit.init({
+	actionId: "get_this_from_the_dev_portal",
+});
 ```
 
-2. Initialize IDKit (please refer to the docs for further customization details).
+2. Then, open the widget and await the proof (you can do this in response to a button click, for example).
 
 ```js
-IDKit.init("idkit-js");
+button.addEventListener("click", async () => {
+	const proof = await IDKit.open();
+
+	console.log(proof);
+});
 ```
 
 ## 🧑‍💻 Development & testing

idkit/README.md

@@ -1,11 +1,11 @@
 # IDKit JS Widget
 
-This folder (`/idkit`) contains the main code for the JS widget. For instructions on **how to use the widget**, please refer to the repository's main [README](/README.md).
+This folder (`/idkit`) contains the main code for the widget. For instructions on **how to use the widget**, please refer to the repository's main [README](/README.md).
 
 ## ℹ️ About the codebase
 
--   The widget is made to work mainly with vanilla JS code (no framework required). The starting point can be found in `vanilla.tsx`.
--   The React wrapper is found on `index.ts` (and is exported as `IDKitWidget`).
+-   The widget is made to work mainly with vanilla JS code (no framework required). The starting point can be found in `src/vanilla.tsx`.
+-   The React wrapper is found on `src/components/IDKitWidget/index.ts`.
 
 ## 🧑‍💻 Development & testing
 

idkit/src/types/Config.ts

@@ -4,10 +4,10 @@ export type Config = {
 	actionId: string
 	autoClose?: boolean
 	onSuccess?: CallbackFn
-	copy: {
-		title: string
-		heading: string
-		subheading: string
-		success: string
+	copy?: {
+		title?: string
+		heading?: string
+		subheading?: string
+		success?: string
 	}
 }