Lists: paragraph inside li instead of new list item

1

In 0.12 I’m using prosemirror-schema-list and wrapInList to create lists:

wrapInList(schema.nodes.bullet_list, {})(editor.state, editor.props.onAction);

It’s fine for the first item, however if I hit “enter” within the list, instead of having a new item as expected I’m getting paragraphs within my first (and unique) list item.

The way “enter” is managed comes from commands.baseKeymap by the way. Maybe there needs to be a keymap aware of lists within the prosemirror-schema-list package?

2

The splitListItem command in the prosemirror-schema-list package is what you want. You could bind Enter to that in a separate keymap, which has a higher priority (comes earlier in the list of plugins) than the one built from baseKeymap.

3

Thank you for the response!

I notice something else: wrapInList is creating a ul -> li -> p DOM to start with. When I think about it it’s logical, since the p was already there and I’m asking to wrap it in a list. Is there a way to get rid of this p tag?

4

You could create a schema where list items directly contain text, not blocks, but you’ll have to write your own version of wrapInList, since that one wraps, and you’d need something that strips the paragraph when adding a list.

5

Actually it appears that splitListItem expects a textblock at the top-level of a list-item, so it doesn’t seem to work well with wrapInList.

Is there a demo or example showing how to use lists?

I’ve tried to use commands.setBlockType instead but with no luck (it throws and says “Uncaught RangeError: Invalid content for node type bullet_list”)

6

This is not the case – splitListItem expects a prosemirror-schema-list style list structure.

The example-setup module sets up the proper bindings when it finds list nodes in the schema. The demos set up a schema with lists and use the example-setup module to make key bindings work.

7

Thank you, with the example setup I could get the lists working like I want.

8

Markdown editors may be a context in which it would be desirable for list items to contain inline text directly (instead of blocks), so that users can create lists that look like:

* item one
* item two

vs.

* item one

* item two
2 Likes
9

I somehow just noticed this behaviour. Is there a way to prevent this from happening? This actually is a pretty bad problem for our users right now :frowning:

Edit: To be clear I mean the fact that list items get output with an empty line between them. This actually breaks the markdown formatting, resulting in two different lists.

10

I’m not sure if this still fits the original question of the thread, but it sounds like you’re talking about markdown serialization. In that case you could set the tightLists option to true when working with the MarkdownSerializerState.

1 Like
11

That was the problem! Thanks so much!

1 Like