From c2cd606be2d82ac7f87eda06aba856af6b99861f Mon Sep 17 00:00:00 2001 From: Ross Edfort Date: Tue, 15 Oct 2019 13:29:24 -0600 Subject: [PATCH 1/5] TENT-2908 - add more attrs to images --- packages/draft-js-export-html/src/stateToHTML.js | 1 + .../src/__tests__/stateFromElement-test.js | 15 ++++++++++++++- .../src/stateFromElement.js | 2 +- 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/packages/draft-js-export-html/src/stateToHTML.js b/packages/draft-js-export-html/src/stateToHTML.js index 140b024b..b8ebeeba 100644 --- a/packages/draft-js-export-html/src/stateToHTML.js +++ b/packages/draft-js-export-html/src/stateToHTML.js @@ -83,6 +83,7 @@ const ENTITY_ATTR_MAP: {[entityType: string]: AttrMap} = { width: 'width', alt: 'alt', className: 'class', + style: 'style', }, }; diff --git a/packages/draft-js-import-element/src/__tests__/stateFromElement-test.js b/packages/draft-js-import-element/src/__tests__/stateFromElement-test.js index 079ac6fb..65fbe368 100644 --- a/packages/draft-js-import-element/src/__tests__/stateFromElement-test.js +++ b/packages/draft-js-import-element/src/__tests__/stateFromElement-test.js @@ -173,7 +173,16 @@ describe('stateFromElement', () => { }); it('should support images', () => { - let imageNode = new ElementNode('img', [{name: 'src', value: 'imgur.com/asdf.jpg'}]); + let imageNode = new ElementNode( + 'img', + [ + {name: 'src', value: 'imgur.com/asdf.jpg'}, + {name: 'height', value: '40'}, + {name: 'width', value: '40'}, + {name: 'class', value: 'myClass'}, + {name: 'style', value: 'color: red;'}, + ], + ); let wrapperElement = new ElementNode('div', [], [imageNode]); let contentState = stateFromElement(wrapperElement); let rawContentState = removeBlockKeys(convertToRaw(contentState)); @@ -196,6 +205,10 @@ describe('stateFromElement', () => { '0': { data: { src: 'imgur.com/asdf.jpg', + height: '40', + width: '40', + className: 'myClass', + style: 'color: red;', }, mutability: 'MUTABLE', type: 'IMAGE', diff --git a/packages/draft-js-import-element/src/stateFromElement.js b/packages/draft-js-import-element/src/stateFromElement.js index 79184bb1..ee3d20ed 100644 --- a/packages/draft-js-import-element/src/stateFromElement.js +++ b/packages/draft-js-import-element/src/stateFromElement.js @@ -109,7 +109,7 @@ const DATA_ATTRIBUTE = /^data-([a-z0-9-]+)$/; // Map element attributes to entity data. const ELEM_ATTR_MAP = { a: {href: 'url', rel: 'rel', target: 'target', title: 'title', clicktracking: 'clicktracking'}, - img: {src: 'src', alt: 'alt'}, + img: {src: 'src', alt: 'alt', class: 'className', style: 'style', height: 'height', width: 'width'}, }; const getEntityData = (tagName: string, element: DOMElement) => { From 3c23e94d5640fb49c535390ca5dfd12783acccc7 Mon Sep 17 00:00:00 2001 From: Ross Edfort Date: Thu, 17 Oct 2019 13:28:56 -0600 Subject: [PATCH 2/5] TENT-2908 - support spans --- packages/draft-js-export-html/src/stateToHTML.js | 5 +++++ packages/draft-js-import-element/src/stateFromElement.js | 1 + 2 files changed, 6 insertions(+) diff --git a/packages/draft-js-export-html/src/stateToHTML.js b/packages/draft-js-export-html/src/stateToHTML.js index b8ebeeba..123724e3 100644 --- a/packages/draft-js-export-html/src/stateToHTML.js +++ b/packages/draft-js-export-html/src/stateToHTML.js @@ -76,6 +76,7 @@ const ENTITY_ATTR_MAP: {[entityType: string]: AttrMap} = { title: 'title', className: 'class', clicktracking: 'clicktracking', + universal: 'universal', }, [ENTITY_TYPE.IMAGE]: { src: 'src', @@ -85,6 +86,10 @@ const ENTITY_ATTR_MAP: {[entityType: string]: AttrMap} = { className: 'class', style: 'style', }, + SPAN: { + className: 'class', + style: 'style', + }, }; // Map entity data to element attributes. diff --git a/packages/draft-js-import-element/src/stateFromElement.js b/packages/draft-js-import-element/src/stateFromElement.js index ee3d20ed..5fa31bfb 100644 --- a/packages/draft-js-import-element/src/stateFromElement.js +++ b/packages/draft-js-import-element/src/stateFromElement.js @@ -110,6 +110,7 @@ const DATA_ATTRIBUTE = /^data-([a-z0-9-]+)$/; const ELEM_ATTR_MAP = { a: {href: 'url', rel: 'rel', target: 'target', title: 'title', clicktracking: 'clicktracking'}, img: {src: 'src', alt: 'alt', class: 'className', style: 'style', height: 'height', width: 'width'}, + span: {class: 'className', style: 'style'}, }; const getEntityData = (tagName: string, element: DOMElement) => { From 8d956a80513508a475dc042337ea2dc10052ab58 Mon Sep 17 00:00:00 2001 From: Ross Edfort Date: Thu, 17 Oct 2019 13:31:10 -0600 Subject: [PATCH 3/5] universal attr on links --- packages/draft-js-import-element/src/stateFromElement.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/draft-js-import-element/src/stateFromElement.js b/packages/draft-js-import-element/src/stateFromElement.js index 5fa31bfb..794d1b5b 100644 --- a/packages/draft-js-import-element/src/stateFromElement.js +++ b/packages/draft-js-import-element/src/stateFromElement.js @@ -108,7 +108,7 @@ const DATA_ATTRIBUTE = /^data-([a-z0-9-]+)$/; // Map element attributes to entity data. const ELEM_ATTR_MAP = { - a: {href: 'url', rel: 'rel', target: 'target', title: 'title', clicktracking: 'clicktracking'}, + a: {href: 'url', rel: 'rel', target: 'target', title: 'title', clicktracking: 'clicktracking', universal: 'universal'}, img: {src: 'src', alt: 'alt', class: 'className', style: 'style', height: 'height', width: 'width'}, span: {class: 'className', style: 'style'}, }; From c3ef8c847d67fdbb8b9536ef4d60556a6dfb552f Mon Sep 17 00:00:00 2001 From: Ross Edfort Date: Thu, 17 Oct 2019 13:33:36 -0600 Subject: [PATCH 4/5] span ElementToEntity fn --- packages/draft-js-import-element/src/stateFromElement.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/packages/draft-js-import-element/src/stateFromElement.js b/packages/draft-js-import-element/src/stateFromElement.js index 794d1b5b..5d28974d 100644 --- a/packages/draft-js-import-element/src/stateFromElement.js +++ b/packages/draft-js-import-element/src/stateFromElement.js @@ -157,6 +157,14 @@ const ElementToEntity = { return generator.createEntity(ENTITY_TYPE.IMAGE, data); } }, + span( + generator: ContentGenerator, + tagName: string, + element: DOMElement, + ): ?string { + let data = getEntityData(tagName, element); + return generator.createEntity('SPAN', data); + }, }; class ContentGenerator { From 247d710c6aa7f8b7bec8af4b052efbc1995e9ed3 Mon Sep 17 00:00:00 2001 From: Ross Edfort Date: Thu, 17 Oct 2019 14:26:31 -0600 Subject: [PATCH 5/5] version bump --- packages/draft-js-export-html/package.json | 2 +- packages/draft-js-import-element/package.json | 2 +- packages/draft-js-import-html/package.json | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/draft-js-export-html/package.json b/packages/draft-js-export-html/package.json index 0cdc6ead..306422b5 100644 --- a/packages/draft-js-export-html/package.json +++ b/packages/draft-js-export-html/package.json @@ -1,6 +1,6 @@ { "name": "@sendgrid/draft-js-export-html", - "version": "1.0.5", + "version": "1.0.7", "description": "DraftJS: Export ContentState to HTML", "main": "lib/main.js", "typings": "typings/index.d.ts", diff --git a/packages/draft-js-import-element/package.json b/packages/draft-js-import-element/package.json index 2473657a..e4eb9bc3 100644 --- a/packages/draft-js-import-element/package.json +++ b/packages/draft-js-import-element/package.json @@ -1,6 +1,6 @@ { "name": "@sendgrid/draft-js-import-element", - "version": "1.0.1", + "version": "1.0.3", "description": "DraftJS: Import Element to ContentState", "main": "lib/main.js", "scripts": { diff --git a/packages/draft-js-import-html/package.json b/packages/draft-js-import-html/package.json index 9484b4be..5ea07785 100644 --- a/packages/draft-js-import-html/package.json +++ b/packages/draft-js-import-html/package.json @@ -1,6 +1,6 @@ { "name": "@sendgrid/draft-js-import-html", - "version": "1.0.1", + "version": "1.0.3", "description": "DraftJS: Import HTML to ContentState", "main": "lib/main.js", "typings": "typings/index.d.ts", @@ -9,7 +9,7 @@ "watch": "babel src --watch --out-dir lib --ignore \"_*\"" }, "dependencies": { - "@sendgrid/draft-js-import-element": "^1.0.0" + "@sendgrid/draft-js-import-element": "1.0.3" }, "peerDependencies": { "draft-js": ">=0.10.0",