mirror of
https://github.com/ianstormtaylor/slate.git
synced 2025-08-07 07:46:32 +02:00
move plaintext serializer out of core
This commit is contained in:
@@ -1,23 +1,66 @@
|
|||||||
|
|
||||||
import Editor from '../..'
|
import Editor, { Character, Document, Element, State, Text } from '../..'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import ReactDOM from 'react-dom'
|
import ReactDOM from 'react-dom'
|
||||||
import { Plaintext } from '../..'
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* State.
|
* The initial editor state.
|
||||||
|
*
|
||||||
|
* @type {String}
|
||||||
*/
|
*/
|
||||||
|
|
||||||
const state = 'This is editable plain text, just like a <textarea>!'
|
const state = 'This is editable plain text, just like a <textarea>!'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* App.
|
* A helper to deserialize a string into an editor state.
|
||||||
|
*
|
||||||
|
* @param {String} string
|
||||||
|
* @return {State} state
|
||||||
|
*/
|
||||||
|
|
||||||
|
function deserialize(string) {
|
||||||
|
const characters = string
|
||||||
|
.split('')
|
||||||
|
.reduce((list, char) => {
|
||||||
|
return list.push(Character.create({ text: char }))
|
||||||
|
}, Character.createList())
|
||||||
|
|
||||||
|
const text = Text.create({ characters })
|
||||||
|
const texts = Element.createMap([text])
|
||||||
|
const node = Element.create({
|
||||||
|
type: 'paragraph',
|
||||||
|
nodes: texts,
|
||||||
|
})
|
||||||
|
|
||||||
|
const nodes = Element.createMap([node])
|
||||||
|
const document = Document.create({ nodes })
|
||||||
|
const state = State.create({ document })
|
||||||
|
return state
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A helper to serialize an editor state into a string.
|
||||||
|
*
|
||||||
|
* @param {State} state
|
||||||
|
* @return {String} string
|
||||||
|
*/
|
||||||
|
|
||||||
|
function serialize(state) {
|
||||||
|
return state.document.nodes
|
||||||
|
.map(node => node.text)
|
||||||
|
.join('\n')
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The example's app.
|
||||||
|
*
|
||||||
|
* @type {Component} App
|
||||||
*/
|
*/
|
||||||
|
|
||||||
class App extends React.Component {
|
class App extends React.Component {
|
||||||
|
|
||||||
state = {
|
state = {
|
||||||
state: Plaintext.deserialize(state)
|
state: deserialize(state)
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@@ -28,7 +71,7 @@ class App extends React.Component {
|
|||||||
console.groupCollapsed('Change!')
|
console.groupCollapsed('Change!')
|
||||||
console.log('Document:', state.document.toJS())
|
console.log('Document:', state.document.toJS())
|
||||||
console.log('Selection:', state.selection.toJS())
|
console.log('Selection:', state.selection.toJS())
|
||||||
console.log('Content:', Plaintext.serialize(state))
|
console.log('Content:', serialize(state))
|
||||||
console.groupEnd()
|
console.groupEnd()
|
||||||
this.setState({ state })
|
this.setState({ state })
|
||||||
}}
|
}}
|
||||||
|
@@ -23,4 +23,3 @@ export { default as Text } from './models/text'
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
export { default as Raw } from './serializers/raw'
|
export { default as Raw } from './serializers/raw'
|
||||||
export { default as Plaintext } from './serializers/plaintext'
|
|
||||||
|
@@ -1,55 +0,0 @@
|
|||||||
|
|
||||||
import Character from '../models/character'
|
|
||||||
import Element from '../models/element'
|
|
||||||
import Text from '../models/text'
|
|
||||||
import Document from '../models/document'
|
|
||||||
import State from '../models/state'
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Serialize a `state` into a plaintext `string`.
|
|
||||||
*
|
|
||||||
* @param {State} state
|
|
||||||
* @return {String} string
|
|
||||||
*/
|
|
||||||
|
|
||||||
function serialize(state) {
|
|
||||||
return state.document.nodes
|
|
||||||
.map(node => node.text)
|
|
||||||
.join('\n')
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Deserialize a plaintext `string` into a `state`.
|
|
||||||
*
|
|
||||||
* @param {String} string
|
|
||||||
* @return {State} state
|
|
||||||
*/
|
|
||||||
|
|
||||||
function deserialize(string) {
|
|
||||||
const characters = string
|
|
||||||
.split('')
|
|
||||||
.reduce((list, char) => {
|
|
||||||
return list.push(Character.create({ text: char }))
|
|
||||||
}, Character.createList())
|
|
||||||
|
|
||||||
const text = Text.create({ characters })
|
|
||||||
const texts = Element.createMap([text])
|
|
||||||
const node = Element.create({
|
|
||||||
type: 'paragraph',
|
|
||||||
nodes: texts,
|
|
||||||
})
|
|
||||||
|
|
||||||
const nodes = Element.createMap([node])
|
|
||||||
const document = Document.create({ nodes })
|
|
||||||
const state = State.create({ document })
|
|
||||||
return state
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Export.
|
|
||||||
*/
|
|
||||||
|
|
||||||
export default {
|
|
||||||
serialize,
|
|
||||||
deserialize
|
|
||||||
}
|
|
Reference in New Issue
Block a user