Function Modal

starters/hooks/src/Modal.tsx:39–52

({state, children, ...props}: ModalProps)

}

export function Modal({state, children, ...props}: ModalProps) {
  let ref = useRef<HTMLDivElement>(null);
  let {modalProps, underlayProps} = useModalOverlay(props, state, ref);

  return (
    <Overlay>
      <div {...underlayProps} className="react-aria-ModalOverlay">
        <div {...modalProps} ref={ref} className="react-aria-Modal">
          <OverlayStateContext.Provider value={state}>{children}</OverlayStateContext.Provider>
        </div>
      </div>
    </Overlay>
  );
}

export function ModalTrigger({label, children, ...props}: ModalTriggerProps) {
  let state = useOverlayTriggerState(props);