@contentful/field-editor-rich-text 0.24.1-next → 0.26.2-next

package/dist/field-editor-rich-text.cjs.development.js

@@ -27,6 +27,7 @@ var fieldEditorShared = require('@contentful/field-editor-shared');
 var moment = _interopDefault(require('moment'));
 var mimetype = _interopDefault(require('@contentful/mimetype'));
 var plateTable = require('@udecode/plate-table');
+var richTextPlainTextRenderer = require('@contentful/rich-text-plain-text-renderer');
 var plateHtmlSerializer = require('@udecode/plate-html-serializer');
 var plateParagraph = require('@udecode/plate-paragraph');
 var plateBreak = require('@udecode/plate-break');
@@ -679,6 +680,7 @@ var VALIDATIONS = {
   ENABLED_MARKS: 'enabledMarks',
   ENABLED_NODE_TYPES: 'enabledNodeTypes'
 };
+var DEFAULT_ENABLED_NODE_TYPES = [Contentful.BLOCKS.DOCUMENT, Contentful.BLOCKS.PARAGRAPH, 'text'];
 
 var getRichTextValidation = function getRichTextValidation(field, validationType) {
   return flow(function (v) {
@@ -689,13 +691,14 @@ var getRichTextValidation = function getRichTextValidation(field, validationType
 };
 
 var isFormattingOptionEnabled = function isFormattingOptionEnabled(field, validationType, nodeTypeOrMark) {
-  var enabledFormattings = getRichTextValidation(field, validationType);
+  var enabledFormattings = getRichTextValidation(field, validationType); // TODO: In the future, validations will always be opt-in. In that case
+  // we don't need this step.
 
   if (enabledFormattings === undefined) {
     return true;
   }
 
-  return enabledFormattings.includes(nodeTypeOrMark);
+  return DEFAULT_ENABLED_NODE_TYPES.concat(enabledFormattings).includes(nodeTypeOrMark);
 };
 
 var isNodeTypeEnabled = function isNodeTypeEnabled(field, nodeType) {
@@ -1135,6 +1138,11 @@ var withListOptions = (_withListOptions = {}, _withListOptions[plateList.ELEMENT
   type: Contentful.BLOCKS.OL_LIST,
   component: OL
 }, _withListOptions);
+var createListPlugin = function createListPlugin() {
+  return plateList.createListPlugin({
+    validLiChildrenTypes: Contentful.LIST_ITEM_BLOCKS
+  });
+};
 
 var _withBoldOptions;
 function ToolbarBoldButton(props) {
@@ -2420,13 +2428,17 @@ function FetchingWrappedEntryCard(props) {
 
   var entry = entries[props.entryId];
   var contentType = React.useMemo(function () {
+    if (!entry || entry === 'failed') {
+      return undefined;
+    }
+
     return props.sdk.space.getCachedContentTypes().find(function (contentType) {
-      return contentType.sys.id === (entry == null ? void 0 : entry.sys.contentType.sys.id);
+      return contentType.sys.id === entry.sys.contentType.sys.id;
     });
   }, [props.sdk, entry]);
   var defaultLocaleCode = props.sdk.locales["default"];
   React.useEffect(function () {
-    if (!entry) return;
+    if (!entry || entry === 'failed') return;
     fieldEditorShared.entityHelpers.getEntryImage({
       entry: entry,
       contentType: contentType,
@@ -2558,13 +2570,15 @@ function AssetDropdownMenu(_ref) {
 }
 
 function FetchingWrappedAssetCard(props) {
+  var _asset$fields;
+
   var _useEntities = fieldEditorReference.useEntities(),
       getOrLoadAsset = _useEntities.getOrLoadAsset,
       assets = _useEntities.assets;
 
   var asset = assets[props.assetId];
   var defaultLocaleCode = props.sdk.locales["default"];
-  var entityFile = asset != null && asset.fields.file ? asset.fields.file[props.locale] || asset.fields.file[defaultLocaleCode] : undefined;
+  var entityFile = asset != null && (_asset$fields = asset.fields) != null && _asset$fields.file ? asset.fields.file[props.locale] || asset.fields.file[defaultLocaleCode] : undefined;
   React.useEffect(function () {
     getOrLoadAsset(props.assetId);
   }, [props.assetId]); // eslint-disable-line
@@ -3634,6 +3648,15 @@ var TableActions = function TableActions() {
 
 var _templateObject$4, _templateObject2$3, _templateObject3$3, _templateObject4$1, _styles$1, _withTableOptions;
 var styles$g = (_styles$1 = {}, _styles$1[Contentful.BLOCKS.TABLE] = /*#__PURE__*/emotion.css(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    margin-bottom: 1.5em;\n    border-collapse: collapse;\n    border-radius: 5px;\n    border-style: hidden;\n    box-shadow: 0 0 0 1px ", ";\n    width: 100%;\n    table-layout: fixed;\n    overflow: hidden;\n  "])), tokens.gray400), _styles$1[Contentful.BLOCKS.TABLE_ROW] = /*#__PURE__*/emotion.css(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    border: 1px solid ", ";\n    &:hover td {\n      background-color: transparent !important;\n    }\n  "])), tokens.gray400), _styles$1[Contentful.BLOCKS.TABLE_HEADER_CELL] = /*#__PURE__*/emotion.css(_templateObject3$3 || (_templateObject3$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    background-color: ", ";\n    border: 1px solid ", ";\n    padding: 10px 12px;\n    font-weight: ", ";\n    text-align: left;\n    min-width: 48px;\n    position: relative;\n    div:last-child {\n      margin-bottom: 0;\n    }\n  "])), tokens.gray200, tokens.gray400, tokens.fontWeightMedium), _styles$1[Contentful.BLOCKS.TABLE_CELL] = /*#__PURE__*/emotion.css(_templateObject4$1 || (_templateObject4$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    border: 1px solid ", ";\n    padding: 10px 12px;\n    min-width: 48px;\n    position: relative;\n    div:last-child {\n      margin-bottom: 0;\n    }\n  "])), tokens.gray400), _styles$1);
+
+var slateNodeToText = function slateNodeToText(node) {
+  var contentfulNode = contentfulSlatejsAdapter.toContentfulDocument({
+    document: [node],
+    schema: schema
+  });
+  return richTextPlainTextRenderer.documentToPlainTextString(contentfulNode);
+};
+
 var Table = function Table(props) {
   return /*#__PURE__*/React.createElement("table", Object.assign({}, props.attributes, {
     className: styles$g[Contentful.BLOCKS.TABLE]
@@ -3691,10 +3714,20 @@ function addTableTrackingEvents(editor, _ref) {
           });
         }
       }, 1);
+    } else {
+      insertData(data);
     }
   };
 }
 
+var paragraph = function paragraph() {
+  return {
+    type: Contentful.BLOCKS.PARAGRAPH,
+    data: {},
+    children: []
+  };
+};
+
 function addTableNormalization(editor) {
   var normalizeNode = editor.normalizeNode;
 
@@ -3713,12 +3746,20 @@ function addTableNormalization(editor) {
             childPath = _step$value[1];
 
         if (slate.Text.isText(child)) {
-          var paragraph = {
-            type: Contentful.BLOCKS.PARAGRAPH,
-            data: {},
-            children: []
-          };
-          slate.Transforms.wrapNodes(editor, paragraph, {
+          slate.Transforms.wrapNodes(editor, paragraph(), {
+            at: childPath
+          });
+        } else if (!Contentful.CONTAINERS[node.type].includes(child.type)) {
+          var paragraphWithTextFromNode = _extends({}, paragraph(), {
+            children: [{
+              text: slateNodeToText(child)
+            }]
+          });
+
+          slate.Transforms.removeNodes(editor, {
+            at: childPath
+          });
+          slate.Transforms.insertNodes(editor, paragraphWithTextFromNode, {
             at: childPath
           });
         }
@@ -4269,7 +4310,7 @@ function FetchingWrappedInlineEntryCard(props) {
   }, [entries, props.entryId]);
   var allContentTypes = props.sdk.space.getCachedContentTypes();
   var contentType = React__default.useMemo(function () {
-    if (!entry || !allContentTypes) return undefined;
+    if (!entry || entry === 'failed' || !allContentTypes) return undefined;
     return allContentTypes.find(function (contentType) {
       return contentType.sys.id === entry.sys.contentType.sys.id;
     });
@@ -4759,7 +4800,7 @@ var removeComments = function removeComments(_ref) {
 
 var TAG_NAME_TABLE = 'TABLE';
 var TAG_NAME_TABLE_CAPTION = 'CAPTION';
-var DISALLOWED_TABLE_CHILD_ELEMENTS = [TAG_NAME_TABLE, TAG_NAME_TABLE_CAPTION];
+var DISALLOWED_TABLE_CHILD_ELEMENTS = [TAG_NAME_TABLE_CAPTION];
 
 var isHTMLElement = function isHTMLElement(node) {
   return node.nodeType === Node.ELEMENT_NODE;
@@ -4853,6 +4894,8 @@ function withPasteHandling(editor) {
         var sanitized = sanitizeHtml(html, editor);
         var newData = htmlToDataTransfer(sanitized);
         insertData(newData);
+      } else {
+        insertData(data);
       }
     };
   };
@@ -5049,7 +5092,7 @@ var getPlugins = function getPlugins(sdk, tracking) {
   plateCore.createReactPlugin(), plateCore.createHistoryPlugin(), // Behavior
   createPastePlugin(), // Global shortcuts
   createNewLinePlugin(), createInsertBeforeFirstVoidBlockPlugin(), // Block Elements
-  createParagraphPlugin(), plateList.createListPlugin(), createHrPlugin(), createHeadingPlugin(), createQuotePlugin(), createTablePlugin(tracking), createEmbeddedEntryBlockPlugin(sdk), createEmbeddedAssetBlockPlugin(sdk), // Inline elements
+  createParagraphPlugin(), createListPlugin(), createHrPlugin(), createHeadingPlugin(), createQuotePlugin(), createTablePlugin(tracking), createEmbeddedEntryBlockPlugin(sdk), createEmbeddedAssetBlockPlugin(sdk), // Inline elements
   createHyperlinkPlugin(sdk), createEmbeddedEntityInlinePlugin(sdk), // Marks
   createBoldPlugin(), createCodePlugin(), createItalicPlugin(), createUnderlinePlugin(), // Other
   createTrailingParagraphPlugin()];