1
0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-19 13:41:19 +02:00

update link example

This commit is contained in:
Ian Storm Taylor
2016-06-23 23:39:08 -07:00
parent 122f571090
commit 9d62948b1a
7 changed files with 77 additions and 28 deletions

View File

@@ -22,10 +22,9 @@ class App extends React.Component {
*/ */
hasLinks() { hasLinks() {
let { state } = this.state const { state } = this.state
const { currentInlineNodes } = state const { inlines } = state
const hasLinks = currentInlineNodes.some(inline => inline.type == 'link') return inlines.some(inline => inline.type == 'link')
return hasLinks
} }
/** /**
@@ -47,11 +46,11 @@ class App extends React.Component {
.apply() .apply()
} }
else if (state.isCurrentlyExpanded) { else if (state.isExpanded) {
// const href = window.prompt('Enter the URL of the link:') const href = window.prompt('Enter the URL of the link:')
state = state state = state
.transform() .transform()
.wrapInline('link', new Map({ href: 'https://google.com' })) .wrapInline('link', new Map({ href }))
.apply() .apply()
} }
@@ -63,6 +62,7 @@ class App extends React.Component {
.insertText(text) .insertText(text)
.extendBackward(text.length) .extendBackward(text.length)
.wrapInline('link', new Map({ href })) .wrapInline('link', new Map({ href }))
.moveToEnd(text.length)
.apply() .apply()
} }

View File

@@ -1,4 +1,15 @@
/**
* Prevent circuit.
*/
import './document'
import './inline'
/**
* Dependencies.
*/
import Data from './data' import Data from './data'
import Inline from './inline' import Inline from './inline'
import Node from './node' import Node from './node'

View File

@@ -1,4 +1,15 @@
/**
* Prevent circuit.
*/
import './block'
import './inline'
/**
* Dependencies.
*/
import Block from './block' import Block from './block'
import Node from './node' import Node from './node'
import { OrderedMap, Record } from 'immutable' import { OrderedMap, Record } from 'immutable'

View File

@@ -1,4 +1,15 @@
/**
* Prevent circuit.
*/
import './block'
import './document'
/**
* Dependencies.
*/
import Block from './block' import Block from './block'
import Data from './data' import Data from './data'
import Node from './node' import Node from './node'

View File

@@ -2,6 +2,7 @@
import Block from './block' import Block from './block'
import Character from './character' import Character from './character'
import Data from './data' import Data from './data'
import Inline from './inline'
import Mark from './mark' import Mark from './mark'
import Selection from './selection' import Selection from './selection'
import Text from './text' import Text from './text'
@@ -892,7 +893,6 @@ const Node = {
splitInlineAtRange(range, depth = Infinity) { splitInlineAtRange(range, depth = Infinity) {
range = range.normalize(this) range = range.normalize(this)
const Inline = require('./inline').default
let node = this let node = this
// If the range is expanded, remove it first. // If the range is expanded, remove it first.
@@ -1223,8 +1223,6 @@ const Node = {
wrapInlineAtRange(range, type, data) { wrapInlineAtRange(range, type, data) {
range = range.normalize(this) range = range.normalize(this)
data = Data.create(data) data = Data.create(data)
const Inline = require('./inline').default
let node = this let node = this
// If collapsed or unset, there's nothing to wrap. // If collapsed or unset, there's nothing to wrap.

View File

@@ -321,18 +321,20 @@ class Selection extends Record(DEFAULTS) {
} }
/** /**
* Move to the entire range of a `node`. * Move to the entire range of `start` and `end` nodes.
* *
* @param {Node} start
* @param {Node} end (optional)
* @return {Selection} selection * @return {Selection} selection
*/ */
moveToRangeOf(node) { moveToRangeOf(start, end = start) {
return this.merge({ return this.merge({
anchorKey: node.key, anchorKey: start.key,
anchorOffset: 0, anchorOffset: 0,
focusKey: node.key, focusKey: end.key,
focusOffset: node.length, focusOffset: end.length,
isBackward: false isBackward: null
}) })
} }

View File

@@ -522,28 +522,30 @@ class State extends Record(DEFAULTS) {
* Wrap the block nodes in the current selection in new nodes of `type`. * Wrap the block nodes in the current selection in new nodes of `type`.
* *
* @param {String} type * @param {String} type
* @param {Data} data (optional)
* @return {State} state * @return {State} state
*/ */
wrapBlock(type) { wrapBlock(type, data) {
let state = this let state = this
let { document, selection } = state let { document, selection } = state
document = document.wrapBlockAtRange(selection, type) document = document.wrapBlockAtRange(selection, type, data)
state = state.merge({ document }) state = state.merge({ document })
return state return state
} }
/** /**
* Unwrap the block nodes in the current selection from a parent of `type`. * Unwrap the current selection from a block parent of `type`.
* *
* @param {String} type * @param {String} type (optional)
* @param {Data} data (optional)
* @return {State} state * @return {State} state
*/ */
unwrapBlock(type) { unwrapBlock(type, data) {
let state = this let state = this
let { document, selection } = state let { document, selection } = state
document = document.unwrapBlockAtRange(selection, type) document = document.unwrapBlockAtRange(selection, type, data)
state = state.merge({ document, selection }) state = state.merge({ document, selection })
return state return state
} }
@@ -552,7 +554,7 @@ class State extends Record(DEFAULTS) {
* Wrap the current selection in new inline nodes of `type`. * Wrap the current selection in new inline nodes of `type`.
* *
* @param {String} type * @param {String} type
* @param {Map} data * @param {Data} data (optional)
* @return {State} state * @return {State} state
*/ */
@@ -560,21 +562,35 @@ class State extends Record(DEFAULTS) {
let state = this let state = this
let { document, selection } = state let { document, selection } = state
document = document.wrapInlineAtRange(selection, type, data) document = document.wrapInlineAtRange(selection, type, data)
state = state.merge({ document })
// Determine what the selection should be after wrapping.
if (selection.isCollapsed) {
selection = selection
}
else {
const startText = document.getNextText(selection.startKey)
const endText = document.getPreviousText(selection.endKey)
selection = selection.moveToRangeOf(start, end)
selection = selection.normalize(document)
}
state = state.merge({ document, selection })
return state return state
} }
/** /**
* Unwrap the current selection from a parent of `type`. * Unwrap the current selection from an inline parent of `type`.
* *
* @param {String} type * @param {String} type (optional)
* @param {Data} data (optional)
* @return {State} state * @return {State} state
*/ */
unwrapInline(type) { unwrapInline(type, data) {
let state = this let state = this
let { document, selection } = state let { document, selection } = state
document = document.unwrapInlineAtRange(selection, type) document = document.unwrapInlineAtRange(selection, type, data)
state = state.merge({ document, selection }) state = state.merge({ document, selection })
return state return state
} }