@atlaskit/renderer 85.0.0 → 86.0.0

package/dist/cjs/ui/SortingIcon.js

@@ -21,6 +21,10 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _types = require("@atlaskit/editor-common/types");
 
+var _messages = require("../messages");
+
+var _reactIntlNext = require("react-intl-next");
+
 var _templateObject, _templateObject2;
 
 // We use data url here because of this issue:
@@ -56,29 +60,37 @@ var getClassName = function getClassName(status) {
   }
 };
 
-var getTooltipTitle = function getTooltipTitle(status) {
+var getTooltipTitle = function getTooltipTitle(intl, isSortingAllowed, status) {
+  var noOrderLabel = _messages.sortingIconMessages.noOrderLabel,
+      ascOrderLabel = _messages.sortingIconMessages.ascOrderLabel,
+      descOrderLabel = _messages.sortingIconMessages.descOrderLabel,
+      invalidLabel = _messages.sortingIconMessages.invalidLabel;
+
+  if (!isSortingAllowed) {
+    return intl.formatMessage(invalidLabel);
+  }
+
   switch (status) {
     case _types.SortOrder.NO_ORDER:
-      return 'Sort column A to Z';
+      return intl.formatMessage(noOrderLabel);
 
     case _types.SortOrder.ASC:
-      return 'Sort column Z to A';
+      return intl.formatMessage(ascOrderLabel);
 
     case _types.SortOrder.DESC:
-      return 'Clear sorting';
+      return intl.formatMessage(descOrderLabel);
   }
 
   return '';
 };
 
-var notAllowedTooltip = "\u26A0\uFE0F  You can't sort a table with merged cell";
-
 var SortingIcon = function SortingIcon(_ref) {
   var isSortingAllowed = _ref.isSortingAllowed,
-      sortOrdered = _ref.sortOrdered;
+      sortOrdered = _ref.sortOrdered,
+      intl = _ref.intl;
   var activated = sortOrdered !== _types.SortOrder.NO_ORDER;
   var wrapperClassName = !isSortingAllowed ? StatusClassNames.SORTING_NOT_ALLOWED : '';
-  var content = isSortingAllowed ? getTooltipTitle(sortOrdered) : notAllowedTooltip;
+  var content = getTooltipTitle(intl, isSortingAllowed, sortOrdered);
   return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
     delay: 0,
     content: content,
@@ -90,5 +102,6 @@ var SortingIcon = function SortingIcon(_ref) {
   })));
 };
 
-var _default = SortingIcon;
+var _default = (0, _reactIntlNext.injectIntl)(SortingIcon);
+
 exports.default = _default;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "85.0.0",
+	"version": "86.0.0",
 	"sideEffects": false
 }

package/dist/es2019/analytics/enums.js

@@ -31,6 +31,7 @@ export let ACTION;
   ACTION["CREATE_NOT_ALLOWED"] = "createNotAllowed";
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED"] = "unsupportedContentLevelsTrackingSucceeded";
   ACTION["UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED"] = "unsupportedContentLevelsTrackingErrored";
+  ACTION["MEDIA_LINK_TRANSFORMED"] = "mediaLinkTransformed";
 })(ACTION || (ACTION = {}));
 
 export let ACTION_SUBJECT;

package/dist/es2019/messages.js

