Details extension

Use this extension to render Details element. This is great to show and hide content.

Options

Custom HTML attributes that should be added to the rendered HTML tag.

Details.configure({
  HTMLAttributes: {
    class: "my-custom-class",
  },
});

If you need to internationalize this extension, you can use this option.

Details.configure({
  dictionary: {
    name: "Details",
  },
});

Wrap content in a details node.

editor.commands.setDetails();

Unwrap a details node.

editor.commands.unsetDetails();

Wrap content in a details node or unwrap a details node.

editor.commands.toggleDetails();

:::details

::::details{open="true"}
:::detailsSummary
details summary 

**bold**
:::

:::detailsContent
details content

**bold**
:::
::::