import { Modal, ModalProps } from '@wix/design-system';
import React from 'react';
import { ModalState } from '@wix/bex-core';
import { observer } from 'mobx-react-lite';

export interface ModalWrapperProps extends Partial<ModalProps> {
  state: ModalState;
}

function _ModalWrapper({ state, ...rest }: ModalWrapperProps) {
  return (
    <div onClick={(e) => e.stopPropagation()}>
      <Modal isOpen={state.isOpen} onRequestClose={state.close} {...rest} />
    </div>
  );
}

export const ModalWrapper = observer(_ModalWrapper);