@atlaskit/renderer 85.0.0 → 89.0.0

package/CHANGELOG.md

@@ -1,5 +1,88 @@
 # @atlaskit/renderer
 
+## 89.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
+## 88.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
+## 87.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
+## 86.0.0
+
+### Major Changes
+
+- [`304351e4b1e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/304351e4b1e) - CETI-241 - Added additional panel ADF attributes (panelIconId, panelIconText) to uniquely identify custom panel emojis. The change has been categorised as major since it is a change to the full-schema ADF. However, the custom panel feature is behind a feature flag, has not yet been released to production, and is only currently planned for release to Confluence. See ADF change #61 for further details.
+- [`9d1e0356622`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d1e0356622) - [ux] CETI-166 Increase the standard panel icons size to make it consistent with the emojis in the panel content area
+
+### Minor Changes
+
+- [`de207a6b8e0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/de207a6b8e0) - Fixed a bug in SSR where media components would resize due to MutationObserver not receiving all children in initial call.
+- [`49878ec3af4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/49878ec3af4) - Add `smartLinks` prop to React Renderer component
+
+  ```
+  interface SmartLinksOptions {
+    ssr?: boolean;
+  }
+  ```
+
+  It contains a `ssr` field which when set to true will enable SSR support for smart links nodes
+
+  ```
+  <Renderer
+    smartLinks={{
+      ssr: true
+    }}
+  >
+  ```
+
+- [`9c9557fcdd8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9c9557fcdd8) - AK-279 Moved copy button outside of heading, that made heading accessible
+- [`bd283364aad`](https://bitbucket.org/atlassian/atlassian-frontend/commits/bd283364aad) - Fixed a bug for SSR where some media components would be rendered in the incorrect size resulting in jumping components during hydration.
+
+### Patch Changes
+
+- [`439cf07029a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/439cf07029a) - ED-13881 Move @atlaskit/adf-schema test helpers to @atlaskit/editor-test-helpers
+
+  A new entry point for @atlaskit/editor-test-helpers/adf-schema has been
+  introduced. All test helpers that previously lived under @atlaskit/adf-schema
+  have been moved there instead.
+
+  Imports inside @atlaskit/adf-schema that previously relied on relative paths, or
+  imports from other packages that referred to @atlaskit/adf-schema/test-helpers,
+  should be updated to reference @atlaskit/editor-test-helpers/adf-schema instead.
+
+  Old usages:
+
+  ```
+  import { schema } from '../relative/path/to/test-helpers';
+  import { schema } from '@atlaskit/adf-schema/test-helpers';
+  ```
+
+  New usage:
+
+  ```
+  import { schema } from '@atlaskit/editor-test-helpers/adf-schema';
+  ```
+
+- [`5293a48368e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5293a48368e) - fix image size in layout with ref and width observer
+- [`85bffe0fecb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/85bffe0fecb) - Removed portal prop from Mention node
+- [`85c4e5a71ee`](https://bitbucket.org/atlassian/atlassian-frontend/commits/85c4e5a71ee) - [AK-837] added role prop for Status component
+- [`57f3b255fb2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/57f3b255fb2) - [ux] AK-608: Action items are keyboard accessible
+- [`3b49ff824ec`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3b49ff824ec) - ED-14043 update prosemirror schema to only allow link mark on children of paragraph and mediaSingle
+- [`16294b02fd4`](https://bitbucket.org/atlassian/atlassian-frontend/commits/16294b02fd4) - CETI-242 Change the Color palette labels for panel
+- [`a36d06dee66`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a36d06dee66) - [ux] Added intl tooling to all strings that were previously not using intl tooling. Should mean that more things are able to be translated. Also fixed the relevent tests to account for intl tooling.
+- Updated dependencies
+
 ## 85.0.0
 
 ### Major Changes

package/dist/cjs/analytics/enums.js

@@ -39,6 +39,7 @@ exports.ACTION = 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 || (exports.ACTION = ACTION = {}));
 
 var ACTION_SUBJECT;

package/dist/cjs/messages.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.headingAnchorLinkMessages = exports.codeBlockCopyButtonMessages = void 0;
+exports.tableCellMessages = exports.sortingIconMessages = exports.headingAnchorLinkMessages = exports.codeBlockCopyButtonMessages = void 0;
 
 var _reactIntlNext = require("react-intl-next");
 
@@ -22,9 +22,55 @@ var headingAnchorLinkMessages = (0, _reactIntlNext.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'
   }
 });
 exports.headingAnchorLinkMessages = headingAnchorLinkMessages;
