Guides
Update open content
Swap externally driven modal content while preserving its stack position and promise.
show returns an update function scoped to the new modal:
const { modalID, update } = magicModal.show(() => <UploadModal progress={0} />);
await uploadFile(file, {
onProgress(progress) {
update(() => <UploadModal progress={progress} />);
},
});
magicModal.hide(undefined, { modalID });The modal keeps the same stack position, backdrop, configuration, ID, and pending promise. Only its component is replaced.
The new component mounts from scratch
Local React state from the old component is not preserved. Use update when
the source of truth already lives outside the modal. If the modal owns the
state, update it normally inside the component with state, context, or a
store.