How to use the prosemirror-schema-list.addListNodes function in prosemirror-schema-list

To help you get started, we’ve selected a few prosemirror-schema-list examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ProseMirror / website / example / basic / index.js View on Github external
// code{
import {EditorState} from "prosemirror-state"
import {EditorView} from "prosemirror-view"
import {Schema, DOMParser} from "prosemirror-model"
import {schema} from "prosemirror-schema-basic"
import {addListNodes} from "prosemirror-schema-list"
import {exampleSetup} from "prosemirror-example-setup"

// Mix the nodes from prosemirror-schema-list into the basic schema to
// create a schema with list support.
const mySchema = new Schema({
  nodes: addListNodes(schema.spec.nodes, "paragraph block*", "block"),
  marks: schema.spec.marks
})

window.view = new EditorView(document.querySelector("#editor"), {
  state: EditorState.create({
    doc: DOMParser.fromSchema(mySchema).parse(document.querySelector("#content")),
    plugins: exampleSetup({schema: mySchema})
  })
})
// }
github pubpub / pubpub-editor / packages / pubpub-prose / src / prosemirror-setup / schema / buildSchema.js View on Github external
},
	toDOM: function(node) {
		return ['span', node.attrs.content];
	},
	inline: true,
};


const schemaNodes = basicSchema.spec.nodes
.addBefore('horizontal_rule', 'page_break', PageBreak)
.addBefore('horizontal_rule', 'emoji', Emoji);

// const listSchema = addListNodes(schemaNodes, "paragraph block*", "block");
// const tableSchema = addTableNodes(listSchema, "paragraph block*", "block");

const listSchema = addListNodes(schemaNodes, 'paragraph block*', 'block');
const tableSchema = addTableNodes(listSchema, 'paragraph block*', 'block');

export const schema = new Schema({
	nodes: tableSchema,
	marks: basicSchema.spec.marks.addBefore('code', 'sub', SubMark).addBefore('code', 'sup', SupMark).addBefore('code', 'strike', StrikeThroughMark),
	topNode: 'doc'
});

export const createSchema = () => {
	return new Schema({
		nodes: tableSchema,
		marks: basicSchema.markSpec.addBefore('code', 'sub', SubMark).addBefore('code', 'sup', SupMark).addBefore('code', 'strike', StrikeThroughMark)
	});
};

