LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020-2022 Poimandres
+Copyright (c) 2020-2023 Poimandres
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

docs/api/devtools.mdx

@@ -1,9 +1,19 @@
 ---
 title: Devtools
-description: This doc describes `jotai/devtool` bundle.
+description: This doc describes Devtools for Jotai.
 nav: 2.03
 ---
 
+## Install
+
+You have to install `jotai-devtools` to use this feature.
+
+```
+npm install jotai-devtools
+# or
+yarn add jotai-devtools
+```
+
 ## useAtomsDebugValue
 
 `useAtomsDebugValue` is a React hook that will show all atom values in React Devtools.
@@ -21,7 +31,7 @@ It will catch all atoms that are accessible from the place the hook is located.
 ### Example
 
 ```jsx
-import { useAtomsDebugValue } from 'jotai/devtools'
+import { useAtomsDebugValue } from 'jotai-devtools'
 
 const textAtom = atom('hello')
 textAtom.debugLabel = 'textAtom'
@@ -75,7 +85,7 @@ The `useAtomDevtools` hook accepts a generic type parameter (mirroring the type
 ### Example
 
 ```ts
-import { useAtomDevtools } from 'jotai/devtools'
+import { useAtomDevtools } from 'jotai-devtools'
 
 // The interface for the type stored in the atom.
 export interface Task {
@@ -171,7 +181,7 @@ Be careful using this hook because it will cause the component to re-render for
 
 ```jsx
 import { Provider } from 'jotai'
-import { useAtomsSnapshot } from 'jotai/devtools'
+import { useAtomsSnapshot } from 'jotai-devtools'
 
 const RegisteredAtoms = () => {
   const atoms = useAtomsSnapshot()
@@ -214,7 +224,7 @@ This hook is primarily meant for debugging and devtools use cases.
 
 ```jsx
 import { Provider } from 'jotai'
-import { useAtomsSnapshot, useGotoAtomsSnapshot } from 'jotai/devtools'
+import { useAtomsSnapshot, useGotoAtomsSnapshot } from 'jotai-devtools'
 
 const petAtom = atom('cat')
 const colorAtom = atom('blue')

docs/integrations/trpc.mdx

@@ -16,19 +16,16 @@ yarn add jotai-trpc @trpc/client @trpc/server
 
 ## Usage
 
-```js
+```ts
 import { createTRPCJotai } from 'jotai-trpc'
 
-const trpc =
-  createTRPCJotai <
-  MyRouter >
-  {
-    links: [
-      httpLink({
-        url: myUrl,
-      }),
-    ],
-  }
+const trpc = createTRPCJotai<MyRouter>({
+  links: [
+    httpLink({
+      url: myUrl,
+    }),
+  ],
+})
 
 const idAtom = atom('foo')
 const queryAtom = trpc.bar.baz.atomWithQuery((get) => get(idAtom))
@@ -38,23 +35,20 @@ const queryAtom = trpc.bar.baz.atomWithQuery((get) => get(idAtom))
 
 `...atomWithQuery` creates a new atom with "query". It internally uses [Vanilla Client](https://trpc.io/docs/vanilla)'s `...query` procedure.
 
-```jsx
+```tsx
 import { atom, useAtom } from 'jotai'
 import { httpLink } from '@trpc/client'
 import { createTRPCJotai } from 'jotai-trpc'
 import { trpcPokemonUrl } from 'trpc-pokemon'
 import type { PokemonRouter } from 'trpc-pokemon'
 
-const trpc =
-  createTRPCJotai <
-  PokemonRouter >
-  {
-    links: [
-      httpLink({
-        url: trpcPokemonUrl,
-      }),
-    ],
-  }
+const trpc = createTRPCJotai<PokemonRouter>({
+  links: [
+    httpLink({
+      url: trpcPokemonUrl,
+    }),
+  ],
+})
 
 const NAMES = [
   'bulbasaur',

docs/utils/split-atom.mdx

@@ -40,7 +40,7 @@ const initialState = [
 const todosAtom = atom(initialState)
 const todoAtomsAtom = splitAtom(todosAtom)
 
-type TodoType = typeof initialState[number]
+type TodoType = (typeof initialState)[number]
 
 const TodoItem = ({
   todoAtom,

package.json

@@ -1,7 +1,7 @@
 {
   "name": "jotai",
   "private": true,
-  "version": "1.12.1",
+  "version": "1.13.0",
   "description": "👻 Next gen state management that will spook you",
   "main": "./index.js",
   "types": "./index.d.ts",
@@ -141,43 +141,44 @@
     ]
   },
   "devDependencies": {
-    "@babel/core": "^7.20.7",
+    "@babel/core": "^7.20.12",
     "@babel/plugin-transform-react-jsx": "^7.20.7",
     "@babel/plugin-transform-typescript": "^7.20.7",
     "@babel/preset-env": "^7.20.2",
     "@babel/template": "^7.20.7",
     "@babel/types": "^7.20.7",
-    "@redux-devtools/extension": "^3.2.3",
+    "@redux-devtools/extension": "^3.2.4",
     "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-replace": "^5.0.2",
-    "@rollup/plugin-typescript": "^10.0.1",
-    "@swc/core": "^1.3.24",
+    "@rollup/plugin-typescript": "^11.0.0",
+    "@swc/core": "^1.3.25",
     "@swc/jest": "^0.2.24",
-    "@tanstack/query-core": "^4.20.4",
+    "@tanstack/query-core": "^4.22.0",
     "@testing-library/react": "^13.4.0",
-    "@types/jest": "^29.2.4",
+    "@types/jest": "^29.2.5",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
-    "@typescript-eslint/eslint-plugin": "^5.47.1",
-    "@typescript-eslint/parser": "^5.47.1",
+    "@typescript-eslint/eslint-plugin": "^5.48.1",
+    "@typescript-eslint/parser": "^5.48.1",
     "@urql/core": "^3.1.1",
     "benny": "^3.7.1",
     "concurrently": "^7.6.0",
     "downlevel-dts": "^0.11.0",
-    "esbuild": "^0.16.12",
-    "eslint": "^8.30.0",
-    "eslint-config-prettier": "^8.5.0",
+    "esbuild": "^0.16.16",
+    "eslint": "^8.31.0",
+    "eslint-config-prettier": "^8.6.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jest": "^27.1.7",
+    "eslint-plugin-jest": "^27.2.1",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.31.11",
     "eslint-plugin-react-hooks": "^4.6.0",
     "graphql": "^16.6.0",
-    "immer": "^9.0.16",
+    "immer": "^9.0.17",
     "jest": "^29.3.1",
     "jest-environment-jsdom": "^29.3.1",
+    "jotai-devtools": "^0.1.0",
     "jotai-immer": "^0.1.0",
     "jotai-optics": "^0.2.0",
     "jotai-redux": "^0.1.0",
@@ -189,11 +190,11 @@
     "json": "^11.0.0",
     "optics-ts": "^2.4.0",
     "postinstall-postinstall": "^2.1.0",
-    "prettier": "^2.8.1",
+    "prettier": "^2.8.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "redux": "^4.2.0",
-    "rollup": "^3.9.0",
+    "rollup": "^3.9.1",
     "rollup-plugin-esbuild": "^5.0.0",
     "rollup-plugin-terser": "^7.0.2",
     "rxjs": "^7.8.0",
@@ -202,14 +203,15 @@
     "ts-node": "^10.9.1",
     "tslib": "^2.4.1",
     "typescript": "^4.9.4",
-    "valtio": "^1.8.0",
+    "valtio": "^1.8.2",
     "wonka": "^6.1.2",
-    "xstate": "^4.35.1",
-    "zustand": "^4.1.5"
+    "xstate": "^4.35.2",
+    "zustand": "^4.3.1"
   },
   "peerDependencies": {
     "@babel/core": "*",
     "@babel/template": "*",
+    "jotai-devtools": "*",
     "jotai-immer": "*",
     "jotai-optics": "*",
     "jotai-redux": "*",
@@ -227,6 +229,9 @@
     "@babel/template": {
       "optional": true
     },
+    "jotai-devtools": {
+      "optional": true
+    },
     "jotai-immer": {
       "optional": true
     },

readme.md

@@ -7,7 +7,7 @@
 
 `npm i jotai` or visit [jotai.org](https://jotai.org)
 
-[![Build Status](https://img.shields.io/github/workflow/status/pmndrs/jotai/Lint?style=flat&colorA=000000&colorB=000000)](https://github.com/pmndrs/jotai/actions?query=workflow%3ALint)
+[![Build Status](https://img.shields.io/github/actions/workflow/status/pmndrs/jotai/lint-and-type.yml?branch=main&style=flat&colorA=000000&colorB=000000)](https://github.com/pmndrs/jotai/actions?query=workflow%3ALint)
 [![Build Size](https://img.shields.io/bundlephobia/minzip/jotai?label=bundle%20size&style=flat&colorA=000000&colorB=000000)](https://bundlephobia.com/result?p=jotai)
 [![Version](https://img.shields.io/npm/v/jotai?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/jotai)
 [![Downloads](https://img.shields.io/npm/dt/jotai.svg?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/jotai)

src/devtools.ts

@@ -1,5 +1,51 @@
-export { useAtomsDebugValue } from './devtools/useAtomsDebugValue'
-export { useAtomDevtools } from './devtools/useAtomDevtools'
-export { useAtomsSnapshot } from './devtools/useAtomsSnapshot'
-export { useGotoAtomsSnapshot } from './devtools/useGotoAtomsSnapshot'
-export { useAtomsDevtools } from './devtools/useAtomsDevtools'
+import * as JotaiDevtools from 'jotai-devtools'
+
+/**
+ * @deprecated use `jotai-devtools` instead.
+ */
+export const useAtomsDebugValue: typeof JotaiDevtools.useAtomsDebugValue = (
+  ...args: any[]
+) => {
+  console.warn('[DEPRECATED]: use `jotai-devtools` instead.')
+  return (JotaiDevtools.useAtomsDebugValue as any)(...args)
+}
+
+/**
+ * @deprecated use `jotai-devtools` instead.
+ */
+export const useAtomDevtools: typeof JotaiDevtools.useAtomDevtools = (
+  ...args: any[]
+) => {
+  console.warn('[DEPRECATED]: use `jotai-devtools` instead.')
+  return (JotaiDevtools.useAtomDevtools as any)(...args)
+}
+
+/**
+ * @deprecated use `jotai-devtools` instead.
+ */
+export const useAtomsSnapshot: typeof JotaiDevtools.useAtomsSnapshot = (
+  ...args: any[]
+) => {
+  console.warn('[DEPRECATED]: use `jotai-devtools` instead.')
+  return (JotaiDevtools.useAtomsSnapshot as any)(...args)
+}
+
+/**
+ * @deprecated use `jotai-devtools` instead.
+ */
+export const useGotoAtomsSnapshot: typeof JotaiDevtools.useGotoAtomsSnapshot = (
+  ...args: any[]
+) => {
+  console.warn('[DEPRECATED]: use `jotai-devtools` instead.')
+  return (JotaiDevtools.useGotoAtomsSnapshot as any)(...args)
+}
+
+/**
+ * @deprecated use `jotai-devtools` instead.
+ */
+export const useAtomsDevtools: typeof JotaiDevtools.useAtomsDevtools = (
+  ...args: any[]
+) => {
+  console.warn('[DEPRECATED]: use `jotai-devtools` instead.')
+  return (JotaiDevtools.useAtomsDevtools as any)(...args)
+}