Skip to content

Commit

Permalink
mergeLinkFormat
Browse files Browse the repository at this point in the history
  • Loading branch information
BryanValverdeU committed Jun 4, 2024
1 parent db8e2da commit 2552c3e
Showing 2 changed files with 266 additions and 2 deletions.
Original file line number Diff line number Diff line change
@@ -14,6 +14,7 @@ import type {
ContentModelBlock,
ContentModelBlockFormat,
ContentModelDocument,
ContentModelHyperLinkFormat,
ContentModelListItem,
ContentModelParagraph,
ContentModelSegmentFormat,
@@ -347,7 +348,7 @@ function applyDefaultFormat(
break;

case 'Paragraph':
const paragraphFormat = block.decorator?.format || {};
const paraFormat = block.decorator?.format || {};
const paragraph = mutateBlock(block);

paragraph.segments.forEach(segment => {
@@ -356,9 +357,18 @@ function applyDefaultFormat(
}

segment.format = mergeSegmentFormat(applyDefaultFormatOption, format, {
...paragraphFormat,
...paraFormat,
...segment.format,
});

if (segment.link) {
segment.link.format = mergeLinkFormat(
applyDefaultFormatOption,
format,
paraFormat,
segment.link.format
);
}
});

if (applyDefaultFormatOption === 'keepSourceEmphasisFormat') {
@@ -375,6 +385,50 @@ function mergeBlockFormat(applyDefaultFormatOption: string, block: ReadonlyConte
}
}

function mergeLinkFormat(
applyDefaultFormatOption: 'mergeAll' | 'keepSourceEmphasisFormat',
targetFormat: ContentModelSegmentFormat,
paraFormat: ContentModelSegmentFormat,
linkFormat: ContentModelHyperLinkFormat
) {
const segmentFormat = mergeSegmentFormat(
applyDefaultFormatOption,
getSegmentFormatInLinkFormat(targetFormat),
{
...getSegmentFormatInLinkFormat(paraFormat),
...getSegmentFormatInLinkFormat(linkFormat),
}
);

if (applyDefaultFormatOption == 'keepSourceEmphasisFormat') {
delete linkFormat.backgroundColor;
delete linkFormat.textColor;
}

return {
...linkFormat,
...segmentFormat,
};
}

function getSegmentFormatInLinkFormat(
targetFormat: ContentModelSegmentFormat
): ContentModelSegmentFormat {
const result = {
textColor: targetFormat.textColor,
backgroundColor: targetFormat.backgroundColor,
underline: targetFormat.underline,
};

getObjectKeys(result).forEach(key => {
if (result[key] == undefined) {
delete result[key];
}
});

return result;
}

function mergeSegmentFormat(
applyDefaultFormatOption: 'mergeAll' | 'keepSourceEmphasisFormat',
targetFormat: ContentModelSegmentFormat,
Original file line number Diff line number Diff line change
@@ -3533,4 +3533,214 @@ describe('mergeModel', () => {
tableContext: undefined,
});
});

it('Merge Link Format with mergeAll option', () => {
const newTarget: ContentModelDocument = {
blockGroupType: 'Document',
blocks: [
{
segments: [
{
isSelected: true,
segmentType: 'SelectionMarker',
format: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
},
],
segmentFormat: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
blockType: 'Paragraph',
format: {},
},
],
format: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
};
const mergeLinkSourceModel: ContentModelDocument = {
blockGroupType: 'Document',
blocks: [
{
blockType: 'Paragraph',
segments: [
{
segmentType: 'Text',
text: 'Work Item 222824',
format: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
textColor: 'var(--communication-foreground,rgba(0, 90, 158, 1))',
underline: true,
italic: false,
backgroundColor: 'rgb(32, 31, 30)',
},
link: {
format: {
underline: true,
href: 'https://www.bing.com',
anchorClass: 'bolt-link',
textColor:
'var(--communication-foreground,rgba(0, 90, 158, 1))',
backgroundColor: 'rgb(32, 31, 30)',
borderRadius: '2px',
textAlign: 'start',
},
dataset: {},
},
},
{
segmentType: 'Text',
text: 'Test',
format: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
textColor: 'rgb(255, 255, 255)',
italic: false,
backgroundColor: 'rgb(32, 31, 30)',
},
},
],
format: {},
isImplicit: true,
segmentFormat: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
},
},
],
};
mergeModel(newTarget, mergeLinkSourceModel, undefined, {
mergeFormat: 'mergeAll',
});

const para = newTarget.blocks[0] as ContentModelParagraph;
expect(para.segments[0].link).toEqual({
format: {
href: 'https://www.bing.com',
anchorClass: 'bolt-link',
borderRadius: '2px',
textAlign: 'start',
textColor: 'var(--communication-foreground,rgba(0, 90, 158, 1))',
backgroundColor: 'rgb(32, 31, 30)',
underline: true,
},
dataset: {},
});
});

it('Merge Link Format with keepSourceEmphasisFormat option', () => {
const targetModel: ContentModelDocument = {
blockGroupType: 'Document',
blocks: [
{
segments: [
{
isSelected: true,
segmentType: 'SelectionMarker',
format: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
},
],
segmentFormat: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
blockType: 'Paragraph',
format: {},
},
],
format: {
fontFamily: 'Calibri',
fontSize: '11pt',
textColor: '#000000',
},
};
const sourceModel: ContentModelDocument = {
blockGroupType: 'Document',
blocks: [
{
blockType: 'Paragraph',
segments: [
{
segmentType: 'Text',
text: 'Work Item 222824',
format: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
textColor: 'var(--communication-foreground,rgba(0, 90, 158, 1))',
underline: true,
italic: false,
backgroundColor: 'rgb(32, 31, 30)',
},
link: {
format: {
underline: true,
href: 'https://www.bing.com',
anchorClass: 'bolt-link',
textColor:
'var(--communication-foreground,rgba(0, 90, 158, 1))',
backgroundColor: 'rgb(32, 31, 30)',
borderRadius: '2px',
textAlign: 'start',
},
dataset: {},
},
},
{
segmentType: 'Text',
text: 'Test',
format: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
textColor: 'rgb(255, 255, 255)',
italic: false,
backgroundColor: 'rgb(32, 31, 30)',
},
},
],
format: {},
isImplicit: true,
segmentFormat: {
fontFamily:
'"Segoe UI VSS (Regular)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
fontSize: '14px',
},
},
],
};

mergeModel(targetModel, sourceModel, undefined, {
mergeFormat: 'keepSourceEmphasisFormat',
});

const para = targetModel.blocks[0] as ContentModelParagraph;
expect(para.segments[0].link).toEqual({
format: {
href: 'https://www.bing.com',
anchorClass: 'bolt-link',
borderRadius: '2px',
textAlign: 'start',
textColor: '#000000',
underline: true,
},
dataset: {},
});
});
});

0 comments on commit 2552c3e

Please sign in to comment.