+var tableCellMessages = (0, _reactIntlNext.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'
+  }
+});
+exports.tableCellMessages = tableCellMessages;
+var sortingIconMessages = (0, _reactIntlNext.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: "\u26A0\uFE0F  You can't sort a table with merged cell",
+    description: 'this sort is invalid for merged cells'
+  }
+});
+exports.sortingIconMessages = sortingIconMessages;
 var codeBlockCopyButtonMessages = (0, _reactIntlNext.defineMessages)({
   copyCodeToClipboard: {
     id: 'fabric.editor.codeBlockCopyButton.copyToClipboard',

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

@@ -0,0 +1,94 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useObservedWidth = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireDefault(require("react"));
+
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+var resizeObserver;
+var nodeToCallback = new WeakMap();
+
+var useObservedWidth = function useObservedWidth(node, useObservedWidthFlag) {
+  var _React$useState = _react.default.useState({
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0
+  }),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      rect = _React$useState2[0],
+      setRect = _React$useState2[1];
+
+  _react.default.useEffect(function () {
+    if (!node || !useObservedWidthFlag) {
+      return;
+    }
+
+    if (!resizeObserver) {
+      resizeObserver = new ResizeObserver(function (entries) {
+        var _iterator = _createForOfIteratorHelper(entries),
+            _step;
+
+        try {
+          for (_iterator.s(); !(_step = _iterator.n()).done;) {
+            var entry = _step.value;
+
+            if (nodeToCallback.has(entry.target)) {
+              nodeToCallback.get(entry.target)(entry.contentRect);
+            }
+          }
+        } catch (err) {
+          _iterator.e(err);
+        } finally {
+          _iterator.f();
+        }
+      });
+    }
+
+    nodeToCallback.set(node, function (rect) {
+      var x = rect.x,
+          y = rect.y,
+          width = rect.width,
+          height = rect.height,
+          top = rect.top,
+          left = rect.left,
+          bottom = rect.bottom,
+          right = rect.right;
+      return setRect({
+        x: x,
+        y: y,
+        width: width,
+        height: height,
+        top: top,
+        left: left,
+        bottom: bottom,
+        right: right
+      });
+    });
+    resizeObserver.observe(node);
+    return function () {
+      resizeObserver.unobserve(node);
+      nodeToCallback.delete(node);
+    };
+  }, [node, useObservedWidthFlag]);
+
+  return rect;
+};
+
+exports.useObservedWidth = useObservedWidth;

package/dist/cjs/react/index.js

@@ -204,6 +204,7 @@ var ReactSerializer = /*#__PURE__*/function () {
     this.allowAnnotations = Boolean(init.allowAnnotations);
     this.surroundTextNodesWithTextWrapper = Boolean(init.surroundTextNodesWithTextWrapper);
     this.media = init.media;
+    this.smartLinks = init.smartLinks;
     this.allowSelectAllTrap = init.allowSelectAllTrap;
   }
 
@@ -568,6 +569,7 @@ var ReactSerializer = /*#__PURE__*/function () {
         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/cjs/react/nodes/copy-text-provider.js

@@ -114,7 +114,8 @@ exports.CopyTextConsumer = Consumer;
 
 var CopyArea = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
-    ref: ref,
+    ref: ref // eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
+    ,
     style: {
       position: 'absolute',
       left: '-9999px',

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

@@ -90,10 +90,15 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
       var isClicked = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
 
       _this.setState({
+        // TODO: ED-14403 investigate why this does not translate
         tooltipMessage: _this.props.intl.formatMessage(message),
         isClicked: isClicked
       });
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getCopyAriaLabel", function () {
+      var copyAriaLabel = _messages.headingAnchorLinkMessages.copyAriaLabel;
+      return _this.props.intl.formatMessage(copyAriaLabel);
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "copyToClipboard", /*#__PURE__*/function () {
       var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(event) {
         var copiedHeadingLinkToClipboard, failedToCopyHeadingLink;
@@ -137,9 +142,10 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderAnchorButton", function () {
       return /*#__PURE__*/_react.default.createElement(CopyAnchorButton, {
         onMouseLeave: _this.resetMessage,
-        onClick: _this.copyToClipboard
+        onClick: _this.copyToClipboard,
+        "aria-label": _this.state.tooltipMessage
       }, /*#__PURE__*/_react.default.createElement(_link.default, {
-        label: "copy",
+        label: _this.getCopyAriaLabel(),
         size: _this.props.level > 3 ? 'small' : 'medium',
         primaryColor: _this.state.isClicked ? _colors.B400 : _colors.N200
       }));

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

@@ -13,6 +13,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _smartCard = require("@atlaskit/smart-card");
 
+var _ssr = require("@atlaskit/smart-card/ssr");
+
 var _ui = require("@atlaskit/editor-common/ui");
 
 var _fallback = require("./fallback");
@@ -25,7 +27,8 @@ var InlineCard = function InlineCard(props) {
   var url = props.url,
       data = props.data,
       eventHandlers = props.eventHandlers,
-      portal = props.portal;
+      portal = props.portal,
+      smartLinks = props.smartLinks;
   var onClick = (0, _getCardClickHandler.getCardClickHandler)(eventHandlers, url);
   var cardProps = {
     url: url,
@@ -33,6 +36,14 @@ var InlineCard = function InlineCard(props) {
     onClick: onClick,
     container: portal
   };
+
+  if (smartLinks !== null && smartLinks !== void 0 && smartLinks.ssr && url) {
+    return /*#__PURE__*/_react.default.createElement(_ssr.CardSSR, {
+      appearance: "inline",
+      url: url
+    });
+  }
+
   return /*#__PURE__*/_react.default.createElement("span", {
     "data-inline-card": true,
     "data-card-data": data ? JSON.stringify(data) : undefined,