docs(readme.md): polishing touches to docs

Author: arjunvegda

README.md

@@ -1,6 +1,9 @@
 # Jotai DevTools
 
-## Features
+[![Build Status](https://img.shields.io/github/actions/workflow/status/jotaijs/jotai-devtools/ci.yml?style=flat&colorA=000000&colorB=259e02)](https://github.com/jotaijs/jotai-devtools/actions/workflows/ci.yml)
+[![Version](https://img.shields.io/npm/v/jotai-devtools?style=flat&colorA=000000&colorB=259e02)](https://www.npmjs.com/package/jotai-devtools)
+
+## 🚀 Features
 
 - Debug 🐞 atom values with ease
 - Out-of-the-box 🔌 support for async/suspendible atoms
@@ -10,21 +13,22 @@
 - ✅ Works with Next.js
 - ✅ Supports custom `nonce` for CSP
 - ✅ Hides private atoms with ability to configure (requires Jotai `>=2.0.3`)
+- ✅ Tree-shakable and built for non-production environments
 
-## Preview
+## 📺 Preview
 
 <p>
     <a href="https://www.npmjs.com/package/jotai-devtools">
       <img alt="Jotai DevTools Screenshot" src="./docs/internal/demo-screenshot.png" width="750"/>
   </a>
 </p>
 
-## Prerequisites
+## ☝️ Prerequisites
 
 - Jotai version `>=1.11.0` (highly recommended to use `2.x.x`)
 - React version `>=17.0.0`
 
-## Setup
+## 📦 Setup
 
 ```sh
 # yarn
@@ -34,12 +38,16 @@ yarn add jotai-devtools
 npm install jotai-devtools --save
 ```
 
-## UI DevTools
+## ✨ UI DevTools
+
+Enhance your development experience with the UI based Jotai DevTool
+
+[![Demo](https://img.shields.io/badge/demo-%F0%9F%9A%80-green?style=flat&colorA=000000&colorB=259e02)](https://codesandbox.io/s/jotai-devtools-demo-k5p12d)
 
 ### Babel plugin setup - (Optional but highly recommended)
 
-Use Jotai babel plugins for optimal experience. Full guide is available on
-[jotai.org](https://jotai.org/docs/tools/babel)
+Use Jotai babel plugins for optimal debugging experience. Find the complete
+guide on [jotai.org](https://jotai.org/docs/tools/babel)
 
 Eg.
 
@@ -56,7 +64,10 @@ Eg.
 
 ### Next JS setup
 
-Enable `transpilePackages` for CSS to be imported correctly.
+_You may skip this section if you're not using [Next.js](https://nextjs.org)._
+
+Enable `transpilePackages` for the UI CSS and components to be transpiled
+correctly.
 
 ```ts
 // next.config.ts
@@ -70,6 +81,26 @@ const nextConfig = {
 module.exports = nextConfig;
 ```
 
+### Available props
+
+```ts
+type DevToolsProps = {
+  // Defaults to false
+  isInitialOpen?: boolean;
+  // pass a custom store
+  store?: Store;
+  // Defaults to light
+  theme?: 'dark' | 'light';
+  // Custom nonce to allowlist jotai-devtools specific inline styles via CSP
+  nonce?: string;
+  options?: {
+    // Private atoms are used internally in atoms like `atomWithStorage` or `atomWithLocation`, etc. to manage state.
+    // Defaults to `false`
+    shouldShowPrivateAtoms?: boolean;
+  };
+};
+```
+
 ### Provider-less
 
 ```tsx
@@ -103,26 +134,6 @@ const App = () => {
 };
 ```
 
-### Available props
-
-```ts
-type DevToolsProps = {
-  // defaults to false
-  isInitialOpen?: boolean;
-  // pass a custom store
-  store?: Store;
-  // Defaults to light
-  theme?: 'dark' | 'light';
-  // Custom nonce to allowlist jotai-devtools specific inline styles via CSP
-  nonce?: string;
-  options?: {
-    // Private atoms are used internally in atoms like `atomWithStorage` or `atomWithLocation`, etc. to manage state.
-    // Defaults to `false`
-    shouldShowPrivateAtoms?: boolean;
-  };
-};
-```
-
 ## Hooks
 
 Detailed documentation is available on

package.json

@@ -61,7 +61,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/jotai-labs/jotai-devtools.git"
+    "url": "https://github.com/jotaijs/jotai-devtools.git"
   },
   "keywords": [
     "jotai",
@@ -74,9 +74,9 @@
   ],
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/jotai-labs/jotai-devtools/issues"
+    "url": "https://github.com/jotaijs/jotai-devtools/issues"
   },
-  "homepage": "https://github.com/jotai-labs/jotai-devtools",
+  "homepage": "https://github.com/jotaijs/jotai-devtools",
   "engines": {
     "node": ">=14.0.0"
   },