From cedfd2b1bcce90f4586d0e3019efd9b315f3e83c Mon Sep 17 00:00:00 2001 From: Thibaud Colas Date: Fri, 9 Feb 2018 11:23:04 +0200 Subject: [PATCH] Update to latest Draftail and Draft.js --- .../__snapshots__/Document.test.js.snap | 26 ++----------------- .../__snapshots__/Link.test.js.snap | 13 +--------- .../customisation/extending_draftail.rst | 11 ++++---- package-lock.json | 20 +++++++------- package.json | 4 +-- 5 files changed, 20 insertions(+), 54 deletions(-) diff --git a/client/src/components/Draftail/decorators/__snapshots__/Document.test.js.snap b/client/src/components/Draftail/decorators/__snapshots__/Document.test.js.snap index a5f075371e..17b14ffb28 100644 --- a/client/src/components/Draftail/decorators/__snapshots__/Document.test.js.snap +++ b/client/src/components/Draftail/decorators/__snapshots__/Document.test.js.snap @@ -5,18 +5,7 @@ exports[`Document no data 1`] = ` contentState={ Immutable.Record { "entityMap": Object { - "__add": [Function], - "__create": [Function], - "__get": [Function], - "__getLastCreatedEntityKey": [Function], - "__mergeData": [Function], - "__replaceData": [Function], - "add": [Function], - "create": [Function], - "get": [Function], - "getLastCreatedEntityKey": [Function], - "mergeData": [Function], - "replaceData": [Function], + "2": "2", }, "blockMap": Immutable.OrderedMap { "a": Immutable.Record { @@ -85,18 +74,7 @@ exports[`Document works 1`] = ` contentState={ Immutable.Record { "entityMap": Object { - "__add": [Function], - "__create": [Function], - "__get": [Function], - "__getLastCreatedEntityKey": [Function], - "__mergeData": [Function], - "__replaceData": [Function], - "add": [Function], - "create": [Function], - "get": [Function], - "getLastCreatedEntityKey": [Function], - "mergeData": [Function], - "replaceData": [Function], + "1": "1", }, "blockMap": Immutable.OrderedMap { "a": Immutable.Record { diff --git a/client/src/components/Draftail/decorators/__snapshots__/Link.test.js.snap b/client/src/components/Draftail/decorators/__snapshots__/Link.test.js.snap index 52761d4a70..66e93a9a41 100644 --- a/client/src/components/Draftail/decorators/__snapshots__/Link.test.js.snap +++ b/client/src/components/Draftail/decorators/__snapshots__/Link.test.js.snap @@ -5,18 +5,7 @@ exports[`Link works 1`] = ` contentState={ Immutable.Record { "entityMap": Object { - "__add": [Function], - "__create": [Function], - "__get": [Function], - "__getLastCreatedEntityKey": [Function], - "__mergeData": [Function], - "__replaceData": [Function], - "add": [Function], - "create": [Function], - "get": [Function], - "getLastCreatedEntityKey": [Function], - "mergeData": [Function], - "replaceData": [Function], + "1": "1", }, "blockMap": Immutable.OrderedMap { "a": Immutable.Record { diff --git a/docs/advanced_topics/customisation/extending_draftail.rst b/docs/advanced_topics/customisation/extending_draftail.rst index 1d0fa300a1..d03226c73a 100644 --- a/docs/advanced_topics/customisation/extending_draftail.rst +++ b/docs/advanced_topics/customisation/extending_draftail.rst @@ -93,10 +93,8 @@ Blocks are nearly as simple as inline styles: 'type': type_, 'label': '❝', 'description': 'Blockquote', - # We need to tell Draftail what element to use when displaying those blocks in the editor. + # Optionally, we can tell Draftail what element to use when displaying those blocks in the editor. 'element': 'blockquote', - # This isn't required as the blockquote tag could be styled directly. - # 'className': 'editor__blockquote', } features.register_editor_plugin( @@ -110,12 +108,13 @@ Blocks are nearly as simple as inline styles: Here are the main differences: -* We need to configure an ``element`` to tell Draftail how to render those blocks in the editor. -* We could use a ``className`` (say if ``element`` was ``div``) to style the blockquotes in the editor. +* We can configure an ``element`` to tell Draftail how to render those blocks in the editor. * We register the plugin with ``BlockFeature``. * We set up the conversion with ``BlockElementHandler`` and ``block_map``. -That’s it! The extra complexity is that you may need to write CSS in conjunction with the ``className`` to style the blocks in the editor. +Optionally, we can also define styles for the blocks with the ``Draftail-block--blockquote`` (``Draftail-block--``) CSS class. + +That’s it! The extra complexity is that you may need to write CSS to style the blocks in the editor. Creating new entities ~~~~~~~~~~~~~~~~~~~~~ diff --git a/package-lock.json b/package-lock.json index 183236307e..de0d89c854 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2609,9 +2609,9 @@ } }, "draft-js": { - "version": "0.10.4", - "resolved": "https://registry.npmjs.org/draft-js/-/draft-js-0.10.4.tgz", - "integrity": "sha1-FHdBZCCXyBINjtwjLpUD6Lf7jTU=", + "version": "0.10.5", + "resolved": "https://registry.npmjs.org/draft-js/-/draft-js-0.10.5.tgz", + "integrity": "sha512-LE6jSCV9nkPhfVX2ggcRLA4FKs6zWq9ceuO/88BpXdNCS7mjRTgs0NsV6piUCJX9YxMsB9An33wnkMmU2sD2Zg==", "requires": { "fbjs": "0.8.16", "immutable": "3.7.6", @@ -2619,17 +2619,17 @@ } }, "draftail": { - "version": "0.15.0", - "resolved": "https://registry.npmjs.org/draftail/-/draftail-0.15.0.tgz", - "integrity": "sha512-PARHHGuoRs8CKiRH0w1k9Bs+a0cxnNl8jwVyuj4CahgNj5x5jN/Z2zutyjVvpdJCcdR1/A525u9jIpDszt9jOg==", + "version": "0.16.0", + "resolved": "https://registry.npmjs.org/draftail/-/draftail-0.16.0.tgz", + "integrity": "sha512-Jz4a1VZ4/8iScobGsst57QlP2T5pkkATU+tfYzF+2Iom/m3T+9TvbV/bIr7WGaKynMC7YRSetyPpNYlCvuMpsQ==", "requires": { - "draftjs-filters": "0.6.1" + "draftjs-filters": "0.7.0" } }, "draftjs-filters": { - "version": "0.6.1", - "resolved": "https://registry.npmjs.org/draftjs-filters/-/draftjs-filters-0.6.1.tgz", - "integrity": "sha512-8CyUUBglLKMVLrkOn7RfRoKoslx79SPvyc5w0lCJTLii/PbHP1narEW4eSNayIvcOIVcEQgOTjv2zXrH/Yuf9A==" + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/draftjs-filters/-/draftjs-filters-0.7.0.tgz", + "integrity": "sha512-gNJB4bCPM7UNOzSkbVBj0OjxvNLlBeBmMsmfN6+UF311Ne7Yq76rXc1ibRIRWUSdOMWs+H8UZqYWmJW7mWsQ5g==" }, "duplexer": { "version": "0.1.1", diff --git a/package.json b/package.json index 966452f2da..46cfe4195a 100644 --- a/package.json +++ b/package.json @@ -86,8 +86,8 @@ }, "dependencies": { "core-js": "^2.5.3", - "draft-js": "0.10.4", - "draftail": "^0.15.0", + "draft-js": "0.10.5", + "draftail": "^0.16.0", "focus-trap-react": "^3.1.0", "prop-types": "^15.6.0", "react": "^16.2.0",