mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-27 17:09:53 +02:00
Code Issues Releases Wiki Activity

Merge branch 'AlbertHilb-HiddenCaret'

Browse Source
This commit is contained in:
Ian Storm Taylor
2017-02-17 10:55:02 -08:00
parent 77ffcaae66 ea9920df5f
commit dce2c780f7
7 changed files with 21 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/leaf.js
View File

@@ -264,7 +264,12 @@ class Leaf extends React.Component {
// COMPAT: If the text is empty otherwise, it's because it's on the edge of
// an inline void node, so we render a zero-width space so that the
// selection can be inserted next to it still.
if (text == '') return <span data-slate-zero-width>{'\u200B'}</span>
if (text == '') {
// COMPAT: In Chrome, zero-width space produces graphics glitches, so use
// hair space in place of it. (2017/02/12)
const space = IS_FIREFOX ? '\u200B' : '\u200A'
return <span data-slate-zero-width>{space}</span>
}
// COMPAT: Browsers will collapse trailing new lines at the end of blocks,
// so we need to add an extra trailing new lines to prevent that.

15
src/components/void.js
View File

@@ -91,17 +91,9 @@ class Void extends React.Component {
// Make the outer wrapper relative, so the spacer can overlay it.
if (node.kind === 'block') {
Tag = 'div'
style = {
position: 'relative'
}
style = { position: 'relative' }
} else {
Tag = 'span'
// COMPAT: In Chrome, without setting `display: inline-block` the cursor
// will disappear when placed before an inline void node. (2017/02/07)
style = {
display: 'inline-block',
position: 'relative'
}
}
this.debug('render', { props })
@@ -146,10 +138,7 @@ class Void extends React.Component {
}
} else {
style = {
position: 'absolute',
top: '0px',
left: '-9999px',
textIndent: '-9999px',
color: 'transparent'
}
}

2
test/rendering/fixtures/custom-block-void/output.html
View File

@@ -3,7 +3,7 @@
<div data-slate-void="true" style="position:relative;">
<span style="position:absolute;top:0px;left:-9999px;text-indent:-9999px;">
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<div contenteditable="false">

10
test/rendering/fixtures/custom-inline-void/output.html
View File

@@ -3,13 +3,13 @@
<div style="position:relative;">
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<span data-slate-void="true" style="display:inline-block;position:relative;">
<span style="position:absolute;top:0px;left:-9999px;text-indent:-9999px;">
<span data-slate-void="true">
<span style="color:transparent;">
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<span contenteditable="false">
@@ -18,7 +18,7 @@
</span>
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
</div>

4
test/rendering/fixtures/custom-inline/output.html
View File

@@ -3,7 +3,7 @@
<div style="position:relative;">
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<a href="https://google.com">
@@ -13,7 +13,7 @@
</a>
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
</div>

4
test/rendering/fixtures/default-block-and-inline/output.html
View File

@@ -3,7 +3,7 @@
<div style="position:relative;">
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<span style="position:relative;">
@@ -13,7 +13,7 @@
</span>
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
</div>

6
test/rendering/fixtures/multiple-custom-inline/output.html
View File

@@ -3,7 +3,7 @@
<div style="position:relative;">
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<a href="https://google.com">
@@ -13,7 +13,7 @@
</a>
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
<a href="https://google.com">
@@ -23,7 +23,7 @@
</a>
<span>
<span>
<span data-slate-zero-width="true">&#x200B;</span>
<span data-slate-zero-width="true">&#x200A;</span>
</span>
</span>
</div>