1 | import * as React from "react";
|
2 | import {
|
3 | SealedInitialState,
|
4 | useSealedState,
|
5 | } from "reakit-utils/useSealedState";
|
6 | import {
|
7 | useDisclosureState,
|
8 | DisclosureState,
|
9 | DisclosureActions,
|
10 | DisclosureInitialState,
|
11 | DisclosureStateReturn,
|
12 | } from "../Disclosure/DisclosureState";
|
13 |
|
14 | export type DialogState = DisclosureState & {
|
15 | |
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 |
|
22 | modal: boolean;
|
23 | |
24 |
|
25 |
|
26 | unstable_disclosureRef: React.MutableRefObject<HTMLElement | null>;
|
27 | };
|
28 |
|
29 | export type DialogActions = DisclosureActions & {
|
30 | |
31 |
|
32 |
|
33 | setModal: React.Dispatch<React.SetStateAction<DialogState["modal"]>>;
|
34 | };
|
35 |
|
36 | export type DialogInitialState = DisclosureInitialState &
|
37 | Partial<Pick<DialogState, "modal">>;
|
38 |
|
39 | export type DialogStateReturn = DisclosureStateReturn &
|
40 | DialogState &
|
41 | DialogActions;
|
42 |
|
43 | export function useDialogState(
|
44 | initialState: SealedInitialState<DialogInitialState> = {}
|
45 | ): DialogStateReturn {
|
46 | const { modal: initialModal = true, ...sealed } = useSealedState(
|
47 | initialState
|
48 | );
|
49 |
|
50 | const disclosure = useDisclosureState(sealed);
|
51 | const [modal, setModal] = React.useState(initialModal);
|
52 | const disclosureRef = React.useRef<HTMLElement | null>(null);
|
53 |
|
54 | return {
|
55 | ...disclosure,
|
56 | modal,
|
57 | setModal,
|
58 | unstable_disclosureRef: disclosureRef,
|
59 | };
|
60 | }
|