Toggle bullet list is not working


#1

We want to toggle bullet list. We are using liftListItem to do that. But it’s not working as expected.

com-video-to-gif%20(1)

Here is toogleListFunction:

export function toggleList(schema: Schema, listType: NodeType) {
  function isList(node: Node) {
    return node.type === schema.nodes.bullet_list || node.type === schema.nodes.ordered_list;
  }

  const wrap = wrapInList(listType);

  return (state: EditorState, dispatch: (tr: Transaction<Schema>) => void) => {
    const bulletListParentDetails = findParentNodeClosestToPos(state, "bullet_list");
    const orderedListParentDetails = findParentNodeClosestToPos(state, "ordered_list");

    const parentNodeDetails = bulletListParentDetails || orderedListParentDetails;
    const parentNode = parentNodeDetails && parentNodeDetails.node;
    const parentNodePosition = parentNodeDetails && parentNodeDetails.pos;

    if (parentNode && parentNodePosition) {
      if (parentNode.type === listType) { // To toggle bullet list
        return liftListItem(listType)(state, dispatch);
      }

      if (isList(parentNode)) { // To toggle b/w bullet list and ordered list
        const tr = state.tr;
        tr.setNodeMarkup(parentNodePosition, listType);
        if (dispatch) dispatch(tr);
        return true;
      }
    }

    return wrap(state, dispatch);
  };
}

Here is schema:

const nodes = {
  story: {
    content: "card*"
  },
  card: {
    selectable: false,
    atom: true,
    marks: "",
    isolating: true,
    content: "story_element*",
    attrs: {
      id: { default: "" },
      "content-version-id": { default: "" },
      "story-version-id": { default: "" },
      "client-id": { default: "" }
    },
    parseDOM: [{ tag: "div.card" }],
    toDOM() {
      return ["div", { class: "card" }, 0];
    }
  },
  story_element_text: {
    group: "story_element",
    content: "block*",
    atom: true,
    isolating: true,
    attrs: {
      id: { default: "" },
      "client-id": { default: "" },
      type: { default: "text" },
      subtype: { default: null },
      "story-version-id": { default: "" },
      "card-id": { default: "" }
    },
    parseDOM: [{ tag: "div.story-element.story-element-text" }],
    toDOM() {
      return ["div", { class: "story-element story-element-text" }, 0];
    }
  },
  paragraph: {
    content: "inline*",
    group: "block",
    parseDOM: [{ tag: "p" }],
    toDOM() {
      return ["p", 0];
    }
  },
  text: {
    group: "inline"
  }
};

const schema = new Schema({
  nodes: addListNodes(OrderedMap.from(nodes), "(paragraph | heading) block*", "block"),
  marks,
  topNode: "story"
});