Modal ModalState.tsx

28.57% Statements 2/7

0% Branches 0/2

33.33% Functions 1/3

33.33% Lines 2/6

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32  
 
 
 
 
 
 
 
 
 
 
8x
 
 
456x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import * as React from 'react';
import {
  useDialogState,
  DialogStateReturn as ReakitDialogStateReturn,
  DialogInitialState as ReakitDialogInitialState
} from 'reakit';
import { isFunction } from '../utils';
 
export type ModalStateReturn = ReakitDialogStateReturn;
export type ModalInitialState = ReakitDialogInitialState;
 
export const ModalContext = React.createContext({ modal: {} });
 
export function useModalState(initialState?: ModalInitialState) {
  return useDialogState(initialState);
}
 
export function ModalState(
  props: {
    children?: React.ReactNode | ((state: ModalStateReturn) => React.ReactElement<any>);
  } & ModalInitialState
) {
  const { children, ...restProps } = props;
  const modal = useModalState(restProps);
  const contextValue = React.useMemo(() => ({ modal }), [modal]);
  return (
    <ModalContext.Provider value={contextValue}>
      {isFunction(props.children) ? props.children(modal) : props.children}
    </ModalContext.Provider>
  );
}