Make image block inside custom action

[duhaime]

Is it possible to change the following command syntax so as to insert a block image?

import { commands as milkdownCommands } from "@milkdown/preset-commonmark";

export const CustomCommand = createCmdKey();
const myPlugin = () => async (ctx) => {
  await ctx.wait(CommandsReady);
  const commandManager = ctx.get(commandsCtx);
  const schema = ctx.get(schemaCtx);

  commandManager.create(CustomCommand, () => {
    return () => {
      const url = "https://via.placeholder.com/450x300"
      ctx.get(commandsCtx).call(milkdownCommands.InsertImage, url)
    }
  });
};

I thought I could do something like:

import { commonmark, image, commands as milkdownCommands } from "@milkdown/preset-gfm";

    editor
      .use(commonmark.configure({
        image: {
          isBlock: true,
        }
      }))

but that doesn't work...

[duhaime]

Aha, one can literally just chain commands seriatim:

export const CustomCommand = createCmdKey();
const myPlugin = () => async (ctx) => {
  await ctx.wait(CommandsReady);
  const commandManager = ctx.get(commandsCtx);
  const schema = ctx.get(schemaCtx);

  commandManager.create(CustomCommand, () => {
    return () => {
      const url = "https://via.placeholder.com/450x300"
      ctx.get(commandsCtx).call(milkdownCommands.InsertHardbreak)
      ctx.get(commandsCtx).call(milkdownCommands.InsertImage, url)
      ctx.get(commandsCtx).call(milkdownCommands.InsertHardbreak)
    }
  });
};