@atlaskit/renderer 105.1.1 → 106.0.0

package/dist/es2019/react/index.js

@@ -12,21 +12,17 @@ import { getText } from '../utils';
 import { findChildrenByType } from 'prosemirror-utils';
 import { insideBreakoutLayout } from './renderer-node';
 import { isCodeMark } from './marks/code';
-
 function mergeMarks(marksAndNodes) {
   return marksAndNodes.reduce((acc, markOrNode) => {
     const prev = acc.length && acc[acc.length - 1] || null;
-
     if (markOrNode.type instanceof MarkType && prev && prev.type instanceof MarkType && Array.isArray(prev.content) && isSameMark(prev, markOrNode)) {
       prev.content = mergeMarks(prev.content.concat(markOrNode.content));
     } else {
       acc.push(markOrNode);
     }
-
     return acc;
   }, []);
 }
-
 export default class ReactSerializer {
   /**
    * The reason we have this extra array here is because we need to generate the same unique
@@ -36,23 +32,16 @@ export default class ReactSerializer {
    * We will eventually need to refactor the current approach to generate unique ids
    * for headers under this ticket -> https://product-fabric.atlassian.net/browse/ED-9668
    */
+
   constructor(init) {
     _defineProperty(this, "headingIds", []);
-
     _defineProperty(this, "expandHeadingIds", []);
-
     _defineProperty(this, "allowCopyToClipboard", false);
-
     _defineProperty(this, "allowPlaceholderText", true);
-
     _defineProperty(this, "allowCustomPanels", false);
-
     _defineProperty(this, "startPos", 1);
-
     _defineProperty(this, "surroundTextNodesWithTextWrapper", false);
-
     _defineProperty(this, "allowAnnotations", false);
-
     _defineProperty(this, "serializeFragmentChild", (node, {
       index,
       parentInfo
@@ -72,41 +61,34 @@ export default class ReactSerializer {
       this.startPos = pos + node.nodeSize;
       const marks = node.marks ? [...node.marks] : [];
       const isMedia = node.type.name === 'media';
-
       const shouldSkipMark = mark => this.allowMediaLinking !== true && isMedia && mark.type.name === 'link';
-
       return marks.reverse().reduce((content, mark) => {
         if (shouldSkipMark(mark)) {
           return content;
         }
-
         return this.renderMark(markToReact(mark), this.withMediaMarkProps(node, mark, this.getMarkProps(mark, [], node)), `${mark.type.name}-${index}`, content);
       }, serializedContent);
     });
-
     _defineProperty(this, "withMediaMarkProps", (node, mark, defaultProps) => {
       if (mark.type.name === 'link' && node.type.name === 'media') {
-        return { ...defaultProps,
+        return {
+          ...defaultProps,
           isMediaLink: true
         };
       }
-
       return defaultProps;
     });
-
     _defineProperty(this, "getUnsupportedContentProps", node => {
       return {
         node,
         dispatchAnalyticsEvent: this.fireAnalyticsEvent
       };
     });
-
     _defineProperty(this, "getAnnotationMarkProps", (mark, marksParentPath) => {
       const annotationParentIds = (marksParentPath || []).reduce((acc, parent) => {
         if (isAnnotationMark(parent)) {
           return [...acc, parent.attrs.id];
         }
-
         return acc;
       }, []);
       return {
@@ -119,20 +101,19 @@ export default class ReactSerializer {
         }
       };
     });
-
     _defineProperty(this, "getMarkProps", (mark, marksParentPath, node) => {
       if (isAnnotationMark(mark)) {
         return this.getAnnotationMarkProps(mark, marksParentPath);
       }
-
       const {
         key,
         ...otherAttrs
       } = mark.attrs;
       const extraProps = {
         isInline: node === null || node === void 0 ? void 0 : node.isInline
-      }; // currently the only mark which has custom props is the code mark
+      };
 
+      // currently the only mark which has custom props is the code mark
       const markSpecificProps = isCodeMark(mark) ? {
         // The appearance being mobile indicates we are in an renderer being
         // rendered by mobile bridge in a web view.
@@ -154,7 +135,6 @@ export default class ReactSerializer {
       };
       return props;
     });
-
     this.providers = init.providers;
     this.eventHandlers = init.eventHandlers;
     this.extensionHandlers = init.extensionHandlers;
@@ -182,78 +162,57 @@ export default class ReactSerializer {
     this.nodeComponents = init.nodeComponents;
     this.allowWindowedCodeBlock = init.allowWindowedCodeBlock;
   }
-
   resetState() {
     this.headingIds = [];
     this.expandHeadingIds = [];
     this.startPos = 1;
   }
-
   getNodeProps(node, parentInfo) {
     const path = parentInfo ? parentInfo.path : undefined;
-
     switch (node.type.name) {
       case 'date':
         return this.getDateProps(node, parentInfo);
-
       case 'hardBreak':
         return this.getHardBreakProps(node, path);
-
       case 'heading':
         return this.getHeadingProps(node, path);
-
       case 'media':
         return this.getMediaProps(node, path);
-
       case 'emoji':
         return this.getEmojiProps(node);
-
       case 'mediaGroup':
         return this.getMediaGroupProps(node);
-
       case 'mediaInline':
         return this.getMediaInlineProps(node);
-
       case 'mediaSingle':
         return this.getMediaSingleProps(node, path);
-
       case 'table':
         return this.getTableProps(node, path);
-
       case 'tableHeader':
       case 'tableRow':
         return this.getTableChildrenProps(node);
-
       case 'taskItem':
         return this.getTaskItemProps(node, path);
-
       case 'embedCard':
         return this.getEmbedCardProps(node, path);
-
       case 'expand':
         return this.getExpandProps(node, path);
-
       case 'unsupportedBlock':
       case 'unsupportedInline':
         return this.getUnsupportedContentProps(node);
-
       case 'codeBlock':
         return this.getCodeBlockProps(node);
-
       case 'panel':
         return this.getPanelProps(node);
-
       default:
         return this.getProps(node, path);
     }
   }
-
   serializeFragment(fragment, props = {}, target = this.allowSelectAllTrap ? DocWithSelectAllTrap : Doc, key = 'root-0', parentInfo) {
     // This makes sure that we reset internal state on re-render.
     if (key === 'root-0') {
       this.resetState();
     }
-
     return this.renderNode(target, props, key, ReactSerializer.getChildNodes(fragment).map((node, index) => {
       if (isTextWrapper(node)) {
         return this.serializeTextWrapper(node.content, {
@@ -261,14 +220,12 @@ export default class ReactSerializer {
           parentInfo
         });
       }
-
       return this.serializeFragmentChild(node, {
         index,
         parentInfo
       });
     }));
   }
-
   serializeTextWrapper(content, {
     index,
     parentInfo
@@ -288,7 +245,6 @@ export default class ReactSerializer {
       });
     });
   }
-
   serializeMark({
     mark,
     parentNode,
@@ -302,16 +258,13 @@ export default class ReactSerializer {
           path: [...parentMark.path, childMark]
         }
       });
-
       const content = (mark.content || []).map(serializeContent);
       const markKey = `${mark.type.name}-component__${this.startPos}__${parentMark.path.length}`;
       return this.renderMark(markToReact(mark), this.getMarkProps(mark, parentMark.path), markKey, content);
     }
-
     const startPos = this.startPos;
     const endPos = startPos + mark.nodeSize;
     this.startPos = endPos;
-
     if (this.surroundTextNodesWithTextWrapper) {
       const textKey = `text-wrapper_${this.startPos}`;
       const parentDepth = Math.max(parentNode.path.length - 1, 0);
@@ -321,46 +274,41 @@ export default class ReactSerializer {
         endPos: endPos + parentDepth
       }, mark.text);
     }
-
     return mark.text || '';
   }
-
   renderNode(NodeComponent, props, key, content) {
     return /*#__PURE__*/React.createElement(NodeComponent, _extends({
       key: key
     }, props), content);
   }
-
   renderMark(MarkComponent, props, key, content) {
     return /*#__PURE__*/React.createElement(MarkComponent, _extends({
       key: key
     }, props), content);
   }
-
   getTableChildrenProps(node) {
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       allowColumnSorting: this.allowColumnSorting
     };
   }
