How to use slate-hyperscript - 10 common examples

To help you get started, we’ve selected a few slate-hyperscript 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 ConvertKit / slate-plugins / packages / slate-testing-library / src / index.js View on Github external
/** @jsx h */
import { Editor } from "slate";
import hyperprint from "slate-hyperprint";
import events from "./events";
import { createHTM } from "@convertkit/slate-htm";
import { createHyperscript } from "slate-hyperscript";
import diff from "jest-diff";

const h = createHyperscript({});
const html = createHTM({});

const SlateTest = options => {
  // Create a value that is normalized using the same options as the editor.
  const createValue = children => {
    const editor = new Editor(options);
    const value = html`
      
        ${children}
      
    `;

    editor.setValue(value);
    return editor.value;
  };
github GitbookIO / slate-edit-list / value.js View on Github external
/** @jsx h */
// eslint-disable-next-line import/no-extraneous-dependencies
import { createHyperscript } from 'slate-hyperscript';

const h = createHyperscript({
    blocks: {
        heading: 'heading',
        paragraph: 'paragraph',
        ul_list: 'ul_list',
        ol_list: 'ol_list',
        list_item: 'list_item'
    }
});

export default (
    
        
            Slate + List Edition
            
                This page is a basic example of Slate + slate-edit-list plugin.
                Press Enter in a list to create a new list item. Press Enter
github GitbookIO / slate-edit-table / example / value.js View on Github external
/** @jsx h */
// eslint-disable-next-line
import { createHyperscript } from 'slate-hyperscript';

const h = createHyperscript({
    blocks: {
        heading: 'heading',
        paragraph: 'paragraph',
        table: 'table',
        table_row: 'table_row',
        table_cell: 'table_cell'
    }
});

const value = (
    
        
            Slate + Table Edition
            
                This page is a basic example of Slate + slate-edit-table plugin.
github GitbookIO / slate-hyperprint / website / value.js View on Github external
/** @jsx h */
// eslint-disable-next-line import/no-extraneous-dependencies
import { createHyperscript } from 'slate-hyperscript';

const h = createHyperscript({
    blocks: {
        paragraph: 'paragraph',
        heading: 'heading',
        code_block: 'code_block',
        code_line: 'code_line'
    },
    inlines: {},
    marks: {}
});

export default (
    
        
            {'Slate Hyperprint'}
            
                {
github ianstormtaylor / slate / benchmark / helpers / h.js View on Github external
/* eslint-disable import/no-extraneous-dependencies */
const { createHyperscript } = require('slate-hyperscript')

/**
 * Define a hyperscript.
 *
 * @type {Function}
 */

const h = createHyperscript({
  blocks: {
    line: 'line',
    paragraph: 'paragraph',
    quote: 'quote',
    code: 'code',
    list: 'list',
    item: 'item',
    image: 'image',
    table: 'table',
    tbody: 'tbody',
    tr: 'tr',
    td: 'td',
    thead: 'thead',
    th: 'th',
  },
  inlines: {
github GitbookIO / slate-edit-table / example / state.js View on Github external
/** @jsx h */
// eslint-disable-next-line
import { createHyperscript } from 'slate-hyperscript';

const h = createHyperscript({
    blocks: {
        heading: 'heading',
        paragraph: 'paragraph',
        table: 'table',
        table_row: 'table_row',
        table_cell: 'table_cell'
    }
});

const state = (
    
        
            Slate + Table Edition
            
                This page is a basic example of Slate + slate-edit-table plugin.
github GitbookIO / slate-hyperprint / tests / h.js View on Github external
import { createHyperscript } from 'slate-hyperscript';

const h = createHyperscript({
    blocks: {
        paragraph: 'paragraph',
        heading: 'heading',
        code_block: 'code_block',
        code_line: 'code_line',
        image: {
            type: 'image',
            isVoid: true
        }
    },
    inlines: {
        link: 'link'
    },
    marks: {
        bold: 'bold',
        italic: 'italic'
github ianstormtaylor / slate / site / examples / paste-html.js View on Github external
el.childNodes[0].nodeName === 'CODE'
  ) {
    parent = el.childNodes[0]
  }

  const children = Array.from(parent.childNodes)
    .map(deserialize)
    .flat()

  if (el.nodeName === 'BODY') {
    return jsx('fragment', {}, children)
  }

  if (ELEMENT_TAGS[nodeName]) {
    const attrs = ELEMENT_TAGS[nodeName](el)
    return jsx('element', attrs, children)
  }

  if (TEXT_TAGS[nodeName]) {
    const attrs = TEXT_TAGS[nodeName](el)
    return children.map(child => jsx('text', attrs, child))
  }

  return children
}
github Sefaria / Sefaria-Project / static / js / Editor.jsx View on Github external
el.childNodes[0] &&
        el.childNodes[0].nodeName === 'CODE'
    ) {
        parent = el.childNodes[0]
    }

    const children = Array.from(parent.childNodes).map(deserialize)


    if (el.nodeName === 'BODY') {
        return jsx('fragment', {}, children)
    }

    if (ELEMENT_TAGS[nodeName]) {
        const attrs = ELEMENT_TAGS[nodeName](el)
        return jsx('element', attrs, children)
    }

    if (TEXT_TAGS[nodeName]) {
        const attrs = TEXT_TAGS[nodeName](el)
        return children.map(child => jsx('text', attrs, child))
    }


    return children
};
github ianstormtaylor / slate / site / examples / paste-html.js View on Github external
let parent = el

  if (
    nodeName === 'PRE' &&
    el.childNodes[0] &&
    el.childNodes[0].nodeName === 'CODE'
  ) {
    parent = el.childNodes[0]
  }

  const children = Array.from(parent.childNodes)
    .map(deserialize)
    .flat()

  if (el.nodeName === 'BODY') {
    return jsx('fragment', {}, children)
  }

  if (ELEMENT_TAGS[nodeName]) {
    const attrs = ELEMENT_TAGS[nodeName](el)
    return jsx('element', attrs, children)
  }

  if (TEXT_TAGS[nodeName]) {
    const attrs = TEXT_TAGS[nodeName](el)
    return children.map(child => jsx('text', attrs, child))
  }

  return children
}

slate-hyperscript

A hyperscript helper for creating Slate documents.

MIT
Latest version published 6 months ago

Package Health Score

83 / 100
Full package analysis