Reatom with typescript

Reatom and Typescript

#

You don’t need to do anything special because Reatom has out-of-the-box TypeScript support. Inference works as you’d expect.

// AtomMut<number>
const numAtom = atom(3)

// AtomMut<string>
const strAtom = atom('foo')

// Atom<string | number>
const dynamicAtom = atom((ctx) => {
  const num = ctx.spy(numAtom)
  const str = ctx.spy(strAtom)
  return num > 0 ? num : str
})

It is recommended to set strict: true or strictNullChecks: true in your tsconfig.json project for a better experience.

/* strictNullChecks: true */
// AtomMut<string | null>
const nullableAtom = atom<string | null>(null)

/* strictNullChecks: false */
// AtomMut<string>
const nullableAtom = atom<string | null>(null)

You can play with this example on typescript playground↗