@atlaskit/renderer 109.2.1 → 109.2.3

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/renderer
 
+## 109.2.3
+
+### Patch Changes
+
+- [#66919](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/66919) [`d23cba211264`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d23cba211264) - Added a unsupported node type counts map to the unsupported content level tracking analytics event. This will provide information as to the type of unsupported nodes being encountered by user and help with debuggging the issue.
+- [#67106](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67106) [`f35f74b0b1e5`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f35f74b0b1e5) - fix embed link overlaps table sticky header in Renderer
+
+## 109.2.2
+
+### Patch Changes
+
+- [#65494](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/65494) [`14c48a2fa93d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/14c48a2fa93d) - Moved the example helpers from the test utlity library to editor-core
+- [#65444](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/65444) [`3fe0f77f03fb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3fe0f77f03fb) - Added type to expand button in Renderer & prevent default behaviour on click
+
 ## 109.2.1
 
 ### Patch Changes

package/dist/cjs/analytics/unsupported-content.js

@@ -15,7 +15,8 @@ var processLevelsAndTrack = function processLevelsAndTrack(item, thresholds, dis
       percentage = _getUnsupportedConten.percentage,
       _getUnsupportedConten2 = _getUnsupportedConten.counts,
       supportedNodes = _getUnsupportedConten2.supportedNodes,
-      unsupportedNodes = _getUnsupportedConten2.unsupportedNodes;
+      unsupportedNodes = _getUnsupportedConten2.unsupportedNodes,
+      unsupportedNodeTypeCount = _getUnsupportedConten2.unsupportedNodeTypeCount;
     dispatchAnalyticsEvent({
       action: _analytics.ACTION.UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED,
       actionSubject: _analytics.ACTION_SUBJECT.RENDERER,
@@ -25,7 +26,8 @@ var processLevelsAndTrack = function processLevelsAndTrack(item, thresholds, dis
         unsupportedContentLevelSeverity: severity,
         unsupportedContentLevelPercentage: percentage,
         unsupportedNodesCount: unsupportedNodes,
-        supportedNodesCount: supportedNodes
+        supportedNodesCount: supportedNodes,
+        unsupportedNodeTypeCount: unsupportedNodeTypeCount
       },
       eventType: _analytics.EVENT_TYPE.OPERATIONAL
     });

package/dist/cjs/react/nodes/table/sticky.js

@@ -34,7 +34,7 @@ var fixedTableDivStaticStyles = function fixedTableDivStaticStyles(top, width, r
   } else {
     stickyHeaderZIndex = _editorSharedStyles.akEditorStickyHeaderZIndex;
   }
-  return (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    width: ", "px;\n    z-index: ", ";\n    &\n      .", ",\n      &\n      .", "\n      > table {\n      margin-top: 0;\n      margin-bottom: 0;\n      tr {\n        background: ", ";\n      }\n    }\n\n    border-top: ", "px solid\n      ", ";\n    background: ", ";\n    box-shadow: 0 6px 4px -4px ", ";\n\n    div[data-expanded='false'] & {\n      display: none;\n    }\n\n    &\n      .", ".is-sticky.right-shadow::after,\n      &\n      .", ".is-sticky.left-shadow::before {\n      top: 0px;\n      height: 100%;\n    }\n  "])), typeof top === 'number' && "top: ".concat(top, "px;"), width, stickyHeaderZIndex, _styles.TableSharedCssClassName.TABLE_CONTAINER, _styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-surface, white)", tableStickyPadding, "var(--ds-surface, white)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overflow-perimeter, ".concat(_colors.N40A, ")"), _styles.TableSharedCssClassName.TABLE_CONTAINER, _styles.TableSharedCssClassName.TABLE_CONTAINER);
+  return (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    width: ", "px;\n    z-index: ", ";\n    &\n      .", ",\n      &\n      .", "\n      > table {\n      margin-top: 0;\n      margin-bottom: 0;\n      tr {\n        background: ", ";\n      }\n    }\n\n    border-top: ", "px solid\n      ", ";\n    background: ", ";\n    box-shadow: 0 6px 4px -4px ", ";\n\n    div[data-expanded='false'] & {\n      display: none;\n    }\n\n    &\n      .", ".is-sticky.right-shadow::after,\n      &\n      .", ".is-sticky.left-shadow::before {\n      top: 0px;\n      height: 100%;\n    }\n\n    &.fixedTableDiv[mode='stick'] {\n      z-index: ", ";\n    }\n  "])), typeof top === 'number' && "top: ".concat(top, "px;"), width, stickyHeaderZIndex, _styles.TableSharedCssClassName.TABLE_CONTAINER, _styles.TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-surface, white)", tableStickyPadding, "var(--ds-surface, white)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overflow-perimeter, ".concat(_colors.N40A, ")"), _styles.TableSharedCssClassName.TABLE_CONTAINER, _styles.TableSharedCssClassName.TABLE_CONTAINER, stickyHeaderZIndex);
 };
 var FixedTableDiv = exports.FixedTableDiv = function FixedTableDiv(props) {
   var top = props.top,
@@ -47,6 +47,7 @@ var FixedTableDiv = exports.FixedTableDiv = function FixedTableDiv(props) {
   };
   return (0, _react2.jsx)("div", (0, _extends2.default)({}, attrs, {
     "data-testid": "sticky-table-fixed",
+    className: (0, _table2.isTableResizingEnabled)(rendererAppearance) ? 'fixedTableDiv' : '',
     css: fixedTableCss
   }), props.children);
 };

package/dist/cjs/ui/Expand.js

@@ -9,41 +9,42 @@ exports.default = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
-var _constants = require("@atlaskit/theme/constants");
-var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-right"));
-var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
+var _react = require("@emotion/react");
+var _react2 = _interopRequireWildcard(require("react"));
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _ui = require("@atlaskit/editor-common/ui");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _events = require("../analytics/events");
-var _analytics = require("@atlaskit/editor-common/analytics");
-var _reactIntlNext = require("react-intl-next");
-var _activeHeaderIdProvider = require("./active-header-id-provider");
+var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-right"));
+var _constants = require("@atlaskit/theme/constants");
+var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _uniqueId2 = _interopRequireDefault(require("lodash/uniqueId"));
+var _reactIntlNext = require("react-intl-next");
+var _events = require("../analytics/events");
 var _utils = require("../utils");
+var _activeHeaderIdProvider = require("./active-header-id-provider");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 /** @jsx jsx */
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var titleStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  outline: none;\n  border: none;\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: normal;\n  display: flex;\n  flex: 1;\n  margin: 0;\n  padding: 0 0 0 ", ";\n  text-align: left;\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), _editorSharedStyles.akEditorLineHeight, "var(--ds-space-050, 4px)");
+var titleStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  outline: none;\n  border: none;\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: normal;\n  display: flex;\n  flex: 1;\n  margin: 0;\n  padding: 0 0 0 ", ";\n  text-align: left;\n"])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), _editorSharedStyles.akEditorLineHeight, "var(--ds-space-050, 4px)");
 var Container = function Container(props) {
   var paddingBottom = props.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)";
   var sharedContainerStyles = _ui.sharedExpandStyles.containerStyles(props);
   var styles = function styles() {
-    return (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    padding: 0;\n    padding-bottom: ", ";\n  "])), sharedContainerStyles(), paddingBottom);
+    return (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    padding: 0;\n    padding-bottom: ", ";\n  "])), sharedContainerStyles(), paddingBottom);
   };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
+  return (0, _react.jsx)("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
 var TitleContainer = function TitleContainer(props) {
   var paddingBottom = !props.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)";
   var styles = function styles() {
-    return (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    padding: ", ";\n    padding-bottom: ", ";\n  "])), _ui.sharedExpandStyles.titleContainerStyles(), "var(--ds-space-100, 8px)", paddingBottom);
+    return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n    ", "\n    padding: ", ";\n    padding-bottom: ", ";\n  "])), _ui.sharedExpandStyles.titleContainerStyles(), "var(--ds-space-100, 8px)", paddingBottom);
   };
-  return (0, _react2.jsx)("button", (0, _extends2.default)({
+  return (0, _react.jsx)("button", (0, _extends2.default)({
+    type: "button",
     css: styles
   }, props), props.children);
 };
@@ -52,9 +53,9 @@ var ContentContainer = function ContentContainer(props) {
   var sharedContentStyles = _ui.sharedExpandStyles.contentStyles(props);
   var visibility = props.expanded ? 'visible' : 'hidden';
   var styles = function styles() {
-    return (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n    ", ";\n    padding-right: ", ";\n    // TODO: Migrate away from gridSize\n    // Recommendation: Replace gridSize with 8, or directly replace with 36px\n    padding-left: ", "px;\n    visibility: ", ";\n  "])), sharedContentStyles(), "var(--ds-space-200, 16px)", (0, _constants.gridSize)() * 5 - (0, _constants.gridSize)() / 2, visibility);
+    return (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n    ", ";\n    padding-right: ", ";\n    padding-left: ", ";\n    visibility: ", ";\n  "])), sharedContentStyles(), "var(--ds-space-200, 16px)", "var(--ds-space-400, 32px)", visibility);
   };
-  return (0, _react2.jsx)("div", (0, _extends2.default)({
+  return (0, _react.jsx)("div", (0, _extends2.default)({
     css: styles
   }, props), props.children);
 };
@@ -81,39 +82,40 @@ function Expand(_ref) {
     fireAnalyticsEvent = _ref.fireAnalyticsEvent,
     nestedHeaderIds = _ref.nestedHeaderIds,
     rendererAppearance = _ref.rendererAppearance;
-  var _React$useState = _react.default.useState(false),
+  var _React$useState = _react2.default.useState(false),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
     expanded = _React$useState2[0],
     setExpanded = _React$useState2[1];
-  var _React$useState3 = _react.default.useState(false),
+  var _React$useState3 = _react2.default.useState(false),
     _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
     focused = _React$useState4[0],
     setFocused = _React$useState4[1];
-  var isMobile = (0, _react.useMemo)(function () {
+  var isMobile = (0, _react2.useMemo)(function () {
     return (0, _utils.getPlatform)(rendererAppearance) === 'mobile';
   }, [rendererAppearance]);
   var label = intl.formatMessage(expanded ? _ui.expandMessages.collapseNode : _ui.expandMessages.expandNode);
-  var _useRef = (0, _react.useRef)((0, _uniqueId2.default)('expand-title-')),
+  var _useRef = (0, _react2.useRef)((0, _uniqueId2.default)('expand-title-')),
     id = _useRef.current;
-  var handleFocus = (0, _react.useCallback)(function () {
+  var handleFocus = (0, _react2.useCallback)(function () {
     return setFocused(true);
   }, []);
-  var handleBlur = (0, _react.useCallback)(function () {
+  var handleBlur = (0, _react2.useCallback)(function () {
     return setFocused(false);
   }, []);
-  return (0, _react2.jsx)(Container, {
+  return (0, _react.jsx)(Container, {
     "data-node-type": nodeType,
     "data-title": title,
     "data-expanded": expanded,
     expanded: expanded,
     focused: focused
-  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? (0, _react2.jsx)(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
+  }, nestedHeaderIds && nestedHeaderIds.length > 0 ? (0, _react.jsx)(_activeHeaderIdProvider.ActiveHeaderIdConsumer, {
     nestedHeaderIds: nestedHeaderIds,
     onNestedHeaderIdMatch: function onNestedHeaderIdMatch() {
       return setExpanded(true);
     }
-  }) : null, (0, _react2.jsx)(TitleContainer, {
+  }) : null, (0, _react.jsx)(TitleContainer, {
     onClick: function onClick(e) {
+      e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
       setExpanded(!expanded);
@@ -127,27 +129,27 @@ function Expand(_ref) {
     "aria-expanded": expanded,
     contentEditable: false,
     expanded: expanded
-  }, isMobile ? (0, _react2.jsx)(_ui.ExpandIconWrapper, {
+  }, isMobile ? (0, _react.jsx)(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, (0, _react2.jsx)(_chevronRight.default, {
+  }, (0, _react.jsx)(_chevronRight.default, {
     label: label
-  })) : (0, _react2.jsx)(_tooltip.default, {
+  })) : (0, _react.jsx)(_tooltip.default, {
     content: label,
     position: "top",
     tag: _ui.ExpandLayoutWrapperWithRef,
     testId: 'tooltip'
-  }, (0, _react2.jsx)(_ui.ExpandIconWrapper, {
+  }, (0, _react.jsx)(_ui.ExpandIconWrapper, {
     expanded: expanded
-  }, (0, _react2.jsx)(_chevronRight.default, {
+  }, (0, _react.jsx)(_chevronRight.default, {
     label: label
-  }))), (0, _react2.jsx)("span", {
+  }))), (0, _react.jsx)("span", {
     css: titleStyles,
     id: id
-  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react2.jsx)(ContentContainer, {
+  }, title || intl.formatMessage(_ui.expandMessages.expandDefaultTitle))), (0, _react.jsx)(ContentContainer, {
     expanded: expanded
-  }, (0, _react2.jsx)("div", {
+  }, (0, _react.jsx)("div", {
     className: "".concat(nodeType, "-content-wrapper")
-  }, (0, _react2.jsx)(_ui.WidthProvider, null, (0, _react2.jsx)("div", {
+  }, (0, _react.jsx)(_ui.WidthProvider, null, (0, _react.jsx)("div", {
     css: _ui.clearNextSiblingMarginTopStyle
   }), children))));
 }

package/dist/cjs/ui/Renderer/index.js

@@ -54,7 +54,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "109.2.1";
+var packageVersion = "109.2.3";
 var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/es2019/analytics/unsupported-content.js

@@ -9,7 +9,8 @@ const processLevelsAndTrack = (item, thresholds, dispatchAnalyticsEvent) => {
       percentage,
       counts: {
         supportedNodes,
-        unsupportedNodes
+        unsupportedNodes,
+        unsupportedNodeTypeCount
       }
     } = getUnsupportedContentLevelData(item.doc, thresholds);
     dispatchAnalyticsEvent({
@@ -21,7 +22,8 @@ const processLevelsAndTrack = (item, thresholds, dispatchAnalyticsEvent) => {
         unsupportedContentLevelSeverity: severity,
         unsupportedContentLevelPercentage: percentage,
         unsupportedNodesCount: unsupportedNodes,
-        supportedNodesCount: supportedNodes
+        supportedNodesCount: supportedNodes,
+        unsupportedNodeTypeCount: unsupportedNodeTypeCount
       },
       eventType: EVENT_TYPE.OPERATIONAL
     });

package/dist/es2019/react/nodes/table/sticky.js

@@ -61,6 +61,10 @@ const fixedTableDivStaticStyles = (top, width, rendererAppearance) => {
       top: 0px;
       height: 100%;
     }
+
+    &.fixedTableDiv[mode='stick'] {
+      z-index: ${stickyHeaderZIndex};
+    }
   `;
 };
 export const FixedTableDiv = props => {
@@ -76,6 +80,7 @@ export const FixedTableDiv = props => {
   };
   return jsx("div", _extends({}, attrs, {
     "data-testid": "sticky-table-fixed",
+    className: isTableResizingEnabled(rendererAppearance) ? 'fixedTableDiv' : '',
     css: fixedTableCss
   }), props.children);
 };

package/dist/es2019/ui/Expand.js

@@ -1,19 +1,19 @@
 import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
-import React, { useRef, useCallback, useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
+import React, { useCallback, useMemo, useRef } from 'react';
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { gridSize, fontSize } from '@atlaskit/theme/constants';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { clearNextSiblingMarginTopStyle, ExpandIconWrapper, ExpandLayoutWrapperWithRef, expandMessages, sharedExpandStyles, WidthProvider } from '@atlaskit/editor-common/ui';
+import { akEditorLineHeight, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import ChevronRightIcon from '@atlaskit/icon/glyph/chevron-right';
+import { fontSize } from '@atlaskit/theme/constants';
 import Tooltip from '@atlaskit/tooltip';
-import { expandMessages, sharedExpandStyles, WidthProvider, ExpandIconWrapper, clearNextSiblingMarginTopStyle, ExpandLayoutWrapperWithRef } from '@atlaskit/editor-common/ui';
-import { akEditorLineHeight, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import { PLATFORM, MODE } from '../analytics/events';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { injectIntl } from 'react-intl-next';
-import { ActiveHeaderIdConsumer } from './active-header-id-provider';
 import _uniqueId from 'lodash/uniqueId';
+import { injectIntl } from 'react-intl-next';
+import { MODE, PLATFORM } from '../analytics/events';
 import { getPlatform } from '../utils';
+import { ActiveHeaderIdConsumer } from './active-header-id-provider';
 const titleStyles = css`
   outline: none;
   border: none;
@@ -46,6 +46,7 @@ const TitleContainer = props => {
     padding-bottom: ${paddingBottom};
   `;
   return jsx("button", _extends({
+    type: "button",
     css: styles
   }, props), props.children);
 };
@@ -56,9 +57,7 @@ const ContentContainer = props => {
   const styles = () => css`
     ${sharedContentStyles()};
     padding-right: ${"var(--ds-space-200, 16px)"};
-    // TODO: Migrate away from gridSize
-    // Recommendation: Replace gridSize with 8, or directly replace with 36px
-    padding-left: ${gridSize() * 5 - gridSize() / 2}px;
+    padding-left: ${"var(--ds-space-400, 32px)"};
     visibility: ${visibility};
   `;
   return jsx("div", _extends({
@@ -109,6 +108,7 @@ function Expand({
     onNestedHeaderIdMatch: () => setExpanded(true)
   }) : null, jsx(TitleContainer, {
     onClick: e => {
+      e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
       setExpanded(!expanded);

package/dist/es2019/ui/Renderer/index.js

@@ -35,7 +35,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "109.2.1";
+const packageVersion = "109.2.3";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/esm/analytics/unsupported-content.js

@@ -9,7 +9,8 @@ var processLevelsAndTrack = function processLevelsAndTrack(item, thresholds, dis
       percentage = _getUnsupportedConten.percentage,
       _getUnsupportedConten2 = _getUnsupportedConten.counts,
       supportedNodes = _getUnsupportedConten2.supportedNodes,
-      unsupportedNodes = _getUnsupportedConten2.unsupportedNodes;
+      unsupportedNodes = _getUnsupportedConten2.unsupportedNodes,
+      unsupportedNodeTypeCount = _getUnsupportedConten2.unsupportedNodeTypeCount;
     dispatchAnalyticsEvent({
       action: ACTION.UNSUPPORTED_CONTENT_LEVELS_TRACKING_SUCCEEDED,
       actionSubject: ACTION_SUBJECT.RENDERER,
@@ -19,7 +20,8 @@ var processLevelsAndTrack = function processLevelsAndTrack(item, thresholds, dis
         unsupportedContentLevelSeverity: severity,
         unsupportedContentLevelPercentage: percentage,
         unsupportedNodesCount: unsupportedNodes,
-        supportedNodesCount: supportedNodes
+        supportedNodesCount: supportedNodes,
+        unsupportedNodeTypeCount: unsupportedNodeTypeCount
       },
       eventType: EVENT_TYPE.OPERATIONAL
     });

package/dist/esm/react/nodes/table/sticky.js

@@ -27,7 +27,7 @@ var fixedTableDivStaticStyles = function fixedTableDivStaticStyles(top, width, r
   } else {
     stickyHeaderZIndex = akEditorStickyHeaderZIndex;
   }
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    ", "\n    width: ", "px;\n    z-index: ", ";\n    &\n      .", ",\n      &\n      .", "\n      > table {\n      margin-top: 0;\n      margin-bottom: 0;\n      tr {\n        background: ", ";\n      }\n    }\n\n    border-top: ", "px solid\n      ", ";\n    background: ", ";\n    box-shadow: 0 6px 4px -4px ", ";\n\n    div[data-expanded='false'] & {\n      display: none;\n    }\n\n    &\n      .", ".is-sticky.right-shadow::after,\n      &\n      .", ".is-sticky.left-shadow::before {\n      top: 0px;\n      height: 100%;\n    }\n  "])), typeof top === 'number' && "top: ".concat(top, "px;"), width, stickyHeaderZIndex, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-surface, white)", tableStickyPadding, "var(--ds-surface, white)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overflow-perimeter, ".concat(N40A, ")"), TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_CONTAINER);
+  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    ", "\n    width: ", "px;\n    z-index: ", ";\n    &\n      .", ",\n      &\n      .", "\n      > table {\n      margin-top: 0;\n      margin-bottom: 0;\n      tr {\n        background: ", ";\n      }\n    }\n\n    border-top: ", "px solid\n      ", ";\n    background: ", ";\n    box-shadow: 0 6px 4px -4px ", ";\n\n    div[data-expanded='false'] & {\n      display: none;\n    }\n\n    &\n      .", ".is-sticky.right-shadow::after,\n      &\n      .", ".is-sticky.left-shadow::before {\n      top: 0px;\n      height: 100%;\n    }\n\n    &.fixedTableDiv[mode='stick'] {\n      z-index: ", ";\n    }\n  "])), typeof top === 'number' && "top: ".concat(top, "px;"), width, stickyHeaderZIndex, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, "var(--ds-surface, white)", tableStickyPadding, "var(--ds-surface, white)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overflow-perimeter, ".concat(N40A, ")"), TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_CONTAINER, stickyHeaderZIndex);
 };
 export var FixedTableDiv = function FixedTableDiv(props) {
   var top = props.top,
@@ -40,6 +40,7 @@ export var FixedTableDiv = function FixedTableDiv(props) {
   };
   return jsx("div", _extends({}, attrs, {
     "data-testid": "sticky-table-fixed",
+    className: isTableResizingEnabled(rendererAppearance) ? 'fixedTableDiv' : '',
     css: fixedTableCss
   }), props.children);
 };

package/dist/esm/ui/Expand.js

@@ -3,20 +3,20 @@ import _extends from "@babel/runtime/helpers/extends";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 /** @jsx jsx */
-import React, { useRef, useCallback, useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
+import React, { useCallback, useMemo, useRef } from 'react';
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { gridSize, fontSize } from '@atlaskit/theme/constants';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { clearNextSiblingMarginTopStyle, ExpandIconWrapper, ExpandLayoutWrapperWithRef, expandMessages, sharedExpandStyles, WidthProvider } from '@atlaskit/editor-common/ui';
+import { akEditorLineHeight, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import ChevronRightIcon from '@atlaskit/icon/glyph/chevron-right';
+import { fontSize } from '@atlaskit/theme/constants';
 import Tooltip from '@atlaskit/tooltip';
-import { expandMessages, sharedExpandStyles, WidthProvider, ExpandIconWrapper, clearNextSiblingMarginTopStyle, ExpandLayoutWrapperWithRef } from '@atlaskit/editor-common/ui';
-import { akEditorLineHeight, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import { PLATFORM, MODE } from '../analytics/events';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { injectIntl } from 'react-intl-next';
-import { ActiveHeaderIdConsumer } from './active-header-id-provider';
 import _uniqueId from 'lodash/uniqueId';
+import { injectIntl } from 'react-intl-next';
+import { MODE, PLATFORM } from '../analytics/events';
 import { getPlatform } from '../utils';
+import { ActiveHeaderIdConsumer } from './active-header-id-provider';
 var titleStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  outline: none;\n  border: none;\n  font-size: ", ";\n  line-height: ", ";\n  font-weight: normal;\n  display: flex;\n  flex: 1;\n  margin: 0;\n  padding: 0 0 0 ", ";\n  text-align: left;\n"])), relativeFontSizeToBase16(fontSize()), akEditorLineHeight, "var(--ds-space-050, 4px)");
 var Container = function Container(props) {
   var paddingBottom = props.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)";
@@ -34,6 +34,7 @@ var TitleContainer = function TitleContainer(props) {
     return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    ", "\n    padding: ", ";\n    padding-bottom: ", ";\n  "])), sharedExpandStyles.titleContainerStyles(), "var(--ds-space-100, 8px)", paddingBottom);
   };
   return jsx("button", _extends({
+    type: "button",
     css: styles
   }, props), props.children);
 };
@@ -42,7 +43,7 @@ var ContentContainer = function ContentContainer(props) {
   var sharedContentStyles = sharedExpandStyles.contentStyles(props);
   var visibility = props.expanded ? 'visible' : 'hidden';
   var styles = function styles() {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    ", ";\n    padding-right: ", ";\n    // TODO: Migrate away from gridSize\n    // Recommendation: Replace gridSize with 8, or directly replace with 36px\n    padding-left: ", "px;\n    visibility: ", ";\n  "])), sharedContentStyles(), "var(--ds-space-200, 16px)", gridSize() * 5 - gridSize() / 2, visibility);
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    ", ";\n    padding-right: ", ";\n    padding-left: ", ";\n    visibility: ", ";\n  "])), sharedContentStyles(), "var(--ds-space-200, 16px)", "var(--ds-space-400, 32px)", visibility);
   };
   return jsx("div", _extends({
     css: styles
@@ -104,6 +105,7 @@ function Expand(_ref) {
     }
   }) : null, jsx(TitleContainer, {
     onClick: function onClick(e) {
+      e.preventDefault();
       e.stopPropagation();
       fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent);
       setExpanded(!expanded);

package/dist/esm/ui/Renderer/index.js

@@ -45,7 +45,7 @@ import { EditorMediaClientProvider } from '../../react/utils/EditorMediaClientPr
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "109.2.1";
+var packageVersion = "109.2.3";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/types/analytics/events.d.ts

@@ -46,6 +46,7 @@ type RendererUnsupportedContentLevelsTrackingSucceeded = AEP<ACTION.UNSUPPORTED_
     unsupportedContentLevelPercentage: number;
     unsupportedNodesCount: number;
     supportedNodesCount: number;
+    unsupportedNodeTypeCount: Record<string, number>;
 }, EVENT_TYPE.OPERATIONAL>;
 type RendererUnsupportedContentLevelsTrackingErrored = AEP<ACTION.UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED, ACTION_SUBJECT.RENDERER, undefined, {
     platform: PLATFORM.WEB;

package/dist/types/analytics/unsupported-content.d.ts

@@ -1,5 +1,5 @@
 import type { UnsupportedContentLevelsTracking } from '@atlaskit/editor-common/utils';
-import { AnalyticsEventPayload } from './events';
+import type { AnalyticsEventPayload } from './events';
 type DispatchAnalyticsEvent = (event: AnalyticsEventPayload) => void;
 type DocumentData = {
     rendererId: string;

package/dist/types/react/nodes/inlineExtension.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { RendererContext } from '../types';
-import { Mark as PMMark } from '@atlaskit/editor-prosemirror/model';
+import type { RendererContext } from '../types';
+import type { Mark as PMMark } from '@atlaskit/editor-prosemirror/model';
 import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
-import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 export interface Props {
     extensionHandlers?: ExtensionHandlers;
     providers: ProviderFactory;
@@ -14,5 +14,5 @@ export interface Props {
     localId?: string;
     marks?: PMMark[];
 }
-declare const InlineExtension: React.StatelessComponent<Props>;
+declare const InlineExtension: React.FunctionComponent<Props>;
 export default InlineExtension;

package/dist/types/ui/Expand.d.ts

@@ -1,13 +1,13 @@
-/** @jsx jsx */
 import React from 'react';
-import type { AnalyticsEventPayload } from '../analytics/events';
 import type { WrappedComponentProps } from 'react-intl-next';
+import type { AnalyticsEventPayload } from '../analytics/events';
 import type { RendererAppearance } from './Renderer/types';
 export type StyleProps = {
     expanded?: boolean;
     focused?: boolean;
     'data-node-type'?: 'expand' | 'nestedExpand';
     'data-title'?: string;
+    children?: React.ReactNode;
 };
 export interface ExpandProps {
     title: string;

package/dist/types-ts4.5/analytics/events.d.ts

@@ -46,6 +46,7 @@ type RendererUnsupportedContentLevelsTrackingSucceeded = AEP<ACTION.UNSUPPORTED_
     unsupportedContentLevelPercentage: number;
     unsupportedNodesCount: number;
     supportedNodesCount: number;
+    unsupportedNodeTypeCount: Record<string, number>;
 }, EVENT_TYPE.OPERATIONAL>;
 type RendererUnsupportedContentLevelsTrackingErrored = AEP<ACTION.UNSUPPORTED_CONTENT_LEVELS_TRACKING_ERRORED, ACTION_SUBJECT.RENDERER, undefined, {
     platform: PLATFORM.WEB;

package/dist/types-ts4.5/analytics/unsupported-content.d.ts

@@ -1,5 +1,5 @@
 import type { UnsupportedContentLevelsTracking } from '@atlaskit/editor-common/utils';
-import { AnalyticsEventPayload } from './events';
+import type { AnalyticsEventPayload } from './events';
 type DispatchAnalyticsEvent = (event: AnalyticsEventPayload) => void;
 type DocumentData = {
     rendererId: string;

package/dist/types-ts4.5/react/nodes/inlineExtension.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { RendererContext } from '../types';
-import { Mark as PMMark } from '@atlaskit/editor-prosemirror/model';
+import type { RendererContext } from '../types';
+import type { Mark as PMMark } from '@atlaskit/editor-prosemirror/model';
 import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
-import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 export interface Props {
     extensionHandlers?: ExtensionHandlers;
     providers: ProviderFactory;
@@ -14,5 +14,5 @@ export interface Props {
     localId?: string;
     marks?: PMMark[];
 }
-declare const InlineExtension: React.StatelessComponent<Props>;
+declare const InlineExtension: React.FunctionComponent<Props>;
 export default InlineExtension;

package/dist/types-ts4.5/ui/Expand.d.ts

@@ -1,13 +1,13 @@
-/** @jsx jsx */
 import React from 'react';
-import type { AnalyticsEventPayload } from '../analytics/events';
 import type { WrappedComponentProps } from 'react-intl-next';
+import type { AnalyticsEventPayload } from '../analytics/events';
 import type { RendererAppearance } from './Renderer/types';
 export type StyleProps = {
     expanded?: boolean;
     focused?: boolean;
     'data-node-type'?: 'expand' | 'nestedExpand';
     'data-title'?: string;
+    children?: React.ReactNode;
 };
 export interface ExpandProps {
     title: string;

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "109.2.1",
+  "version": "109.2.3",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
   "main": "dist/cjs/index.js",
@@ -27,12 +27,12 @@
   "dependencies": {
     "@atlaskit/adf-schema": "^35.3.0",
     "@atlaskit/adf-utils": "^19.0.0",
-    "@atlaskit/analytics-listeners": "^8.7.0",
-    "@atlaskit/analytics-namespaced-context": "^6.7.0",
+    "@atlaskit/analytics-listeners": "^8.9.0",
+    "@atlaskit/analytics-namespaced-context": "^6.9.0",
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/button": "^17.2.0",
     "@atlaskit/code": "^15.1.0",
-    "@atlaskit/editor-common": "^76.35.0",
+    "@atlaskit/editor-common": "^76.39.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-palette": "1.5.2",
     "@atlaskit/editor-prosemirror": "1.1.0",
@@ -40,7 +40,7 @@
     "@atlaskit/emoji": "^67.6.0",
     "@atlaskit/icon": "^22.0.0",
     "@atlaskit/link-datasource": "^1.19.0",
-    "@atlaskit/media-card": "^77.6.0",
+    "@atlaskit/media-card": "^77.7.0",
     "@atlaskit/media-client": "^26.1.0",
     "@atlaskit/media-client-react": "^2.0.0",
     "@atlaskit/media-common": "^11.0.0",