-
   getTableProps(node, path = []) {
     // TODO: https://product-fabric.atlassian.net/browse/CEMS-1048
     const stickyHeaders = !insideBreakoutLayout(path) ? this.stickyHeaders : undefined;
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       allowColumnSorting: this.allowColumnSorting,
       columnWidths: calcTableColumnWidths(node),
       tableNode: node,
       stickyHeaders
     };
   }
-
   getDateProps(node, parentInfo) {
     return {
       timestamp: node.attrs && node.attrs.timestamp,
       parentIsIncompleteTask: parentInfo && parentInfo.parentIsIncompleteTask
     };
   }
-
   getMediaSingleProps(node, path = []) {
     const {
       nodes: {
@@ -375,29 +323,25 @@ export default class ReactSerializer {
     const blockNodeNames = [expand, nestedExpand, layoutColumn].filter(node => Boolean(node)) // Check if the node exist first
     .map(node => node.name);
     const isInsideOfBlockNode = path && path.some(n => n.type && blockNodeNames.indexOf(n.type.name) > -1);
-
     const isLinkMark = mark => mark.type === link;
-
     const childHasLink = node.firstChild && node.firstChild.marks.filter(m => isLinkMark(m) || this.allowMediaLinking === true).length;
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       isInsideOfBlockNode,
       childHasLink,
       featureFlags: this.media && this.media.featureFlags
     };
   }
-
   getMediaProps(node, path = []) {
     var _this$media;
-
     const {
       marks: {
         link
       }
     } = node.type.schema;
-
     const isLinkMark = mark => mark.type === link;
-
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       marks: node.marks.filter(m => !isLinkMark(m) || this.allowMediaLinking === true),
       isLinkMark,
       allowAltTextOnImages: this.allowAltTextOnImages,
@@ -406,13 +350,12 @@ export default class ReactSerializer {
       ssr: (_this$media = this.media) === null || _this$media === void 0 ? void 0 : _this$media.ssr
     };
   }
-
   getEmojiProps(node) {
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       resourceConfig: this.emojiResourceConfig
     };
   }
-
   getEmbedCardProps(node, path = []) {
     const {
       nodes: {
@@ -424,15 +367,15 @@ export default class ReactSerializer {
     const blockNodeNames = [expand, nestedExpand, layoutColumn].filter(node => Boolean(node)) // Check if the node exist first
     .map(node => node.name);
     const isInsideOfBlockNode = path && path.some(n => n.type && blockNodeNames.indexOf(n.type.name) > -1);
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       isInsideOfBlockNode
     };
   }
-
   getMediaGroupProps(node) {
     var _this$media2, _this$media3;
-
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       shouldOpenMediaViewer: this.shouldOpenMediaViewer,
       allowAltTextOnImages: this.allowAltTextOnImages,
       featureFlags: this.media && this.media.featureFlags,
@@ -440,31 +383,28 @@ export default class ReactSerializer {
       ssr: (_this$media3 = this.media) === null || _this$media3 === void 0 ? void 0 : _this$media3.ssr
     };
   }
-
   getMediaInlineProps(node) {
-    return { ...this.getProps(node)
+    return {
+      ...this.getProps(node)
     };
   }
-
   getTaskItemProps(node, path = []) {
-    return { ...this.getProps(node, path),
+    return {
+      ...this.getProps(node, path),
       disabled: this.disableActions
     };
   }
-
   getHardBreakProps(node, path = []) {
     let forceNewLine = false;
     const parentNode = path.length > 0 ? path[path.length - 1] : null;
-
     if (parentNode && parentNode.lastChild === node) {
       forceNewLine = true;
     }
-
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       forceNewLine
     };
   }
-
   getCodeBlockProps(node) {
     // The appearance being mobile indicates we are in an renderer being
     // rendered by mobile bridge in a web view.
@@ -472,18 +412,18 @@ export default class ReactSerializer {
     // off, so we disable it. This is also to keep the behaviour consistent with
     // the rendering in the mobile Native Renderer.
     const codeBidiWarningTooltipEnabled = this.appearance !== 'mobile';
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       text: node.textContent,
       codeBidiWarningTooltipEnabled
     };
   }
-
   getPanelProps(node) {
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       allowCustomPanels: this.allowCustomPanels
     };
   }
-
   getProps(node, path = []) {
     return {
       text: node.text,
@@ -511,72 +451,63 @@ export default class ReactSerializer {
       ...node.attrs
     };
   }
-
   headingAnchorSupported(path = []) {
     const isImmediateParent = (path, nodeName) => {
       return path.length > 0 && path[path.length - 1].type.name === nodeName;
     };
-
     return isNestedHeaderLinksEnabled(this.allowHeadingAnchorLinks) || path.length === 0 || isImmediateParent(path, 'layoutColumn');
   }
-
   getHeadingProps(node, path = []) {
-    return { ...this.getProps(node, path),
+    return {
+      ...this.getProps(node, path),
       content: node.content ? node.content.toJSON() : undefined,
       headingId: this.getHeadingId(node, this.headingIds),
       showAnchorLink: this.appearance !== 'comment' && this.allowHeadingAnchorLinks && !this.disableHeadingIDs && this.headingAnchorSupported(path)
     };
   }
-
   getExpandProps(node, path = []) {
     if (!isNestedHeaderLinksEnabled(this.allowHeadingAnchorLinks)) {
       return this.getProps(node);
     }
-
     const nestedHeaderIds = findChildrenByType(node, node.type.schema.nodes.heading).map(({
       node
     }) => this.getHeadingId(node, this.expandHeadingIds));
-    return { ...this.getProps(node),
+    return {
+      ...this.getProps(node),
       nestedHeaderIds
     };
-  } // The return value of this function is NOT url encoded,
+  }
+
+  // The return value of this function is NOT url encoded,
   // In HTML5 standard, id can contain any characters, encoding is no necessary.
   // Plus we trying to avoid double encoding, therefore we leave the value as is.
   // Remember to use encodeURIComponent when generating url from the id value.
-
-
   getHeadingId(node, headingIds) {
     if (this.disableHeadingIDs || !node.content.size) {
       return;
-    } // We are not use node.textContent here, because we would like to handle cases where
-    // headings only contain inline blocks like emoji, status and date.
-
+    }
 
+    // We are not use node.textContent here, because we would like to handle cases where
+    // headings only contain inline blocks like emoji, status and date.
     const nodeContent = node.content.toJSON().reduce((acc, node) => acc.concat(getText(node) || ''), '').trim().replace(/\s/g, '-');
-
     if (!nodeContent) {
       return;
     }
-
     return this.getUniqueHeadingId(nodeContent, headingIds);
   }
-
   getUniqueHeadingId(baseId, headingIds, counter = 0) {
     if (counter === 0 && headingIds.indexOf(baseId) === -1) {
       headingIds.push(baseId);
       return baseId;
     } else if (counter !== 0) {
       const headingId = `${baseId}.${counter}`;
-
       if (headingIds.indexOf(headingId) === -1) {
         headingIds.push(headingId);
         return headingId;
       }
     }
-
     return this.getUniqueHeadingId(baseId, headingIds, ++counter);
   }
-
   static getChildNodes(fragment) {
     const children = [];
     fragment.forEach(node => {
@@ -584,44 +515,38 @@ export default class ReactSerializer {
     });
     return mergeTextNodes(children);
   }
-
   static getMarks(node) {
     if (!node.marks || node.marks.length === 0) {
       return [];
     }
-
     return getMarksByOrder(node.marks);
   }
-
   static buildMarkStructure(content) {
     return mergeMarks(content.map(node => {
       const nodeMarks = this.getMarks(node);
-
       if (nodeMarks.length === 0) {
         return node;
       }
-
       return nodeMarks.reverse().reduce((acc, mark) => {
         const {
           eq
         } = mark;
-        return { ...mark,
+        return {
+          ...mark,
           eq,
           content: [acc]
         };
       }, node);
     }));
-  } // TODO: ED-9004 Remove unused ReactSerializer.fromSchema in renderer
-  // https://sourcegraph-frontend.internal.shared-prod.us-west-2.kitt-inf.net/search?q=ReactSerializer.fromSchema&patternType=literal
-
+  }
 
+  // TODO: ED-9004 Remove unused ReactSerializer.fromSchema in renderer
+  // https://sourcegraph-frontend.internal.shared-prod.us-west-2.kitt-inf.net/search?q=ReactSerializer.fromSchema&patternType=literal
   static fromSchema(_, init) {
     if (process.env.NODE_ENV !== 'production') {
       // eslint-disable-next-line no-console
       console.warn('ReactSerializer.fromSchema is deprecated. Please use the constructor instead via new ReactSerializer()');
     }
-
     return new ReactSerializer(init);
   }
-
 }

package/dist/es2019/react/marks/alignment.js

@@ -1,10 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
-
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
 import { alignmentPositionMap } from '@atlaskit/adf-schema';
-
 const MarkWrapper = props => {
   const styles = props['data-align'] ? css`
         text-align: ${alignmentPositionMap[props['data-align']]};
@@ -13,7 +11,6 @@ const MarkWrapper = props => {
     css: styles
   }, props), props.children);
 };
-
 export default function Alignment(props) {
   return jsx(MarkWrapper, {
     className: "fabric-editor-block-mark fabric-editor-alignment",

package/dist/es2019/react/marks/annotation.js

@@ -5,7 +5,6 @@ import { AnnotationMark } from '../../ui/annotations';
 export const isAnnotationMark = mark => {
   return mark && mark.type && mark.type.name === 'annotation';
 };
-
 const AnnotationComponent = ({
   id,
   annotationType,
@@ -14,13 +13,13 @@ const AnnotationComponent = ({
   annotationParentIds = [],
   allowAnnotations
 }) => {
-  const data = { ...dataAttributes,
+  const data = {
+    ...dataAttributes,
     ...buildAnnotationMarkDataAttributes({
       id,
       annotationType
     })
   };
-
   if (allowAnnotations) {
     return /*#__PURE__*/React.createElement(AnnotationMark, {
       id: id,
@@ -29,10 +28,8 @@ const AnnotationComponent = ({
       annotationType: annotationType
     }, children);
   }
-
   return /*#__PURE__*/React.createElement("span", _extends({
     id: id
   }, data), children);
 };
-
 export default AnnotationComponent;

package/dist/es2019/react/marks/confluence-inline-comment.js

@@ -11,5 +11,4 @@ export default class ConfluenceInlineComment extends Component {
       "data-reference": reference
     }, children);
   }
-
 }

package/dist/es2019/react/marks/index.js

@@ -13,8 +13,9 @@ import UnsupportedMark from './unsupportedMark';
 import UnsupportedNodeAttribute from './unsupportedNodeAttribute';
 import DataConsumer from './data-consumer';
 import FragmentMark from './fragment';
-import Annotation, { isAnnotationMark } from './annotation'; // Stage0
+import Annotation, { isAnnotationMark } from './annotation';
 
+// Stage0
 import ConfluenceInlineComment from './confluence-inline-comment';
 export const markToReact = {
   code: Code,

package/dist/es2019/react/marks/link.js

@@ -1,5 +1,4 @@
 import _extends from "@babel/runtime/helpers/extends";
-
 /** @jsx jsx */
 import React, { Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -33,17 +32,13 @@ export default function Link(props) {
     target,
     title: href
   };
-
   if (target === '_blank') {
     anchorProps.rel = 'noreferrer noopener';
   }
-
   const handler = getEventHandler(eventHandlers, 'link');
-
   if (isMediaLink) {
     return jsx(Fragment, null, props.children);
   }
-
   return jsx("a", _extends({
     css: anchorStyles,
     onClick: e => {
@@ -58,7 +53,6 @@ export default function Link(props) {
           }
         });
       }
-
       if (handler) {
         handler(e, href);
       }

package/dist/es2019/react/marks/subsup.js

@@ -1,13 +1,10 @@
 import React from 'react';
-
 const isSub = type => {
   return type === 'sub';
 };
-
 export default function SubSup(props) {
   if (isSub(props.type)) {
     return /*#__PURE__*/React.createElement("sub", props.dataAttributes, props.children);
   }
-
   return /*#__PURE__*/React.createElement("sup", props.dataAttributes, props.children);
 }

package/dist/es2019/react/nodes/bodiedExtension.js

@@ -2,7 +2,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { renderExtension } from './extension';
 import ExtensionRenderer from '../../ui/ExtensionRenderer';
-
 const BodiedExtension = props => {
   const {
     children,
@@ -24,15 +23,13 @@ const BodiedExtension = props => {
       }
     } catch (e) {
       /** We don't want this error to block renderer */
-
       /** We keep rendering the default content */
-    } // Always return default content if anything goes wrong
-
+    }
 
+    // Always return default content if anything goes wrong
     return renderExtension(children, layout, {
       isTopLevel: path.length < 1
     }, removeOverflow);
   });
 };
-
 export default BodiedExtension;