New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RichText state structure for value manipulation #7890

Merged
merged 44 commits into from Oct 1, 2018
Commits
Jump to file or symbol
Failed to load files and symbols.
+44 −55
Diff settings

Always

Just for now

Viewing a subset of changes. View all

Use line separator to separate multiline values, instead of double li…

…ne breaks
  • Loading branch information...
iseulde committed Sep 26, 2018
commit e0006682b73d622baeed7358496e95f900d7e42d
@@ -75,7 +75,9 @@ export const settings = {
blocks: [ 'core/paragraph' ],
transform: ( blockAttributes ) => {
return createBlock( 'core/list', {
values: join( blockAttributes.map( ( { content } ) => replace( content, /\n/g, '\n\n' ) ), '\n\n' ),
values: join( blockAttributes.map( ( { content } ) =>
replace( content, /\n/g, '\u2028' )
), '\u2028' ),
} );
},
},
@@ -130,7 +132,7 @@ export const settings = {
type: 'block',
blocks: [ 'core/paragraph' ],
transform: ( { values } ) =>
split( values, '\n\n' ).map( ( content ) =>
split( values, '\u2028' ).map( ( content ) =>
createBlock( 'core/paragraph', { content } )
),
},
@@ -190,7 +192,7 @@ export const settings = {
return {
...attributes,
values: join( [ attributes.values, valueToMerge ], '\n\n' ),
values: join( [ attributes.values, valueToMerge ], '\u2028' ),
};
},
@@ -391,8 +391,8 @@ function createFromMultilineElement( {
// Multiline value text should be separated by a double line break.
if ( index !== 0 ) {
accumulator.formats = accumulator.formats.concat( [ , , ] );
accumulator.text += '\n\n';
accumulator.formats = accumulator.formats.concat( [ , ] );
accumulator.text += '\u2028';
}
accumulateSelection( accumulator, node, range, value );
@@ -27,13 +27,13 @@ export function isEmptyLine( { text, start, end } ) {
return true;
}
if ( start === 0 && text.slice( 0, 2 ) === '\n\n' ) {
if ( start === 0 && text.slice( 0, 1 ) === '\u2028' ) {
return true;
}
if ( start === text.length && text.slice( -2 ) === '\n\n' ) {
if ( start === text.length && text.slice( -1 ) === '\u2028' ) {
return true;
}
return text.slice( start - 2, end + 2 ) === '\n\n\n\n';
return text.slice( start - 1, end + 1 ) === '\u2028\u2028';
}
@@ -67,7 +67,7 @@ function splitAtSelection(
return [
// Ensure newlines are trimmed.
replace( before, /\n+$/, '' ),
replace( after, /^\n+/, '' ),
replace( before, /\u2028+$/, '' ),
replace( after, /^\u2028+/, '' ),
];
}
@@ -314,9 +314,9 @@ describe( 'create', () => {
} ),
record: {
start: 1,
end: 5,
formats: [ , , , , , , , , ],
text: 'one\n\ntwo',
end: 4,
formats: [ , , , , , , , ],
text: 'one\u2028two',
},
},
{
@@ -332,8 +332,8 @@ describe( 'create', () => {
record: {
start: 0,
end: 6,
formats: [ , , , list, list, list, , , , , , , , ],
text: 'onetwo\n\nthree',
formats: [ , , , list, list, list, , , , , , , ],
text: 'onetwo\u2028three',
},
},
{
@@ -347,10 +347,10 @@ describe( 'create', () => {
endContainer: element.lastChild,
} ),
record: {
start: 5,
end: 5,
formats: [ , , , , , ],
text: 'one\n\n',
start: 4,
end: 4,
formats: [ , , , , ],
text: 'one\u2028',
},
},
{
@@ -34,27 +34,27 @@ describe( 'isEmptyLine', () => {
};
const two = {
formats: [ , , ],
text: '\n\n',
text: '\u2028',
start: 0,
end: 0,
};
const three = {
formats: [ , , ],
text: '\n\n',
start: 2,
end: 2,
text: '\u2028',
start: 1,
end: 1,
};
const four = {
formats: [ , , , , ],
text: '\n\n\n\n',
start: 2,
end: 2,
text: '\u2028\u2028',
start: 1,
end: 1,
};
const five = {
formats: [ , , , , ],
text: 'a\n\n\n\nb',
start: 3,
end: 3,
text: 'a\u2028\u2028b',
start: 2,
end: 2,
};
expect( isEmptyLine( one ) ).toBe( true );
@@ -67,25 +67,18 @@ describe( 'isEmptyLine', () => {
it( 'should return false', () => {
const one = {
formats: [ , , , , ],
text: '\n\n\n\n',
start: 3,
end: 3,
text: '\u2028a\u2028',
start: 1,
end: 1,
};
const two = {
formats: [ , , , , ],
text: '\n\na\n\n',
start: 2,
end: 2,
};
const three = {
formats: [ , , , , ],
text: '\n\n\n',
start: 2,
end: 2,
text: '\u2028\n',
start: 1,
end: 1,
};
expect( isEmptyLine( one ) ).toBe( false );
expect( isEmptyLine( two ) ).toBe( false );
expect( isEmptyLine( three ) ).toBe( false );
} );
} );
@@ -102,10 +102,10 @@ describe( 'split', () => {
it( 'should split multiline', () => {
const record = {
formats: [ , , , , , , , , , , , , ],
text: 'test\n\n\n\ntest',
start: 6,
end: 6,
formats: [ , , , , , , , , , , ],
text: 'test\u2028\u2028test',
start: 5,
end: 5,
};
const expected = [
{
@@ -9,7 +9,7 @@ export function toTree( value, multilineTag, settings ) {
const { createEmpty, append } = settings;
const tree = createEmpty();
split( value, '\n\n' ).forEach( ( piece, index ) => {
split( value, '\u2028' ).forEach( ( piece, index ) => {
append( tree, toTree( piece, null, {
...settings,
tag: multilineTag,
@@ -7,11 +7,6 @@
"ordered": false,
"values": {
"formats": [
null,
null,
null,
null,
null,
null,
null,
null,
@@ -226,7 +221,7 @@
null,
null
],
"text": "Text & Headings\n\nImages & Videos\n\nGalleries\n\nEmbeds, like YouTube, Tweets, or other WordPress posts.\n\nLayout blocks, like Buttons, Hero Images, Separators, etc.\n\nAnd Lists like this one of course :)"
"text": "Text & Headings
Images & Videos
Galleries
Embeds, like YouTube, Tweets, or other WordPress posts.
Layout blocks, like Buttons, Hero Images, Separators, etc.
And Lists like this one of course :)"
}
},
"innerBlocks": [],
@@ -44,10 +44,9 @@
null,
null,
null,
null,
null
],
"text": "Paragraph one\n\nParagraph two"
"text": "Paragraph one
Paragraph two"
},
"citation": {
"formats": [
ProTip! Use n and p to navigate between commits in a pull request.