react-motion-modal

    Migrating From v1

    v2 replaces the global store and module augmentation with an explicit typed system.

    Registry

    Before:

    declare module 'react-motion-modal' {
  interface ModalDefinition {
    confirm: { title: string };
  }
}

<ModalProvider modals={{ confirm: ConfirmModal }} />

    After:

    const confirm = defineModal({
  component: ConfirmModal,
  preset: motionPresets.dialog(),
});

export const modals = createModalSystem({ confirm });

<ModalProvider system={modals} />

    Component props

    Before:

    function ConfirmModal({ title, closeModal }: ModalParams<'confirm'>) {
  // ...
}

    After:

    function ConfirmModal({
  input,
  resolve,
  cancel,
}: ModalRenderProps<{ title: string }, boolean>) {
  // ...
}

    Opening and completion

    Before:

    modalStore.getState().openModal('confirm', {
  title: 'Delete?',
  onConfirm: deleteItem,
});

    After:

    const outcome = await modals.open('confirm', { title: 'Delete?' });

if (outcome.status === 'resolved' && outcome.value) {
  await deleteItem();
}

    Render options

    Move v1 behavior fields out of business input and into the third open() argument:

    modals.open(
  'confirm',
  { title: 'Delete?' },
  {
    closeOnPressEsc: false,
    ariaLabel: 'Delete confirmation',
  },
);

    There is no compatibility singleton in v2. Migrate one registry at a time, then remove v1 module augmentation and modalStore imports.