-
Notifications
You must be signed in to change notification settings - Fork 141
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'origin/master' into SHRUI-1038
- Loading branch information
Showing
10 changed files
with
1,345 additions
and
1,352 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import { renderHook } from '@testing-library/react' | ||
|
||
import { useId } from './useId' | ||
|
||
describe('useId', () => { | ||
it('defaultId を指定した場合、毎回同じ値を返す', () => { | ||
const { result: id1 } = renderHook(() => useId('test')) | ||
const { result: id2 } = renderHook(() => useId('test')) | ||
const { result: id3 } = renderHook(() => useId('test')) | ||
|
||
expect(id1.current).toEqual('test') | ||
expect(id2.current).toEqual('test') | ||
expect(id3.current).toEqual('test') | ||
}) | ||
|
||
it('defaultId を指定しない場合、異なる値を返す', () => { | ||
const { result: id1 } = renderHook(() => useId()) | ||
const { result: id2 } = renderHook(() => useId()) | ||
const { result: id3 } = renderHook(() => useId()) | ||
|
||
expect(id1.current).not.toEqual(id2.current) | ||
expect(id2.current).not.toEqual(id3.current) | ||
expect(id3.current).not.toEqual(id1.current) | ||
}) | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,35 +1,6 @@ | ||
import React, { ReactNode, VFC, createContext, useContext, useMemo } from 'react' | ||
|
||
type IdContextValue = { | ||
prefix: number | ||
current: number | ||
} | ||
|
||
const defaultContext: IdContextValue = { | ||
prefix: 0, | ||
current: 0, | ||
} | ||
|
||
const IdContext = createContext<IdContextValue>(defaultContext) | ||
|
||
function useId_OLD() { | ||
const context = useContext(IdContext) | ||
return useMemo(() => `id-${context.prefix}-${++context.current}`, [context]) | ||
} | ||
import React from 'react' | ||
|
||
export const useId = (defaultId?: string): string => { | ||
if (defaultId) return defaultId | ||
|
||
// React v18 以降は React.useId を使う | ||
return ('useId' in React ? React.useId : useId_OLD)() | ||
} | ||
|
||
export const SequencePrefixIdProvider: VFC<{ children: ReactNode }> = ({ children }) => { | ||
const context = useContext(IdContext) | ||
// increment `prefix` and reset `current` to 0 on every Provider | ||
const value: IdContextValue = { | ||
prefix: context.prefix + 1, | ||
current: 0, | ||
} | ||
return <IdContext.Provider value={value}>{children}</IdContext.Provider> | ||
const id = React.useId() | ||
return defaultId || id | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.