How to update the content of the editor if markdown prop changes programmatically?

[soma83]

Is there a way for the component to update when the markdown prop changes?

That is, when the component mounts, it takes the value of that prop by default, so far so good. But if I manually change that value, the component does not update its content.

This is my code:

<MDXEditor
          markdown={value}
          onChange={handleChange}
          readOnly={!editable}
          spellCheck={false}
          autoFocus
          contentEditableClassName={`prose max-w-full ${!editable ? 'cursor-not-allowed' : ''}`}
          plugins={[
            headingsPlugin({allowedHeadingLevels: [1, 2, 3]}),
            markdownShortcutPlugin(),
            listsPlugin({}),
            toolbarPlugin({
              toolbarContents: () => (editable ? (
                <>
                  <UndoRedo/>
                  <Separator/>
                  <BoldItalicUnderlineToggles/>
                  <Separator/>
                  <ListsToggle options={['bullet', 'number']}/>
                  <Separator/>
                  <BlockTypeSelect/>
                </>
              ) : <div/>)
            })
          ]}
        />