mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-31 19:01:54 +02:00
Code Issues Releases Wiki Activity

update examples for terse raw

Browse Source
This commit is contained in:
Ian Storm Taylor
2016-07-25 14:45:37 -07:00
parent 98c78e4d96
commit d78ddeabad
14 changed files with 31 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
examples/auto-markdown/index.js
View File

@@ -1,5 +1,5 @@
import { Editor, Raw } from '../..' import { Editor, Raw, wrap } from '../..'
import React from 'react' import React from 'react'
import keycode from 'keycode' import keycode from 'keycode'
import initialState from './state.json' import initialState from './state.json'
@@ -11,15 +11,15 @@ import initialState from './state.json'
*/ */
const NODES = { const NODES = {
'block-quote': props => <blockquote {...props.attributes}>{props.children}</blockquote>, 'block-quote': props => <blockquote>{props.children}</blockquote>,
'bulleted-list': props => <ul {...props.attributes}>{props.children}</ul>, 'bulleted-list': props => <ul>{props.children}</ul>,
'heading-one': props => <h1 {...props.attributes}>{props.children}</h1>, 'heading-one': props => <h1>{props.children}</h1>,
'heading-two': props => <h2 {...props.attributes}>{props.children}</h2>, 'heading-two': props => <h2>{props.children}</h2>,
'heading-three': props => <h3 {...props.attributes}>{props.children}</h3>, 'heading-three': props => <h3>{props.children}</h3>,
'heading-four': props => <h4 {...props.attributes}>{props.children}</h4>, 'heading-four': props => <h4>{props.children}</h4>,
'heading-five': props => <h5 {...props.attributes}>{props.children}</h5>, 'heading-five': props => <h5>{props.children}</h5>,
'heading-six': props => <h6 {...props.attributes}>{props.children}</h6>, 'heading-six': props => <h6>{props.children}</h6>,
'list-item': props => <li {...props.attributes}>{props.children}</li> 'list-item': props => <li>{props.children}</li>
} }
/** /**
@@ -37,7 +37,7 @@ class AutoMarkdown extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

2
examples/code-highlighting/index.js
View File

@@ -48,7 +48,7 @@ class CodeHighlighting extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

2
examples/development/performance-rich/index.js
View File

@@ -64,7 +64,7 @@ class RichText extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

12
examples/development/performance-rich/state.json
View File

@@ -77,11 +77,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "A wise quote."
{
"text": "A wise quote."
}
]
} }
] ]
}, },
@@ -91,11 +87,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "Try it out for yourself!"
{
"text": "Try it out for yourself!"
}
]
} }
] ]
} }

2
examples/hovering-menu/index.js
View File

@@ -44,7 +44,7 @@ class HoveringMenu extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

16
examples/images/index.js
View File

@@ -1,5 +1,5 @@
import { Editor, Draggable, Raw, Void } from '../..' import { Editor, Raw, wrap } from '../..'
import React from 'react' import React from 'react'
import ReactDOM from 'react-dom' import ReactDOM from 'react-dom'
import initialState from './state.json' import initialState from './state.json'
@@ -13,17 +13,11 @@ import isUrl from 'is-url'
*/ */
const NODES = { const NODES = {
image: (props) => { image: wrap()((props) => {
const { node, state } = props const { node, state } = props
const src = node.data.get('src') const src = node.data.get('src')
return ( return <img draggable src={src} />
<Draggable {...props}> })
<Void {...props} className="image-block">
<img {...props.attributes} src={src} />
</Void>
</Draggable>
)
}
} }
/** /**
@@ -41,7 +35,7 @@ class Images extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

8
examples/images/state.json
View File

@@ -16,13 +16,7 @@
"isVoid": true, "isVoid": true,
"data": { "data": {
"src": "https://img.washingtonpost.com/wp-apps/imrs.php?src=https://img.washingtonpost.com/news/speaking-of-science/wp-content/uploads/sites/36/2015/10/as12-49-7278-1024x1024.jpg&w=1484" "src": "https://img.washingtonpost.com/wp-apps/imrs.php?src=https://img.washingtonpost.com/news/speaking-of-science/wp-content/uploads/sites/36/2015/10/as12-49-7278-1024x1024.jpg&w=1484"
}, }
"nodes": [
{
"kind": "text",
"text": ""
}
]
}, },
{ {
"kind": "block", "kind": "block",

12
examples/index.js
View File

@@ -112,19 +112,7 @@ class App extends React.Component {
const router = ( const router = (
<Router history={hashHistory}> <Router history={hashHistory}>
<Route path="/" component={App}> <Route path="/" component={App}>
<IndexRedirect to="rich-text" />
<Route path="auto-markdown" component={AutoMarkdown} /> <Route path="auto-markdown" component={AutoMarkdown} />
<Route path="code-highlighting" component={CodeHighlighting} />
<Route path="hovering-menu" component={HoveringMenu} />
<Route path="images" component={Images} />
<Route path="links" component={Links} />
<Route path="paste-html" component={PasteHtml} />
<Route path="plain-text" component={PlainText} />
<Route path="read-only" component={ReadOnly} />
<Route path="rich-text" component={RichText} />
<Route path="tables" component={Tables} />
<Route path="dev-performance-plain" component={DevPerformancePlain} />
<Route path="dev-performance-rich" component={DevPerformanceRich} />
</Route> </Route>
</Router> </Router>
) )

2
examples/links/index.js
View File

@@ -36,7 +36,7 @@ class Links extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

2
examples/paste-html/index.js
View File

@@ -171,7 +171,7 @@ class PasteHtml extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

2
examples/rich-text/index.js
View File

@@ -64,7 +64,7 @@ class RichText extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

12
examples/rich-text/state.json
View File

@@ -77,11 +77,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "A wise quote."
{
"text": "A wise quote."
}
]
} }
] ]
}, },
@@ -91,11 +87,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "Try it out for yourself!"
{
"text": "Try it out for yourself!"
}
]
} }
] ]
} }

2
examples/tables/index.js
View File

@@ -43,7 +43,7 @@ class Tables extends React.Component {
*/ */
state = { state = {
state: Raw.deserialize(initialState) state: Raw.deserialize(initialState, { terse: true })
}; };
/** /**

14
examples/tables/state.json
View File

@@ -6,11 +6,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "Since the editor is based on a recursive tree model, similar to an HTML document, you can create complex nested structures, like tables:"
{
"text": "Since the editor is based on a recursive tree model, similar to an HTML document, you can create complex nested structures, like tables:"
}
]
} }
] ]
}, },
@@ -30,7 +26,7 @@
"kind": "text", "kind": "text",
"ranges": [ "ranges": [
{ {
"text": "", "text": ""
} }
] ]
} }
@@ -237,11 +233,7 @@
"nodes": [ "nodes": [
{ {
"kind": "text", "kind": "text",
"ranges": [ "text": "This table is just a basic example, but you could augment it to add support for table headers, adding column and rows, or even formulas if you wanted to get really crazy..."
{
"text": "This table is just a basic example, but you could augment it to add support for table headers, adding column and rows, or even formulas if you wanted to get really crazy..."
}
]
} }
] ]
} }