fix recipe import placeholders in docs recipes

docs/recipes/atom-with-compare.mdx

@@ -30,10 +30,14 @@ export function atomWithCompare<Value>(
 Here's how you'd use it to make an atom that ignores updates that are shallow-equal:
 
 ```ts
-import { atomWithCompare } from 'XXX'
-import { shallowEquals } from 'YYY'
+import { atomWithCompare } from './atomWithCompare'
 import { CSSProperties } from 'react'
 
+const shallowEquals = (a: CSSProperties, b: CSSProperties) =>
+  Object.keys(a).every(
+    (key) => Object.is(a[key as keyof CSSProperties], b[key as keyof CSSProperties]),
+  ) && Object.keys(b).every((key) => key in a)
+
 const styleAtom = atomWithCompare<CSSProperties>(
   { backgroundColor: 'blue' },
   shallowEquals,

docs/recipes/atom-with-toggle-and-storage.mdx

@@ -33,7 +33,7 @@ export function atomWithToggleAndStorage(
 And how it's used:
 
 ```js
-import { atomWithToggleAndStorage } from 'XXX'
+import { atomWithToggleAndStorage } from './atomWithToggleAndStorage'
 
 // will have an initial value set to false & get stored in localStorage under the key "isActive"
 const isActiveAtom = atomWithToggleAndStorage('isActive')

docs/recipes/atom-with-toggle.mdx

@@ -30,7 +30,7 @@ The setter function can have an optional argument to force a particular state, s
 Here is how it's used.
 
 ```js
-import { atomWithToggle } from 'XXX'
+import { atomWithToggle } from './atomWithToggle'
 
 // will have an initial value set to true
 const isActiveAtom = atomWithToggle(true)