@wordpress/block-editor 12.6.0 → 12.8.0

package/build/components/rich-text/index.native.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -24,45 +23,25 @@ Object.defineProperty(exports, "__unstableRichTextInputEvent", {
   }
 });
 exports.default = void 0;
-
 var _element = require("@wordpress/element");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _data = require("@wordpress/data");
-
 var _blocks = require("@wordpress/blocks");
-
 var _compose = require("@wordpress/compose");
-
 var _richText = require("@wordpress/rich-text");
-
 var _url = require("@wordpress/url");
-
 var _autocomplete = _interopRequireDefault(require("../autocomplete"));
-
 var _blockEdit = require("../block-edit");
-
 var _removeBrowserShortcuts = require("./remove-browser-shortcuts");
-
 var _filePasteHandler = require("./file-paste-handler");
-
 var _formatToolbarContainer = _interopRequireDefault(require("./format-toolbar-container"));
-
 var _store = require("../../store");
-
 var _utils = require("./utils");
-
 var _embedHandlerPicker = _interopRequireDefault(require("./embed-handler-picker"));
-
 var _content = require("./content");
-
 var _shortcut = require("./shortcut");
-
 var _toolbarButton = require("./toolbar-button");
-
 var _inputEvent = require("./input-event");
-
 /**
  * External dependencies
  */
@@ -74,8 +53,8 @@ var _inputEvent = require("./input-event");
 /**
  * Internal dependencies
  */
-const classes = 'block-editor-rich-text__editable';
 