@@ -14,6 +14,50 @@ export const headingAnchorLinkMessages = defineMessages({
     id: 'fabric.editor.headingLink.failedToCopy',
     defaultMessage: 'Copy failed',
     description: 'failed to copy heading link to clipboard'
+  },
+  copyAriaLabel: {
+    id: 'fabric.editor.headingLink.copyAriaLabel',
+    defaultMessage: 'Copy',
+    description: 'copy aria label for link icon'
+  }
+});
+export const tableCellMessages = defineMessages({
+  noneSortingLabel: {
+    id: 'fabric.editor.headingLink.noneSortingLabel',
+    defaultMessage: 'none',
+    description: 'this table column is not sorted'
+  },
+  ascSortingLabel: {
+    id: 'fabric.editor.headingLink.ascSortingLabel',
+    defaultMessage: 'ascending',
+    description: 'this table column is sorted in ascending order'
+  },
+  descSortingLabel: {
+    id: 'fabric.editor.headingLink.noneSortingLabel',
+    defaultMessage: 'descending',
+    description: 'this table column is sorted in descending order'
+  }
+});
+export const sortingIconMessages = defineMessages({
+  noOrderLabel: {
+    id: 'fabric.editor.headingLink.noOrderLabel',
+    defaultMessage: 'Sort column A to Z',
+    description: 'Sort the column in ascending order'
+  },
+  ascOrderLabel: {
+    id: 'fabric.editor.headingLink.ascOrderLabel',
+    defaultMessage: 'Sort column Z to A',
+    description: 'Sort the column in descending order'
+  },
+  descOrderLabel: {
+    id: 'fabric.editor.headingLink.descOrderLabel',
+    defaultMessage: 'Clear sorting',
+    description: 'clear the sorting from this column'
+  },
+  invalidLabel: {
+    id: 'fabric.editor.headingLink.descOrderLabel',
+    defaultMessage: `⚠️  You can't sort a table with merged cell`,
+    description: 'this sort is invalid for merged cells'
   }
 });
 export const codeBlockCopyButtonMessages = defineMessages({

package/dist/es2019/react/hooks/use-observed-width.js

@@ -0,0 +1,59 @@
+import React from 'react';
+let resizeObserver;
+const nodeToCallback = new WeakMap();
+export const useObservedWidth = (node, useObservedWidthFlag) => {
+  const [rect, setRect] = React.useState({
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0
+  });
+  React.useEffect(() => {
+    if (!node || !useObservedWidthFlag) {
+      return;
+    }
+
+    if (!resizeObserver) {
+      resizeObserver = new ResizeObserver(entries => {
+        for (let entry of entries) {
+          if (nodeToCallback.has(entry.target)) {
+            nodeToCallback.get(entry.target)(entry.contentRect);
+          }
+        }
+      });
+    }
+
+    nodeToCallback.set(node, rect => {
+      const {
+        x,
+        y,
+        width,
+        height,
+        top,
+        left,
+        bottom,
+        right
+      } = rect;
+      return setRect({
+        x,
+        y,
+        width,
+        height,
+        top,
+        left,
+        bottom,
+        right
+      });
+    });
+    resizeObserver.observe(node);
+    return () => {
+      resizeObserver.unobserve(node);
+      nodeToCallback.delete(node);
+    };
+  }, [node, useObservedWidthFlag]);
+  return rect;
+};

package/dist/es2019/react/index.js

@@ -176,6 +176,7 @@ export default class ReactSerializer {
     this.allowAnnotations = Boolean(init.allowAnnotations);
     this.surroundTextNodesWithTextWrapper = Boolean(init.surroundTextNodesWithTextWrapper);
     this.media = init.media;
+    this.smartLinks = init.smartLinks;
     this.allowSelectAllTrap = init.allowSelectAllTrap;
   }
 
@@ -489,6 +490,7 @@ export default class ReactSerializer {
       fireAnalyticsEvent: this.fireAnalyticsEvent,
       nodeType: node.type.name,
       marks: node.marks,
+      smartLinks: this.smartLinks,
       dataAttributes: {
         // We need to account for depth (path.length gives up depth) here
         // but depth doesnt increment the pos, only accounted for.

package/dist/es2019/react/nodes/copy-text-provider.js

@@ -51,7 +51,8 @@ const {
   Consumer
 } = CopyTextContext;
 export const CopyArea = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("div", _extends({
-  ref: ref,
+  ref: ref // eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
+  ,
   style: {
     position: 'absolute',
     left: '-9999px',

package/dist/es2019/react/nodes/heading-anchor.js

@@ -39,11 +39,19 @@ class HeadingAnchor extends React.PureComponent {
 
     _defineProperty(this, "setTooltipState", (message, isClicked = false) => {
       this.setState({
+        // TODO: ED-14403 investigate why this does not translate
         tooltipMessage: this.props.intl.formatMessage(message),
         isClicked
       });
     });
 
+    _defineProperty(this, "getCopyAriaLabel", () => {
+      const {
+        copyAriaLabel
+      } = headingAnchorLinkMessages;
+      return this.props.intl.formatMessage(copyAriaLabel);
+    });
+
     _defineProperty(this, "copyToClipboard", async event => {
       const {
         copiedHeadingLinkToClipboard,
@@ -66,9 +74,10 @@ class HeadingAnchor extends React.PureComponent {
     _defineProperty(this, "renderAnchorButton", () => {
       return /*#__PURE__*/React.createElement(CopyAnchorButton, {
         onMouseLeave: this.resetMessage,
-        onClick: this.copyToClipboard
+        onClick: this.copyToClipboard,
+        "aria-label": this.state.tooltipMessage
       }, /*#__PURE__*/React.createElement(LinkIcon, {
-        label: "copy",
+        label: this.getCopyAriaLabel(),
         size: this.props.level > 3 ? 'small' : 'medium',
         primaryColor: this.state.isClicked ? B400 : N200
       }));

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

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { Card } from '@atlaskit/smart-card';
+import { CardSSR } from '@atlaskit/smart-card/ssr';
 import { UnsupportedInline } from '@atlaskit/editor-common/ui';
 import { CardErrorBoundary } from './fallback';
 import { withSmartCardStorage } from '../../ui/SmartCardStorage';
@@ -11,7 +12,8 @@ const InlineCard = props => {
     url,
     data,
     eventHandlers,
-    portal
+    portal,
+    smartLinks
   } = props;
   const onClick = getCardClickHandler(eventHandlers, url);
   const cardProps = {
@@ -20,6 +22,14 @@ const InlineCard = props => {
     onClick,
     container: portal
   };
+
+  if (smartLinks !== null && smartLinks !== void 0 && smartLinks.ssr && url) {
+    return /*#__PURE__*/React.createElement(CardSSR, {
+      appearance: "inline",
+      url: url
+    });
+  }
+
   return /*#__PURE__*/React.createElement("span", {
     "data-inline-card": true,
     "data-card-data": data ? JSON.stringify(data) : undefined,

package/dist/es2019/react/nodes/mediaSingle/index.js

@@ -1,11 +1,11 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { mapBreakpointToLayoutMaxWidth, WidthConsumer } from '@atlaskit/editor-common/ui';
-import { akEditorFullWidthLayoutWidth, getAkEditorFullPageMaxWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
-import { Component, default as React } from 'react';
+import { default as React } from 'react';
 import { injectIntl } from 'react-intl-next';
+import { getMediaFeatureFlag } from '@atlaskit/media-common';
+import { mapBreakpointToLayoutMaxWidth, getBreakpoint, WidthConsumer } from '@atlaskit/editor-common/ui';
+import { akEditorFullWidthLayoutWidth, getAkEditorFullPageMaxWidth, akEditorDefaultLayoutWidth } from '@atlaskit/editor-shared-styles';
 import { FullPagePadding } from '../../../ui/Renderer/style';
+import { useObservedWidth } from '../../hooks/use-observed-width';
 import { ExtendedUIMediaSingle } from './styles';
-import { getMediaFeatureFlag } from '@atlaskit/media-common';
 const DEFAULT_WIDTH = 250;
 const DEFAULT_HEIGHT = 200;
 
@@ -39,131 +39,151 @@ export const getMediaContainerWidth = (currentContainerWidth, layout) => {
   return !currentContainerWidth && layout !== 'full-width' && layout !== 'wide' ? akEditorDefaultLayoutWidth : currentContainerWidth;
 };
 
-class MediaSingle extends Component {
-  constructor(props) {
-    super(props);
+const MediaSingle = props => {
+  var _ref$current;
 
-    _defineProperty(this, "onExternalImageLoaded", ({
+  const {
+    rendererAppearance,
+    featureFlags,
+    isInsideOfBlockNode,
+    allowDynamicTextSizing,
+    layout,
+    children,
+    width: pctWidth
+  } = props;
+  const isCaptionsFlaggedOn = getMediaFeatureFlag('captions', featureFlags);
+  const [externalImageDimensions, setExternalImageDimensions] = React.useState({
+    width: 0,
+    height: 0
+  });
+  const ref = React.useRef(null);
+  const onExternalImageLoaded = React.useCallback(({
+    width,
+    height
+  }) => {
+    setExternalImageDimensions({
       width,
       height
-    }) => {
-      this.setState({
-        width,
-        height
-      });
     });
+  }, []);
+  const observedWidthFlag = getMediaFeatureFlag('observedWidth', featureFlags);
+  const {
+    width: observedWidth
+  } = useObservedWidth((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.parentElement, observedWidthFlag);
+  let media;
+  const [node, caption] = React.Children.toArray(children);
 
-    _defineProperty(this, "isCaptionsFlaggedOn", getMediaFeatureFlag('captions', this.props.featureFlags));
+  if (!isMediaElement(node)) {
+    const mediaElement = checkForMediaElement(node.props.children);
 
-    this.state = {}; // Need to initialize with empty state.
-  }
+    if (!mediaElement) {
+      return node;
+    }
 
-  render() {
-    const {
-      props
-    } = this;
-    let media;
-    const [node, caption] = React.Children.toArray(props.children);
+    media = mediaElement;
+  } else {
+    media = node;
+  }
 
-    if (!isMediaElement(node)) {
-      const mediaElement = checkForMediaElement(node.props.children);
+  let {
+    width = DEFAULT_WIDTH,
+    height = DEFAULT_HEIGHT,
+    type
+  } = media.props;
 
-      if (!mediaElement) {
-        return node;
-      }
+  if (type === 'external') {
+    const {
+      width: stateWidth,
+      height: stateHeight
+    } = externalImageDimensions;
 
-      media = mediaElement;
-    } else {
-      media = node;
+    if (width === null) {
+      width = stateWidth || DEFAULT_WIDTH;
     }
 
-    let {
-      width = DEFAULT_WIDTH,
-      height = DEFAULT_HEIGHT,
-      type
-    } = media.props;
-
-    if (type === 'external') {
-      const {
-        width: stateWidth,
-        height: stateHeight
-      } = this.state;
-
-      if (width === null) {
-        width = stateWidth || DEFAULT_WIDTH;
-      }
+    if (height === null) {
+      height = stateHeight || DEFAULT_HEIGHT;
+    }
+  }
 
-      if (height === null) {
-        height = stateHeight || DEFAULT_HEIGHT;
+  if (width === null) {
+    width = DEFAULT_WIDTH;
+    height = DEFAULT_HEIGHT;
+  } // TODO: put appearance-based padding into theme instead
+
+
+  const padding = rendererAppearance === 'full-page' ? FullPagePadding * 2 : 0;
+  const isFullWidth = rendererAppearance === 'full-width';
+
+  const calcDimensions = (mediaContainerWidth, mediaBreakpoint) => {
+    const containerWidth = getMediaContainerWidth(mediaContainerWidth, layout);
+    const breakpoint = mediaBreakpoint || getBreakpoint(containerWidth);
+    const maxWidth = containerWidth;
+    const maxHeight = height / width * maxWidth;
+    const cardDimensions = {
+      width: `${maxWidth}px`,
+      height: `${maxHeight}px`
+    };
+    let nonFullWidthSize = containerWidth;
+
+    if (!isInsideOfBlockNode && rendererAppearance !== 'comment') {
+      const isContainerSizeGreaterThanMaxFullPageWidth = containerWidth - padding >= getAkEditorFullPageMaxWidth(allowDynamicTextSizing);
+
+      if (isContainerSizeGreaterThanMaxFullPageWidth && allowDynamicTextSizing) {
+        nonFullWidthSize = mapBreakpointToLayoutMaxWidth(breakpoint);
+      } else if (isContainerSizeGreaterThanMaxFullPageWidth) {
+        nonFullWidthSize = getAkEditorFullPageMaxWidth(allowDynamicTextSizing);
+      } else {
+        nonFullWidthSize = containerWidth - padding;
       }
     }
 
-    if (width === null) {
-      width = DEFAULT_WIDTH;
-      height = DEFAULT_HEIGHT;
-    } // TODO: put appearance-based padding into theme instead
-
-
+    const minWidth = Math.min(akEditorFullWidthLayoutWidth, containerWidth - padding);
+    const lineLength = isFullWidth ? minWidth : nonFullWidthSize;
+    return {
+      cardDimensions,
+      lineLength,
+      containerWidth
+    };
+  };
+
+  const originalDimensions = {
+    height,
+    width
+  };
+
+  const renderMediaSingle = (renderWidth, mediaBreakpoint) => {
     const {
-      rendererAppearance,
+      cardDimensions,
+      lineLength,
+      containerWidth
+    } = calcDimensions(renderWidth, mediaBreakpoint);
+    const mediaComponent = /*#__PURE__*/React.cloneElement(media, {
+      resizeMode: 'stretchy-fit',
+      cardDimensions,
+      originalDimensions,
+      onExternalImageLoaded,
+      disableOverlay: true,
       featureFlags
-    } = this.props;
-    const padding = rendererAppearance === 'full-page' ? FullPagePadding * 2 : 0;
-    return /*#__PURE__*/React.createElement(WidthConsumer, null, ({
-      width: widthConsumerValue,
-      breakpoint
-    }) => {
-      const containerWidth = getMediaContainerWidth(widthConsumerValue, props.layout);
-      const {
-        isInsideOfBlockNode,
-        allowDynamicTextSizing
-      } = this.props;
-      const maxWidth = containerWidth;
-      const maxHeight = height / width * maxWidth;
-      const cardDimensions = {
-        width: `${maxWidth}px`,
-        height: `${maxHeight}px`
-      };
-      const isFullWidth = rendererAppearance === 'full-width';
-      let nonFullWidthSize = containerWidth;
-
-      if (!isInsideOfBlockNode && rendererAppearance !== 'comment') {
-        const isContainerSizeGreaterThanMaxFullPageWidth = containerWidth - padding >= getAkEditorFullPageMaxWidth(allowDynamicTextSizing);
-
-        if (isContainerSizeGreaterThanMaxFullPageWidth && allowDynamicTextSizing) {
-          nonFullWidthSize = mapBreakpointToLayoutMaxWidth(breakpoint);
-        } else if (isContainerSizeGreaterThanMaxFullPageWidth) {
-          nonFullWidthSize = getAkEditorFullPageMaxWidth(allowDynamicTextSizing);
-        } else {
-          nonFullWidthSize = containerWidth - padding;
-        }
-      }
-
-      const lineLength = isFullWidth ? Math.min(akEditorFullWidthLayoutWidth, containerWidth - padding) : nonFullWidthSize;
-      const originalDimensions = {
-        height,
-        width
-      };
-      const mediaComponent = /*#__PURE__*/React.cloneElement(media, {
-        resizeMode: 'stretchy-fit',
-        cardDimensions,
-        originalDimensions,
-        onExternalImageLoaded: this.onExternalImageLoaded,
-        disableOverlay: true,
-        featureFlags: featureFlags
-      });
-      return /*#__PURE__*/React.createElement(ExtendedUIMediaSingle, {
-        layout: props.layout,
-        width: width,
-        height: height,
-        lineLength: isInsideOfBlockNode ? containerWidth : lineLength,
-        containerWidth: containerWidth,
-        pctWidth: props.width,
-        fullWidthMode: isFullWidth
-      }, /*#__PURE__*/React.createElement(React.Fragment, null, mediaComponent), this.isCaptionsFlaggedOn && caption);
     });
-  }
-
-}
+    return /*#__PURE__*/React.createElement(ExtendedUIMediaSingle, {
+      handleMediaSingleRef: ref,
+      layout: layout,
+      width: width,
+      height: height,
+      lineLength: isInsideOfBlockNode ? containerWidth : lineLength,
+      containerWidth: containerWidth,
+      pctWidth: pctWidth,
+      fullWidthMode: isFullWidth
+    }, /*#__PURE__*/React.createElement(React.Fragment, null, mediaComponent), isCaptionsFlaggedOn && caption);
+  };
+
+  return observedWidthFlag ? renderMediaSingle(observedWidth || document.body.offsetWidth) : /*#__PURE__*/React.createElement(WidthConsumer, null, ({
+    width,
+    breakpoint
+  }) => {
+    return renderMediaSingle(width, breakpoint);
+  });
+};
 
 export default injectIntl(MediaSingle);

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

@@ -6,7 +6,6 @@ export default class MentionItem extends PureComponent {
     const {
       eventHandlers,
       id,
-      portal,
       providers,
       text,
       accessLevel
@@ -16,7 +15,6 @@ export default class MentionItem extends PureComponent {
       text: text,
       accessLevel: accessLevel,
       providers: providers,
-      portal: portal,
       eventHandlers: eventHandlers && eventHandlers.mention
     });
   }

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

@@ -16,7 +16,8 @@ export default class Status extends PureComponent {
     }, /*#__PURE__*/React.createElement(AkStatus, {
       text: text,
       color: color,
-      localId: localId
+      localId: localId,
+      role: "presentation"
     }));
   }
 

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

@@ -8,6 +8,8 @@ import SortingIcon from '../../ui/SortingIcon';
 import { MODE, PLATFORM } from '../../analytics/events';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../analytics/enums';
 import { RendererCssClassName } from '../../consts';
+import { injectIntl } from 'react-intl-next';
+import { tableCellMessages } from '../../messages';
 const IgnoreSorting = ['LABEL', 'INPUT'];
 
 const nextStatusOrder = currentSortOrder => {
@@ -25,19 +27,25 @@ const nextStatusOrder = currentSortOrder => {
   return SortOrder.NO_ORDER;
 };
 
-const getSortOrderLabel = currentSortOrder => {
+const getSortOrderLabel = (intl, currentSortOrder) => {
+  const {
+    noneSortingLabel,
+    ascSortingLabel,
+    descSortingLabel
+  } = tableCellMessages;
+
   switch (currentSortOrder) {
     case SortOrder.NO_ORDER:
-      return 'none';
+      return intl.formatMessage(noneSortingLabel);
 
     case SortOrder.ASC:
-      return 'ascending';
+      return intl.formatMessage(ascSortingLabel);
 
     case SortOrder.DESC:
-      return 'descending';
+      return intl.formatMessage(descSortingLabel);
 
     default:
-      return 'none';
+      return intl.formatMessage(noneSortingLabel);
   }
 };
 
@@ -102,7 +110,7 @@ const withCellProps = WrapperComponent => {
 };
 
 export const withSortableColumn = WrapperComponent => {
-  return class WithSortableColumn extends React.Component {
+  class WithSortableColumn extends React.Component {
     constructor(props) {
       super(props);
 
@@ -166,7 +174,8 @@ export const withSortableColumn = WrapperComponent => {
         onSorting,
         children,
         sortOrdered,
-        isHeaderRow
+        isHeaderRow,
+        intl
       } = this.props;
       const sortOrderedClassName = sortOrdered === SortOrder.NO_ORDER ? RendererCssClassName.SORTABLE_COLUMN_NO_ORDER : '';
 
@@ -182,7 +191,7 @@ export const withSortableColumn = WrapperComponent => {
 
       return /*#__PURE__*/React.createElement(WrapperComponent, _extends({}, this.props, {
         className: className,
-        ariaSort: getSortOrderLabel(sortOrdered)
+        ariaSort: getSortOrderLabel(intl, sortOrdered)
       }), /*#__PURE__*/React.createElement("div", {
         className: RendererCssClassName.SORTABLE_COLUMN_BUTTON,
         role: "button",
@@ -199,7 +208,9 @@ export const withSortableColumn = WrapperComponent => {
       }))));
     }
 
-  };
+  }
+
+  return injectIntl(WithSortableColumn);
 };
 export const TableHeader = compose(withSortableColumn, withCellProps)('th');
 export const TableCell = withCellProps('td');

package/dist/es2019/react/nodes/task-item-with-providers.js

@@ -45,11 +45,13 @@ export default class TaskItemWithProviders extends Component {
     const {
       contextIdentifierProvider,
       objectAri,
+      isRenderer,
       ...otherProps
     } = this.props;
     const resolvedObjectId = this.state.resolvedContextProvider && this.state.resolvedContextProvider.objectId || objectAri;
     return /*#__PURE__*/React.createElement(ResourcedTaskItem, _extends({}, otherProps, {
-      objectAri: resolvedObjectId
+      objectAri: resolvedObjectId,
+      isRenderer: isRenderer
     }));
   }