@contentful/field-editor-rich-text 0.26.0-next → 0.26.4-next
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ContentfulEditorProvider.d.ts +2 -2
- package/dist/field-editor-rich-text.cjs.development.js +56 -69
- package/dist/field-editor-rich-text.cjs.development.js.map +1 -1
- package/dist/field-editor-rich-text.cjs.production.min.js +1 -1
- package/dist/field-editor-rich-text.cjs.production.min.js.map +1 -1
- package/dist/field-editor-rich-text.esm.js +57 -70
- package/dist/field-editor-rich-text.esm.js.map +1 -1
- package/dist/helpers/validations.d.ts +2 -1
- package/dist/plugins/Paste/sanitizers/helpers.d.ts +2 -0
- package/dist/plugins/Paste/sanitizers/index.d.ts +1 -0
- package/dist/plugins/Paste/sanitizers/sanitizeEntityBlocks.d.ts +6 -0
- package/package.json +12 -12
- package/CHANGELOG.md +0 -684
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import { FieldExtensionSDK } from '@contentful/app-sdk';
|
|
3
3
|
export declare function getContentfulEditorId(sdk: FieldExtensionSDK): string;
|
|
4
4
|
interface useContentfulEditorHookProps {
|
|
5
5
|
sdk: FieldExtensionSDK;
|
|
6
6
|
}
|
|
7
|
-
export declare const ContentfulEditorProvider:
|
|
7
|
+
export declare const ContentfulEditorProvider: import("react").FC<useContentfulEditorHookProps>, useContentfulEditor: any;
|
|
8
8
|
export {};
|
|
@@ -551,25 +551,9 @@ function getContentfulEditorId(sdk) {
|
|
|
551
551
|
}
|
|
552
552
|
|
|
553
553
|
function useContentfulEditorHook(_ref) {
|
|
554
|
-
var _editor$selection;
|
|
555
|
-
|
|
556
554
|
var sdk = _ref.sdk;
|
|
557
555
|
var editorId = getContentfulEditorId(sdk);
|
|
558
556
|
var editor = plateCore.useStoreEditorRef(editorId);
|
|
559
|
-
|
|
560
|
-
var _React$useState = React.useState((_editor$selection = editor == null ? void 0 : editor.selection) != null ? _editor$selection : null),
|
|
561
|
-
selection = _React$useState[0],
|
|
562
|
-
setSelection = _React$useState[1];
|
|
563
|
-
|
|
564
|
-
React.useEffect(function () {
|
|
565
|
-
if (!(editor != null && editor.selection)) return;
|
|
566
|
-
setSelection(editor.selection);
|
|
567
|
-
}, [editor == null ? void 0 : editor.selection]);
|
|
568
|
-
|
|
569
|
-
if (editor && !(editor != null && editor.selection) && selection) {
|
|
570
|
-
editor.selection = selection;
|
|
571
|
-
}
|
|
572
|
-
|
|
573
557
|
return editor;
|
|
574
558
|
}
|
|
575
559
|
|
|
@@ -680,6 +664,7 @@ var VALIDATIONS = {
|
|
|
680
664
|
ENABLED_MARKS: 'enabledMarks',
|
|
681
665
|
ENABLED_NODE_TYPES: 'enabledNodeTypes'
|
|
682
666
|
};
|
|
667
|
+
var DEFAULT_ENABLED_NODE_TYPES = [Contentful.BLOCKS.DOCUMENT, Contentful.BLOCKS.PARAGRAPH, 'text'];
|
|
683
668
|
|
|
684
669
|
var getRichTextValidation = function getRichTextValidation(field, validationType) {
|
|
685
670
|
return flow(function (v) {
|
|
@@ -690,13 +675,14 @@ var getRichTextValidation = function getRichTextValidation(field, validationType
|
|
|
690
675
|
};
|
|
691
676
|
|
|
692
677
|
var isFormattingOptionEnabled = function isFormattingOptionEnabled(field, validationType, nodeTypeOrMark) {
|
|
693
|
-
var enabledFormattings = getRichTextValidation(field, validationType);
|
|
678
|
+
var enabledFormattings = getRichTextValidation(field, validationType); // TODO: In the future, validations will always be opt-in. In that case
|
|
679
|
+
// we don't need this step.
|
|
694
680
|
|
|
695
681
|
if (enabledFormattings === undefined) {
|
|
696
682
|
return true;
|
|
697
683
|
}
|
|
698
684
|
|
|
699
|
-
return enabledFormattings.includes(nodeTypeOrMark);
|
|
685
|
+
return DEFAULT_ENABLED_NODE_TYPES.concat(enabledFormattings).includes(nodeTypeOrMark);
|
|
700
686
|
};
|
|
701
687
|
|
|
702
688
|
var isNodeTypeEnabled = function isNodeTypeEnabled(field, nodeType) {
|
|
@@ -2535,11 +2521,10 @@ function AssetDropdownMenu(_ref) {
|
|
|
2535
2521
|
onRemove = _ref.onRemove,
|
|
2536
2522
|
isDisabled = _ref.isDisabled,
|
|
2537
2523
|
entityFile = _ref.entityFile;
|
|
2538
|
-
var fileName = entityFile
|
|
2539
|
-
|
|
2540
|
-
|
|
2541
|
-
var
|
|
2542
|
-
image = details.image;
|
|
2524
|
+
var fileName = get(entityFile, 'fileName');
|
|
2525
|
+
var fileSize = get(entityFile, 'details.size');
|
|
2526
|
+
var image = get(entityFile, 'details.image');
|
|
2527
|
+
var mimeType = get(entityFile, 'contentType');
|
|
2543
2528
|
|
|
2544
2529
|
function downloadAsset() {
|
|
2545
2530
|
if (!entityFile) return;
|
|
@@ -3712,6 +3697,8 @@ function addTableTrackingEvents(editor, _ref) {
|
|
|
3712
3697
|
});
|
|
3713
3698
|
}
|
|
3714
3699
|
}, 1);
|
|
3700
|
+
} else {
|
|
3701
|
+
insertData(data);
|
|
3715
3702
|
}
|
|
3716
3703
|
};
|
|
3717
3704
|
}
|
|
@@ -4118,29 +4105,11 @@ function EmbeddedEntityBlockToolbarIcon(_ref) {
|
|
|
4118
4105
|
var editor = useContentfulEditor();
|
|
4119
4106
|
var sdk = useSdkContext();
|
|
4120
4107
|
|
|
4121
|
-
var handleClick =
|
|
4122
|
-
|
|
4123
|
-
|
|
4124
|
-
|
|
4125
|
-
|
|
4126
|
-
case 0:
|
|
4127
|
-
event.preventDefault();
|
|
4128
|
-
onClose();
|
|
4129
|
-
_context.next = 4;
|
|
4130
|
-
return selectEntityAndInsert(nodeType, sdk, editor, logAction || noop);
|
|
4131
|
-
|
|
4132
|
-
case 4:
|
|
4133
|
-
case "end":
|
|
4134
|
-
return _context.stop();
|
|
4135
|
-
}
|
|
4136
|
-
}
|
|
4137
|
-
}, _callee);
|
|
4138
|
-
}));
|
|
4139
|
-
|
|
4140
|
-
return function handleClick(_x) {
|
|
4141
|
-
return _ref2.apply(this, arguments);
|
|
4142
|
-
};
|
|
4143
|
-
}();
|
|
4108
|
+
var handleClick = function handleClick(event) {
|
|
4109
|
+
event.preventDefault();
|
|
4110
|
+
onClose();
|
|
4111
|
+
selectEntityAndInsert(nodeType, sdk, editor, logAction || noop);
|
|
4112
|
+
};
|
|
4144
4113
|
|
|
4145
4114
|
var type = getEntityTypeFromNodeType(nodeType);
|
|
4146
4115
|
var baseClass = "rich-text__" + nodeType;
|
|
@@ -4758,12 +4727,18 @@ var StickyToolbarWrapper = function StickyToolbarWrapper(_ref) {
|
|
|
4758
4727
|
}, children);
|
|
4759
4728
|
};
|
|
4760
4729
|
|
|
4730
|
+
var isHTMLElement = function isHTMLElement(node) {
|
|
4731
|
+
return node.nodeType === Node.ELEMENT_NODE;
|
|
4732
|
+
};
|
|
4761
4733
|
var removeChildNodes = function removeChildNodes(node, predicate) {
|
|
4734
|
+
if (predicate === void 0) {
|
|
4735
|
+
predicate = Boolean;
|
|
4736
|
+
}
|
|
4737
|
+
|
|
4762
4738
|
return Array.from(node.childNodes).filter(predicate).forEach(function (table) {
|
|
4763
4739
|
return node.removeChild(table);
|
|
4764
4740
|
});
|
|
4765
4741
|
};
|
|
4766
|
-
|
|
4767
4742
|
var removeChildNodesUsingPredicate = function removeChildNodesUsingPredicate(predicate) {
|
|
4768
4743
|
return function (nodeList) {
|
|
4769
4744
|
var nodes = Array.from(nodeList);
|
|
@@ -4798,10 +4773,6 @@ var TAG_NAME_TABLE = 'TABLE';
|
|
|
4798
4773
|
var TAG_NAME_TABLE_CAPTION = 'CAPTION';
|
|
4799
4774
|
var DISALLOWED_TABLE_CHILD_ELEMENTS = [TAG_NAME_TABLE_CAPTION];
|
|
4800
4775
|
|
|
4801
|
-
var isHTMLElement = function isHTMLElement(node) {
|
|
4802
|
-
return node.nodeType === Node.ELEMENT_NODE;
|
|
4803
|
-
};
|
|
4804
|
-
|
|
4805
4776
|
var isTableElement = function isTableElement(node) {
|
|
4806
4777
|
return isHTMLElement(node) && node.tagName === TAG_NAME_TABLE;
|
|
4807
4778
|
};
|
|
@@ -4850,12 +4821,40 @@ var sanitizeTables = function sanitizeTables(_ref) {
|
|
|
4850
4821
|
return [doc, editor];
|
|
4851
4822
|
};
|
|
4852
4823
|
|
|
4824
|
+
/**
|
|
4825
|
+
* Ensures the text selection from entity block elements is
|
|
4826
|
+
* not included in the paste buffer.
|
|
4827
|
+
*/
|
|
4828
|
+
|
|
4829
|
+
var sanitizeEntityBlocks = function sanitizeEntityBlocks(_ref) {
|
|
4830
|
+
var doc = _ref[0],
|
|
4831
|
+
editor = _ref[1];
|
|
4832
|
+
var nodes = Array.from(doc.childNodes);
|
|
4833
|
+
|
|
4834
|
+
while (nodes.length > 0) {
|
|
4835
|
+
var node = nodes.pop();
|
|
4836
|
+
|
|
4837
|
+
if (isHTMLElement(node) && node.getAttribute('data-entity-type')) {
|
|
4838
|
+
removeChildNodes(node);
|
|
4839
|
+
continue;
|
|
4840
|
+
}
|
|
4841
|
+
|
|
4842
|
+
for (var _i = 0, _Array$from = Array.from(node.childNodes); _i < _Array$from.length; _i++) {
|
|
4843
|
+
var childNode = _Array$from[_i];
|
|
4844
|
+
nodes.push(childNode);
|
|
4845
|
+
}
|
|
4846
|
+
}
|
|
4847
|
+
|
|
4848
|
+
return [doc, editor];
|
|
4849
|
+
};
|
|
4850
|
+
|
|
4853
4851
|
|
|
4854
4852
|
|
|
4855
4853
|
var sanitizers = {
|
|
4856
4854
|
__proto__: null,
|
|
4857
4855
|
removeComments: removeComments,
|
|
4858
|
-
sanitizeTables: sanitizeTables
|
|
4856
|
+
sanitizeTables: sanitizeTables,
|
|
4857
|
+
sanitizeEntityBlocks: sanitizeEntityBlocks
|
|
4859
4858
|
};
|
|
4860
4859
|
|
|
4861
4860
|
var MIME_TYPE_HTML = 'text/html'; // TODO: Upgrade tslib so we can just flow(...sanitizers);
|
|
@@ -4890,6 +4889,8 @@ function withPasteHandling(editor) {
|
|
|
4890
4889
|
var sanitized = sanitizeHtml(html, editor);
|
|
4891
4890
|
var newData = htmlToDataTransfer(sanitized);
|
|
4892
4891
|
insertData(newData);
|
|
4892
|
+
} else {
|
|
4893
|
+
insertData(data);
|
|
4893
4894
|
}
|
|
4894
4895
|
};
|
|
4895
4896
|
};
|
|
@@ -4914,23 +4915,9 @@ function createParagraphPlugin() {
|
|
|
4914
4915
|
renderElement: plateCore.getRenderElement(elementKeys),
|
|
4915
4916
|
pluginKeys: elementKeys,
|
|
4916
4917
|
onKeyDown: plateCommon.getToggleElementOnKeyDown(Contentful.BLOCKS.PARAGRAPH),
|
|
4917
|
-
deserialize:
|
|
4918
|
-
|
|
4919
|
-
|
|
4920
|
-
element: [_extends({
|
|
4921
|
-
type: Contentful.BLOCKS.PARAGRAPH,
|
|
4922
|
-
deserialize: function deserialize(element) {
|
|
4923
|
-
var isParagraphText = element.nodeName === 'P';
|
|
4924
|
-
var isNotEmpty = element.textContent !== '';
|
|
4925
|
-
var isText = isParagraphText && isNotEmpty;
|
|
4926
|
-
if (!isText) return;
|
|
4927
|
-
return {
|
|
4928
|
-
type: Contentful.BLOCKS.PARAGRAPH
|
|
4929
|
-
};
|
|
4930
|
-
}
|
|
4931
|
-
}, options.deserialize)]
|
|
4932
|
-
};
|
|
4933
|
-
}
|
|
4918
|
+
deserialize: deserializeElement(Contentful.BLOCKS.PARAGRAPH, [{
|
|
4919
|
+
nodeNames: ['P']
|
|
4920
|
+
}])
|
|
4934
4921
|
};
|
|
4935
4922
|
}
|
|
4936
4923
|
var withParagraphOptions = (_withParagraphOptions = {}, _withParagraphOptions[plateParagraph.ELEMENT_PARAGRAPH] = {
|