@contentful/field-editor-rich-text 2.0.0-next.38 → 2.0.0-next.39

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

@@ -732,7 +732,6 @@ function renderActions(props) {
     key: "section-title"
   }, "Actions"), onEdit ? /*#__PURE__*/React.createElement(f36Components.Menu.Item, {
     key: "edit",
-    disabled: isDisabled,
     onClick: onEdit,
     testId: "card-action-edit"
   }, "Edit") : null, entityFile ? /*#__PURE__*/React.createElement(f36Components.Menu.Item, {
@@ -935,7 +934,6 @@ function FetchingWrappedEntryCard(props) {
     if (!props.onEdit || !props.onRemove) return undefined;
     return [props.onEdit ? /*#__PURE__*/React.createElement(f36Components.MenuItem, {
       key: "edit",
-      disabled: props.isDisabled,
       testId: "card-action-edit",
       onClick: function onClick() {
         props.onEdit && props.onEdit();
@@ -1019,7 +1017,8 @@ var styles$3 = {
     // The next 2 properties ensure Entity card won't be aligned above
     // a list item marker (i.e. bullet)
     display: 'inline-block',
-    verticalAlign: 'text-top'
+    verticalAlign: 'text-top',
+    width: '100%'
   })
 };
 function LinkedEntityBlock(props) {
@@ -2248,8 +2247,7 @@ function FetchingWrappedInlineEntryCard(props) {
     status: status,
     actions: [/*#__PURE__*/React__default.createElement(f36Components.MenuItem, {
       key: "edit",
-      onClick: props.onEdit,
-      disabled: props.isDisabled
+      onClick: props.onEdit
     }, "Edit"), /*#__PURE__*/React__default.createElement(f36Components.MenuItem, {
       key: "remove",
       onClick: props.onRemove,
@@ -3105,7 +3103,8 @@ function HyperlinkModal(props) {
     onChange: function onChange(event) {
       return setLinkType(event.target.value);
     },
-    testId: "link-type-input"
+    testId: "link-type-input",
+    isDisabled: props.readonly
   }, enabledLinkTypes.map(function (nodeType) {
     return /*#__PURE__*/React.createElement(f36Components.Select.Option, {
       key: nodeType,
@@ -3121,11 +3120,12 @@ function HyperlinkModal(props) {
       setLinkEntity(null);
       setLinkTarget(event.target.value);
     },
-    testId: "link-target-input"
+    testId: "link-target-input",
+    isDisabled: props.readonly
   }), /*#__PURE__*/React.createElement(f36Components.FormControl.HelpText, null, "A protocol may be required, e.g. https://")), linkType !== Contentful.INLINES.HYPERLINK && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(f36Components.FormLabel, {
     isRequired: true,
     htmlFor: ""
-  }, "Link target", ' '), linkEntity && linkEntity.sys.linkType === SYS_LINK_TYPES[linkType] ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(f36Components.TextLink, {
+  }, "Link target", ' '), linkEntity && linkEntity.sys.linkType === SYS_LINK_TYPES[linkType] ? /*#__PURE__*/React.createElement(React.Fragment, null, !props.readonly && /*#__PURE__*/React.createElement(f36Components.TextLink, {
     testId: "entity-selection-link",
     onClick: resetLinkEntity,
     className: styles$b.removeSelectionLabel
@@ -3159,7 +3159,7 @@ function HyperlinkModal(props) {
     type: "submit",
     variant: "positive",
     size: "small",
-    isDisabled: !isLinkComplete(),
+    isDisabled: props.readonly || !isLinkComplete(),
     onClick: handleOnSubmit,
     testId: "confirm-cta"
   }, props.linkType ? 'Update' : 'Insert'))));
@@ -3172,22 +3172,23 @@ function _addOrEditLink() {
   _addOrEditLink = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3(editor, sdk, logAction, targetPath) {
     var _target$sys$linkType;
 
-    var selectionBeforeBlur, linkType, linkText, linkTarget, linkEntity, _getNodeEntryFromSele, node, path, selectionAfterFocus, currentLinkText, isEditing, data, text, url, type, target;
+    var isReadOnly, selectionBeforeBlur, linkType, linkText, linkTarget, linkEntity, _getNodeEntryFromSele, node, path, selectionAfterFocus, currentLinkText, isEditing, data, text, url, type, target;
 
     return runtime_1.wrap(function _callee3$(_context3) {
       while (1) {
         switch (_context3.prev = _context3.next) {
           case 0:
+            isReadOnly = Slate.ReactEditor.isReadOnly(editor);
             selectionBeforeBlur = editor.selection ? _extends({}, editor.selection) : undefined;
 
             if (!(!targetPath && !selectionBeforeBlur)) {
-              _context3.next = 3;
+              _context3.next = 4;
               break;
             }
 
             return _context3.abrupt("return");
 
-          case 3:
+          case 4:
             _getNodeEntryFromSele = getNodeEntryFromSelection(editor, LINK_TYPES, targetPath), node = _getNodeEntryFromSele[0], path = _getNodeEntryFromSele[1];
 
             if (node && path) {
@@ -3201,7 +3202,7 @@ function _addOrEditLink() {
             currentLinkText = linkText || (editor.selection ? slate.Editor.string(editor, editor.selection) : '');
             isEditing = Boolean(node && path);
             logAction(isEditing ? 'openEditHyperlinkDialog' : 'openCreateHyperlinkDialog');
-            _context3.next = 11;
+            _context3.next = 12;
             return fieldEditorShared.ModalDialogLauncher.openDialog({
               title: isEditing ? 'Edit hyperlink' : 'Insert hyperlink',
               width: 'large',
@@ -3216,16 +3217,17 @@ function _addOrEditLink() {
                 linkType: linkType,
                 linkEntity: linkEntity,
                 onClose: onClose,
-                sdk: sdk
+                sdk: sdk,
+                readonly: isReadOnly
               });
             });
 
-          case 11:
+          case 12:
             data = _context3.sent;
             slate.Transforms.select(editor, selectionAfterFocus);
 
             if (data) {
-              _context3.next = 17;
+              _context3.next = 18;
               break;
             }
 
@@ -3233,7 +3235,7 @@ function _addOrEditLink() {
             logAction(isEditing ? 'cancelEditHyperlinkDialog' : 'cancelCreateHyperlinkDialog');
             return _context3.abrupt("return");
 
-          case 17:
+          case 18:
             text = data.linkText, url = data.linkTarget, type = data.linkType, target = data.linkEntity;
             slate.Editor.withoutNormalizing(editor, function () {
               insertLink(editor, {
@@ -3250,7 +3252,7 @@ function _addOrEditLink() {
             });
             focus(editor);
 
-          case 21:
+          case 22:
           case "end":
             return _context3.stop();
         }
@@ -3489,7 +3491,6 @@ var styles$c = {
 
 function EntityHyperlink(props) {
   var editor = useContentfulEditor();
-  var isReadOnly = Slate.useReadOnly();
   var sdk = useSdkContext();
   var target = props.element.data.target;
   var onEntityFetchComplete = props.onEntityFetchComplete;
@@ -3519,7 +3520,6 @@ function EntityHyperlink(props) {
   }, /*#__PURE__*/React.createElement(f36Components.TextLink, {
     as: "a",
     onClick: handleClick,
-    isDisabled: isReadOnly,
     className: styles$c.hyperlink,
     "data-link-type": target.sys.linkType,
     "data-link-id": target.sys.id
@@ -3528,7 +3528,6 @@ function EntityHyperlink(props) {
 
 function UrlHyperlink(props) {
   var editor = useContentfulEditor();
-  var isReadOnly = Slate.useReadOnly();
   var sdk = useSdkContext();
   var uri = props.element.data.uri;
 
@@ -3553,7 +3552,6 @@ function UrlHyperlink(props) {
     href: uri,
     rel: "noopener noreferrer",
     onClick: handleClick,
-    isDisabled: isReadOnly,
     className: styles$c.hyperlink
   }, props.children));
 }
@@ -6889,7 +6887,8 @@ var styles$j = {
     }
   }),
   disabled: /*#__PURE__*/emotion.css({
-    background: tokens.gray100
+    background: tokens.gray100,
+    cursor: 'not-allowed'
   })
 };