archive-gh-me/zustand
1
0
Fork 0
mirror of https://github.com/pmndrs/zustand.git synced 2025-12-08 19:45:52 +00:00
Code Issues Projects Releases Wiki Activity

fix: importing CJS React in ESM (#2154)

Browse Source 
* fix: importing CJS React in ESM

* change disable comment
This commit is contained in:
Daishi Kato 2023-10-31 23:14:22 +09:00 committed by GitHub
parent 13439986a8
commit 70158913da
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 36 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/context.ts
View File

@ -1,15 +1,27 @@
import {
createElement,
createContext as reactCreateContext,
useContext,
useMemo,
useRef,
} from 'react'
// import {
// createElement,
// createContext as reactCreateContext,
// useContext,
// useMemo,
// useRef,
// } from 'react'
// That doesnt work in ESM, because React libs are CJS only.
// The following is a workaround until ESM is supported.
// eslint-disable-next-line import/extensions
import ReactExports from 'react'
import type { ReactNode } from 'react'
import type { StoreApi } from 'zustand'
// eslint-disable-next-line import/extensions
import { useStoreWithEqualityFn } from 'zustand/traditional'
const {
createElement,
createContext: reactCreateContext,
useContext,
useMemo,
useRef,
} = ReactExports
type UseContextStore<S extends StoreApi<unknown>> = {
(): ExtractState<S>
<U>(

7
src/react.ts
View File

@ -1,9 +1,11 @@
import { useDebugValue } from 'react'
// import { useDebugValue } from 'react'
// import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'
// This doesn't work in ESM, because use-sync-external-store only exposes CJS.
// Those don't work in ESM, because React libs are CJS only.
// See: https://github.com/pmndrs/valtio/issues/452
// The following is a workaround until ESM is supported.
// eslint-disable-next-line import/extensions
import ReactExports from 'react'
// eslint-disable-next-line import/extensions
import useSyncExternalStoreExports from 'use-sync-external-store/shim/with-selector'
import { createStore } from './vanilla.ts'
import type {
@ -13,6 +15,7 @@ import type {
StoreMutatorIdentifier,
} from './vanilla.ts'
const { useDebugValue } = ReactExports
const { useSyncExternalStoreWithSelector } = useSyncExternalStoreExports
type ExtractState<S> = S extends { getState: () => infer T } ? T : never

8
src/react/shallow.ts
View File

@ -1,6 +1,12 @@
import { useRef } from 'react'
// import { useDebugValue } from 'react'
// That doesnt work in ESM, because React libs are CJS only.
// The following is a workaround until ESM is supported.
// eslint-disable-next-line import/extensions
import ReactExports from 'react'
import { shallow } from '../vanilla/shallow.ts'
const { useRef } = ReactExports
export function useShallow<S, U>(selector: (state: S) => U): (state: S) => U {
const prev = useRef<U>()

7
src/traditional.ts
View File

@ -1,9 +1,11 @@
import { useDebugValue } from 'react'
// import { useDebugValue } from 'react'
// import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/with-selector'
// This doesn't work in ESM, because use-sync-external-store only exposes CJS.
// Those don't work in ESM, because React libs are CJS only.
// See: https://github.com/pmndrs/valtio/issues/452
// The following is a workaround until ESM is supported.
// eslint-disable-next-line import/extensions
import ReactExports from 'react'
// eslint-disable-next-line import/extensions
import useSyncExternalStoreExports from 'use-sync-external-store/shim/with-selector'
import { createStore } from './vanilla.ts'
import type {
@ -13,6 +15,7 @@ import type {
StoreMutatorIdentifier,
} from './vanilla.ts'
const { useDebugValue } = ReactExports
const { useSyncExternalStoreWithSelector } = useSyncExternalStoreExports
type ExtractState<S> = S extends { getState: () => infer T } ? T : never