diff --git a/docs/src/demos/Experiments/Details/details.ts b/docs/src/demos/Experiments/Details/details.ts index 97eb10195..7a910d6d2 100644 --- a/docs/src/demos/Experiments/Details/details.ts +++ b/docs/src/demos/Experiments/Details/details.ts @@ -1,4 +1,4 @@ -import { Node, mergeAttributes } from '@tiptap/core' +import { Node, mergeAttributes, Command } from '@tiptap/core' export interface DetailsOptions { HTMLAttributes: { @@ -13,6 +13,8 @@ export default Node.create({ group: 'block', + // defining: true, + defaultOptions: { HTMLAttributes: {}, }, @@ -44,4 +46,30 @@ export default Node.create({ } } }, + + addCommands() { + return { + /** + * Set a details node + */ + setDetails: (): Command => ({ commands }) => { + // TODO: Doesn’t work + return commands.wrapIn('details') + }, + /** + * Toggle a details node + */ + toggleDetails: (): Command => ({ commands }) => { + // TODO: Doesn’t work + return commands.toggleWrap('details') + }, + /** + * Unset a details node + */ + unsetDetails: (): Command => ({ commands }) => { + // TODO: Doesn’t work + return commands.lift('details') + }, + } + }, }) diff --git a/docs/src/demos/Experiments/Details/index.vue b/docs/src/demos/Experiments/Details/index.vue index 0a4dfa97d..544cbc184 100644 --- a/docs/src/demos/Experiments/Details/index.vue +++ b/docs/src/demos/Experiments/Details/index.vue @@ -1,5 +1,9 @@ @@ -39,6 +43,7 @@ export default { A closed details tag

More info about the details.

+

That’s it.

`, }) }, @@ -54,5 +59,18 @@ export default { > * + * { margin-top: 0.75em; } + + details { + summary::before { + content: '▸'; + color: red; + display: inline-block; + width: 1em; + } + + &[open] summary::before { + content: '▾'; + } + } }