import * as Ariakit from '@ariakit/react';
import { ModalDialogProvider } from './modal-dialog.context';

export type ModalRootProps = {
  defaultOpen?: boolean;
  open?: boolean;
  onOpenChange?: (open: boolean) => void;
  modal?: boolean;
  children?: React.ReactNode;
};

export function ModalRoot(props: ModalRootProps) {
  const store = Ariakit.useDialogStore({
    open: props.open,
    defaultOpen: props.defaultOpen,
    setOpen: props.onOpenChange,
  });
  const modal = props.modal ?? true;
  const contextValue = { store, modal };
  return (
    <ModalDialogProvider value={contextValue}>
      {props.children}
    </ModalDialogProvider>
  );
}