const migrateMarks = (node)=> {
github ProseMirror / prosemirror-test-builder / src / index.js View on Github external
import {schema} from "prosemirror-schema-basic"
import {addListNodes} from "prosemirror-schema-list"
import {Schema} from "prosemirror-model"

import builders from "./build"

const testSchema = new Schema({
  nodes: addListNodes(schema.spec.nodes, "paragraph block*", "block"),
  marks: schema.spec.marks
})

const out = builders(testSchema, {
  p: {nodeType: "paragraph"},
  pre: {nodeType: "code_block"},
  h1: {nodeType: "heading", level: 1},
  h2: {nodeType: "heading", level: 2},
  h3: {nodeType: "heading", level: 3},
  li: {nodeType: "list_item"},
  ul: {nodeType: "bullet_list"},
  ol: {nodeType: "ordered_list"},
  br: {nodeType: "hard_break"},
  img: {nodeType: "image", src: "img.png"},
  hr: {nodeType: "horizontal_rule"},
  a: {markType: "link", href: "foo"},
github ProseMirror / website / src / collab / schema.js View on Github external
const {Schema} = require("prosemirror-model")
const {schema: base} = require("prosemirror-schema-basic")
const {addListNodes} = require("prosemirror-schema-list")

exports.schema = new Schema({
  nodes: addListNodes(base.spec.nodes, "paragraph block*", "block"),
  marks: base.spec.marks
})
github ProseMirror / prosemirror / demo / demo.js View on Github external
const {Schema, DOMParser} = require("prosemirror-model")
const {EditorView, Decoration, DecorationSet} = require("prosemirror-view")
const {EditorState, TextSelection, Plugin} = require("prosemirror-state")
const {schema} = require("prosemirror-schema-basic")
const {addListNodes} = require("prosemirror-schema-list")
const {exampleSetup} = require("prosemirror-example-setup")

const demoSchema = new Schema({
  nodes: addListNodes(schema.spec.nodes, "paragraph block*", "block"),
  marks: schema.spec.marks
})

let state = EditorState.create({doc: DOMParser.fromSchema(demoSchema).parse(document.querySelector("#content")),
                                plugins: exampleSetup({schema: demoSchema})})

let view = window.view = new EditorView(document.querySelector(".full"), {state})
github ProseMirror / website / src / demo / basic.js View on Github external
const {EditorState} = require("prosemirror-state")
const {MenuBarEditorView} = require("prosemirror-menu")
const {DOMParser, Schema} = require("prosemirror-model")
const {schema: baseSchema} = require("prosemirror-schema-basic")
const {addListNodes} = require("prosemirror-schema-list")
const {exampleSetup} = require("prosemirror-example-setup")

const schema = new Schema({
  nodes: addListNodes(baseSchema.spec.nodes, "paragraph block*", "block"),
  marks: baseSchema.spec.marks
})

let content = document.querySelector("#content")
content.style.display = "none"

let tip = document.querySelector(".demotip")

let view = new MenuBarEditorView(document.querySelector("#editor"), {
  state: EditorState.create({
    doc: DOMParser.fromSchema(schema).parse(content),
    plugins: exampleSetup({schema})
  }),
  onFocus() {
    if (tip) {
      tip.innerHTML = "<a style="text-decoration: none; pointer-events: auto; color: inherit" href="#demos">Find more demos below ↓</a>"
github guardian / prosemirror-noting / pages / index.ts View on Github external
import createDocumentValidatorPlugin, {
  validateDocument
} from "../src/js/index";

const spinMe = document.getElementById("spin-me");
let rotation = 0;
const commenceTheSpinning = () => {
  spinMe && (spinMe.style.transform = `rotate(${rotation}deg)`);
  rotation += 4;
  if (rotation > 360) rotation = 0;
  requestAnimationFrame(commenceTheSpinning);
};
commenceTheSpinning();

const mySchema = new Schema({
  nodes: addListNodes(schema.spec.nodes as any, "paragraph block*", "block"),
  marks: {
    ...marks,
    ...validationMarks
  }
});

const contentElement =
  document.querySelector("#content") || document.createElement("content");
const doc = DOMParser.fromSchema(mySchema).parse(contentElement);
const historyPlugin = history();
const editorElement = document.querySelector("#editor");

editorElement &&
  ((window as any).editor = new EditorView(editorElement, {
    state: EditorState.create({
      doc,
github guardian / facia-tool / client-v2 / src / components / inputs / richtext / setup.ts View on Github external
import { RefObject } from 'react';
import { WrappedFieldInputProps } from 'redux-form';
import OrderedMap from 'orderedmap';
import { history } from 'prosemirror-history';

const createBasePlugins = (s: Schema) =&gt; {
  const plugins = [
    keymap(buildKeymap(s, {}, {})),
    keymap(baseKeymap),
    history({ depth: 100, newGroupDelay: 500 })
  ];
  return plugins;
};

export const basicSchema = new Schema({
  nodes: addListNodes(
    schema.spec.nodes as OrderedMap,
    'paragraph block*',
    'block'
  ),
  marks: schema.spec.marks
});

export const createEditorView = (
  input: WrappedFieldInputProps,
  editorEl: RefObject,
  contentEl: HTMLDivElement
) =&gt; {
  if (!editorEl.current) {
    return;
  }
  const ed: EditorView = new EditorView(editorEl.current, {
github pubpub / pubpub / src / components / AtomTypes / Document / proseEditor / schema.js View on Github external
figureName: nodeAttrs.figureName,
				nodeId: nodeAttrs.nodeId,
				children: null,
				childNodes: null,
			};
		}
	}],
	inline: false,
	group: 'block',
	draggable: false,
	isTextblock: true,
	locked: true,
};

const schemaNodes = basicSchema.nodeSpec.addBefore('image', 'embed', Embed).addBefore('image', 'block_embed', BlockEmbed).addBefore('horizontal_rule', 'page_break', PageBreak).addBefore('image', 'emoji', Emoji);
const listSchema = addListNodes(schemaNodes, "paragraph block*", "block");
const tableSchema = addTableNodes(listSchema, "paragraph block*", "block");

export const schema = new Schema({
	nodes: tableSchema,
	marks: basicSchema.markSpec.addBefore('code', 'sub', SubMark).addBefore('code', 'sup', SupMark).addBefore('code', 'strike', StrikeThroughMark)
});

export const createSchema = () => {
  return new Schema({
  	nodes: tableSchema,
  	marks: basicSchema.markSpec.addBefore('code', 'sub', SubMark).addBefore('code', 'sup', SupMark).addBefore('code', 'strike', StrikeThroughMark)
  });
}


const EmbedType = schema.nodes.embed;
github guardian / prosemirror-invisibles / pages / index.js View on Github external
import { EditorState } from 'prosemirror-state';
import { EditorView } from 'prosemirror-view';
import { Schema, DOMParser } from 'prosemirror-model';
import { schema } from 'prosemirror-schema-basic';
import { addListNodes } from 'prosemirror-schema-list';
import { exampleSetup } from 'prosemirror-example-setup';
import invisibles, { hardBreak, paragraph, space } from '../src/js';

import 'prosemirror-view/style/prosemirror.css';
import 'prosemirror-menu/style/menu.css';
import 'prosemirror-example-setup/style/style.css';
import '../src/css/invisibles.scss';

const mySchema = new Schema({
  nodes: addListNodes(schema.spec.nodes, 'paragraph block*', 'block'),
  marks: schema.spec.marks
});

new EditorView(document.querySelector('#editor'), {
  state: EditorState.create({
    doc: DOMParser.fromSchema(mySchema).parse(
      document.querySelector('#content')
    ),
    plugins: [
      ...exampleSetup({ schema: mySchema }),
      invisibles([hardBreak(), paragraph(), space()])
    ]
  })
});