+const classes = 'block-editor-rich-text__editable';
 function RichTextWrapper({
   children,
   tagName,
@@ -136,7 +115,6 @@ function RichTextWrapper({
     isSelected: blockIsSelected
   } = (0, _blockEdit.useBlockEditContext)();
   const embedHandlerPickerRef = (0, _element.useRef)();
-
   const selector = select => {
     const {
       getSelectionStart,
@@ -153,15 +131,12 @@ function RichTextWrapper({
       __experimentalUndo: undo
     } = getSettings();
     let isSelected;
-
     if (originalIsSelected === undefined) {
       isSelected = selectionStart.clientId === clientId && selectionStart.attributeKey === identifier;
     } else if (originalIsSelected) {
       isSelected = selectionStart.clientId === clientId;
     }
-
     let extraProps = {};
-
     if (_element.Platform.OS === 'native') {
       // If the block of this RichText is unmodified then it's a candidate for replacing when adding a new block.
       // In order to fix https://github.com/wordpress-mobile/gutenberg-mobile/issues/1126, let's blur on unmount in that case.
@@ -172,7 +147,6 @@ function RichTextWrapper({
         shouldBlurOnUnmount
       };
     }
-
     return {
       selectionStart: isSelected ? selectionStart.offset : undefined,
       selectionEnd: isSelected ? selectionEnd.offset : undefined,
@@ -182,11 +156,10 @@ function RichTextWrapper({
       undo,
       ...extraProps
     };
-  }; // This selector must run on every render so the right selection state is
+  };
+  // This selector must run on every render so the right selection state is
   // retrieved from the store on merge.
   // To do: fix this somehow.
-
-
   const {
     selectionStart,
     selectionEnd,
@@ -210,17 +183,17 @@ function RichTextWrapper({
   });
   const hasFormats = !adjustedAllowedFormats || adjustedAllowedFormats.length > 0;
   let adjustedValue = originalValue;
-  let adjustedOnChange = originalOnChange; // Handle deprecated format.
+  let adjustedOnChange = originalOnChange;
 
+  // Handle deprecated format.
   if (Array.isArray(originalValue)) {
     adjustedValue = _blocks.children.toHTML(originalValue);
-
     adjustedOnChange = newValue => originalOnChange(_blocks.children.fromDOM((0, _richText.__unstableCreateElement)(document, newValue).childNodes));
   }
-
   const onSelectionChange = (0, _element.useCallback)((selectionChangeStart, selectionChangeEnd) => {
     selectionChange(clientId, identifier, selectionChangeStart, selectionChangeEnd);
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   [clientId, identifier]);
   const onDelete = (0, _element.useCallback)(({
     value,
@@ -228,16 +201,17 @@ function RichTextWrapper({
   }) => {
     if (onMerge) {
       onMerge(!isReverse);
-    } // Only handle remove on Backspace. This serves dual-purpose of being
+    }
+
+    // Only handle remove on Backspace. This serves dual-purpose of being
     // an intentional user interaction distinguishing between Backspace and
     // Delete to remove the empty field, but also to avoid merge & remove
     // causing destruction of two fields (merge, then removed merged).
-
-
     if (onRemove && (0, _richText.isEmpty)(value) && isReverse) {
       onRemove(!isReverse);
     }
   }, [onMerge, onRemove]);
+
   /**
    * Signals to the RichText owner that the block can be replaced with two
    * blocks as a result of splitting the block by pressing enter, or with
@@ -247,23 +221,23 @@ function RichTextWrapper({
    * @param {Object} record       The rich text value to split.
    * @param {Array}  pastedBlocks The pasted blocks to insert, if any.
    */
-
   const splitValue = (0, _element.useCallback)((record, pastedBlocks = []) => {
     if (!onReplace || !onSplit) {
       return;
     }
-
     const blocks = [];
     const [before, after] = (0, _richText.split)(record);
     const hasPastedBlocks = pastedBlocks.length > 0;
-    let lastPastedBlockIndex = -1; // Consider the after value to be the original it is not empty and
+    let lastPastedBlockIndex = -1;
+
+    // Consider the after value to be the original it is not empty and
     // the before value *is* empty.
+    const isAfterOriginal = (0, _richText.isEmpty)(before) && !(0, _richText.isEmpty)(after);
 
-    const isAfterOriginal = (0, _richText.isEmpty)(before) && !(0, _richText.isEmpty)(after); // Create a block with the content before the caret if there's no pasted
+    // Create a block with the content before the caret if there's no pasted
     // blocks, or if there are pasted blocks and the value is not empty.
     // We do not want a leading empty block on paste, but we do if split
     // with e.g. the enter key.
-
     if (!hasPastedBlocks || !(0, _richText.isEmpty)(before)) {
       blocks.push(onSplit((0, _richText.toHTMLString)({
         value: before,
@@ -271,30 +245,30 @@ function RichTextWrapper({
       }), !isAfterOriginal));
       lastPastedBlockIndex += 1;
     }
-
     if (hasPastedBlocks) {
       blocks.push(...pastedBlocks);
       lastPastedBlockIndex += pastedBlocks.length;
     } else if (onSplitMiddle) {
       blocks.push(onSplitMiddle());
-    } // If there's pasted blocks, append a block with non empty content
+    }
+
+    // If there's pasted blocks, append a block with non empty content
     // after the caret. Otherwise, do append an empty block if there
     // is no `onSplitMiddle` prop, but if there is and the content is
     // empty, the middle block is enough to set focus in.
-
-
     if (hasPastedBlocks ? !(0, _richText.isEmpty)(after) : !onSplitMiddle || !(0, _richText.isEmpty)(after)) {
       blocks.push(onSplit((0, _richText.toHTMLString)({
         value: after,
         multilineTag
       }), isAfterOriginal));
-    } // If there are pasted blocks, set the selection to the last one.
-    // Otherwise, set the selection to the second block.
+    }
 
+    // If there are pasted blocks, set the selection to the last one.
+    // Otherwise, set the selection to the second block.
+    const indexToSelect = hasPastedBlocks ? lastPastedBlockIndex : 1;
 
-    const indexToSelect = hasPastedBlocks ? lastPastedBlockIndex : 1; // If there are pasted blocks, move the caret to the end of the selected block
+    // If there are pasted blocks, move the caret to the end of the selected block
     // Otherwise, retain the default value.
-
     const initialPosition = hasPastedBlocks ? -1 : 0;
     onReplace(blocks, indexToSelect, initialPosition);
   }, [onReplace, onSplit, multilineTag, onSplitMiddle]);
@@ -304,7 +278,6 @@ function RichTextWrapper({
     shiftKey
   }) => {
     const canSplit = onReplace && onSplit;
-
     if (onReplace) {
       const transforms = (0, _blocks.getBlockTransforms)('from').filter(({
         type
@@ -312,20 +285,16 @@ function RichTextWrapper({
       const transformation = (0, _blocks.findTransform)(transforms, item => {
         return item.regExp.test(value.text);
       });
-
       if (transformation) {
         onReplace([transformation.transform({
           content: value.text
         })]);
-
         __unstableMarkAutomaticChange();
       }
     }
-
     if (onCustomEnter) {
       onCustomEnter();
     }
-
     if (multiline) {
       if (shiftKey) {
         if (!disableLineBreaks) {
@@ -343,7 +312,6 @@ function RichTextWrapper({
         end: splitEnd
       } = value;
       const canSplitAtEnd = onSplitAtEnd && splitStart === splitEnd && splitEnd === text.length;
-
       if (shiftKey || !canSplit && !canSplitAtEnd) {
         if (!disableLineBreaks) {
           onChange((0, _richText.insert)(value, '\n'));
@@ -354,7 +322,8 @@ function RichTextWrapper({
         splitValue(value);
       }
     }
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   [onReplace, onSplit, __unstableMarkAutomaticChange, multiline, splitValue, onSplitAtEnd]);
   const onPaste = (0, _element.useCallback)(({
     value,
@@ -379,56 +348,50 @@ function RichTextWrapper({
       onChange((0, _richText.insert)(value, pastedValue));
       return;
     }
-
     if (pastePlainText) {
       onChange((0, _richText.insert)(value, (0, _richText.create)({
         text: plainText
       })));
       return;
-    } // Only process file if no HTML is present.
-    // Note: a pasted file may have the URL as plain text.
-
+    }
 
+    // Only process file if no HTML is present.
+    // Note: a pasted file may have the URL as plain text.
     if (files && files.length && !html) {
       const content = (0, _blocks.pasteHandler)({
         HTML: (0, _filePasteHandler.filePasteHandler)(files),
         mode: 'BLOCKS',
         tagName,
         preserveWhiteSpace
-      }); // Allows us to ask for this information when we get a report.
-      // eslint-disable-next-line no-console
+      });
 
+      // Allows us to ask for this information when we get a report.
+      // eslint-disable-next-line no-console
       window.console.log('Received items:\n\n', files);
-
       if (onReplace && (0, _richText.isEmpty)(value)) {
         onReplace(content);
       } else {
         splitValue(value, content);
       }
-
       return;
     }
+    let mode = onReplace && onSplit ? 'AUTO' : 'INLINE';
 
-    let mode = onReplace && onSplit ? 'AUTO' : 'INLINE'; // Force the blocks mode when the user is pasting
+    // Force the blocks mode when the user is pasting
     // on a new line & the content resembles a shortcode.
     // Otherwise it's going to be detected as inline
     // and the shortcode won't be replaced.
-
     if (mode === 'AUTO' && (0, _richText.isEmpty)(value) && (0, _utils.isShortcode)(plainText)) {
       mode = 'BLOCKS';
     }
-
     const isPastedURL = (0, _url.isURL)(plainText.trim());
-
     const presentEmbedHandlerPicker = () => embedHandlerPickerRef.current?.presentPicker({
       createEmbed: () => onReplace(content, content.length - 1, -1),
       createLink: () => (0, _utils.createLinkInParagraph)(plainText.trim(), onReplace)
     });
-
     if (__unstableEmbedURLOnPaste && (0, _richText.isEmpty)(value) && isPastedURL) {
       mode = 'BLOCKS';
     }
-
     const content = (0, _blocks.pasteHandler)({
       HTML: html,
       plainText,
@@ -436,37 +399,32 @@ function RichTextWrapper({
       tagName,
       preserveWhiteSpace
     });
-
     if (typeof content === 'string') {
       let valueToInsert = (0, _richText.create)({
         html: content
       });
-      (0, _utils.addActiveFormats)(valueToInsert, activeFormats); // If the content should be multiline, we should process text
-      // separated by a line break as separate lines.
+      (0, _utils.addActiveFormats)(valueToInsert, activeFormats);
 
+      // If the content should be multiline, we should process text
+      // separated by a line break as separate lines.
       if (multilineTag) {
         valueToInsert = (0, _richText.replace)(valueToInsert, /\n+/g, _richText.__UNSTABLE_LINE_SEPARATOR);
       }
-
       onChange((0, _richText.insert)(value, valueToInsert));
     } else if (content.length > 0) {
       // When an URL is pasted in an empty paragraph then the EmbedHandlerPicker should showcase options allowing the transformation of that URL
       // into either an Embed block or a link within the target paragraph. If the paragraph is non-empty, the URL is pasted as text.
       const canPasteEmbed = isPastedURL && content.length === 1 && content[0].name === 'core/embed';
-
       if (onReplace && (0, _richText.isEmpty)(value)) {
         if (canPasteEmbed) {
           onChange((0, _richText.insert)(value, (0, _richText.create)({
             text: plainText
           })));
-
           if (__unstableEmbedURLOnPaste) {
             presentEmbedHandlerPicker();
           }
-
           return;
         }
-
         onReplace(content, content.length - 1, -1);
       } else {
         if (canPasteEmbed) {
@@ -475,7 +433,6 @@ function RichTextWrapper({
           })));
           return;
         }
-
         splitValue(value, content);
       }
     }
@@ -484,17 +441,16 @@ function RichTextWrapper({
     if (!onReplace) {
       return;
     }
-
     const {
       start: startPosition,
       text
     } = value;
-    const characterBefore = text.slice(startPosition - 1, startPosition); // The character right before the caret must be a plain space.
+    const characterBefore = text.slice(startPosition - 1, startPosition);
 
+    // The character right before the caret must be a plain space.
     if (characterBefore !== ' ') {
       return;
     }
-
     const trimmedTextBefore = text.slice(0, startPosition).trim();
     const prefixTransforms = (0, _blocks.getBlockTransforms)('from').filter(({
       type
@@ -504,15 +460,12 @@ function RichTextWrapper({
     }) => {
       return trimmedTextBefore === prefix;
     });
-
     if (!transformation) {
       return;
     }
-
     const content = valueToFormat((0, _richText.slice)(value, startPosition, text.length));
     const block = transformation.transform(content);
     onReplace([block]);
-
     __unstableMarkAutomaticChange();
   }, [onReplace, __unstableMarkAutomaticChange]);
   const mergedRef = (0, _compose.useMergeRefs)([forwardedRef, fallbackRef]);
@@ -548,7 +501,8 @@ function RichTextWrapper({
     disabled: disabled,
     unstableOnFocus: unstableOnFocus,
     __unstableAllowPrefixTransformations: __unstableAllowPrefixTransformations,
-    __unstableMultilineRootTag: __unstableMultilineRootTag // Native props.
+    __unstableMultilineRootTag: __unstableMultilineRootTag
+    // Native props.
     ,
     blockIsSelected: originalIsSelected !== undefined ? originalIsSelected : blockIsSelected,
     shouldBlurOnUnmount: shouldBlurOnUnmount,
@@ -569,7 +523,8 @@ function RichTextWrapper({
     setRef: setRef,
     disableSuggestions: disableSuggestions,
     disableAutocorrection: disableAutocorrection,
-    containerWidth: containerWidth // Props to be set on the editable container are destructured on the
+    containerWidth: containerWidth
+    // Props to be set on the editable container are destructured on the
     // element itself for web (see below), but passed through rich text
     // for native.
     ,
@@ -600,9 +555,11 @@ function RichTextWrapper({
     listBoxId,
     activeId,
     onKeyDown
-  }) => (0, _element.createElement)(TagName, { ...editableProps,
+  }) => (0, _element.createElement)(TagName, {
+    ...editableProps,
     ...props,
-    style: props.style ? { ...props.style,
+    style: props.style ? {
+      ...props.style,
       ...editableProps.style
     } : editableProps.style,
     className: (0, _classnames.default)(classes, props.className, editableProps.className),
@@ -617,22 +574,19 @@ function RichTextWrapper({
     ref: embedHandlerPickerRef
   })));
 }
-
 const ForwardedRichTextContainer = (0, _element.forwardRef)(RichTextWrapper);
 ForwardedRichTextContainer.Content = _content.Content;
-
 ForwardedRichTextContainer.isEmpty = value => {
   return !value || value.length === 0;
 };
-
 ForwardedRichTextContainer.Content.defaultProps = {
   format: 'string',
   value: ''
 };
+
 /**
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/rich-text/README.md
  */
-
 var _default = ForwardedRichTextContainer;
 exports.default = _default;
 //# sourceMappingURL=index.native.js.map