@atlaskit/renderer 109.2.7 → 109.3.1

package/dist/esm/react/nodes/blockCard.js

@@ -29,7 +29,8 @@ export default function BlockCard(props) {
     smartLinks = props.smartLinks,
     isNodeNested = props.isNodeNested;
   var _ref = smartLinks || {},
-    showServerActions = _ref.showServerActions;
+    showServerActions = _ref.showServerActions,
+    actionOptions = _ref.actionOptions;
   var onClick = getCardClickHandler(eventHandlers, url);
   var platform = useMemo(function () {
     return getPlatform(rendererAppearance);
@@ -39,7 +40,9 @@ export default function BlockCard(props) {
     data: data,
     onClick: onClick,
     container: portal,
-    isDatasource: !!props.datasource
+    isDatasource: !!props.datasource,
+    actionOptions: actionOptions,
+    showServerActions: showServerActions
   };
   var analyticsData = {
     attributes: {
@@ -116,9 +119,7 @@ export default function BlockCard(props) {
     unsupportedComponent: UnsupportedBlock
   }, cardProps), jsx(Card, _extends({
     appearance: "block",
-    showActions: rendererAppearance !== 'mobile',
-    platform: platform,
-    showServerActions: showServerActions
+    platform: platform
   }, cardProps, {
     onError: onError
   })))));

package/dist/esm/react/nodes/embedCard.js

@@ -30,6 +30,9 @@ export default function EmbedCard(props) {
     smartLinks = props.smartLinks;
   var embedIframeRef = useRef(null);
   var onClick = getCardClickHandler(eventHandlers, url);
+  var _ref = smartLinks || {},
+    showServerActions = _ref.showServerActions,
+    actionOptions = _ref.actionOptions;
   var platform = useMemo(function () {
     return getPlatform(rendererAppearance);
   }, [rendererAppearance]);
@@ -39,8 +42,9 @@ export default function EmbedCard(props) {
     onClick: onClick,
     container: portal,
     platform: platform,
-    showActions: platform === 'web',
-    frameStyle: (_smartLinks$frameStyl = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.frameStyle) !== null && _smartLinks$frameStyl !== void 0 ? _smartLinks$frameStyl : getBooleanFF('platform.editor.show-embed-card-frame-renderer') ? 'show' : undefined
+    frameStyle: (_smartLinks$frameStyl = smartLinks === null || smartLinks === void 0 ? void 0 : smartLinks.frameStyle) !== null && _smartLinks$frameStyl !== void 0 ? _smartLinks$frameStyl : getBooleanFF('platform.editor.show-embed-card-frame-renderer') ? 'show' : undefined,
+    actionOptions: actionOptions,
+    showServerActions: showServerActions
   };
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
@@ -80,8 +84,8 @@ export default function EmbedCard(props) {
     hasPreview = _useState6[0],
     setPreviewAvailableState = _useState6[1];
   var cardContext = useContext(SmartCardContext);
-  var onResolve = function onResolve(_ref) {
-    var resolvedAspectRatio = _ref.aspectRatio;
+  var onResolve = function onResolve(_ref2) {
+    var resolvedAspectRatio = _ref2.aspectRatio;
     var hasPreviewOnResolve = !!(cardContext && url && cardContext.extractors.getPreview(url, platform));
     if (!hasPreviewOnResolve) {
       setPreviewAvailableState(false);
@@ -97,8 +101,8 @@ export default function EmbedCard(props) {
   };
   return jsx(AnalyticsContext, {
     data: analyticsData
-  }, jsx(WidthConsumer, null, function (_ref2) {
-    var documentWidth = _ref2.width;
+  }, jsx(WidthConsumer, null, function (_ref3) {
+    var documentWidth = _ref3.width;
     var isFullWidth = rendererAppearance === 'full-width';
     var containerWidth = documentWidth;
     if (smartLinks !== null && smartLinks !== void 0 && smartLinks.ssr && !containerWidth) {
@@ -116,8 +120,8 @@ export default function EmbedCard(props) {
     }
     var lineLength = isFullWidth ? Math.min(akEditorFullWidthLayoutWidth, containerWidth - padding) : nonFullWidthSize;
     var uiMediaSingleStyles = layout === 'full-width' || layout === 'wide' ? uIMediaSingleLayoutStyles : '';
-    var onError = function onError(_ref3) {
-      var err = _ref3.err;
+    var onError = function onError(_ref4) {
+      var err = _ref4.err;
       if (err) {
         throw err;
       }

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

@@ -24,6 +24,7 @@ var InlineCard = function InlineCard(props) {
     showAuthTooltip = _ref.showAuthTooltip,
     hideHoverPreview = _ref.hideHoverPreview,
     showServerActions = _ref.showServerActions,
+    actionOptions = _ref.actionOptions,
     ssr = _ref.ssr;
   var analyticsData = {
     attributes: {
@@ -40,6 +41,7 @@ var InlineCard = function InlineCard(props) {
       url: url,
       showAuthTooltip: showAuthTooltip,
       showHoverPreview: !hideHoverPreview,
+      actionOptions: actionOptions,
       showServerActions: showServerActions,
       onClick: onClick
     }));
@@ -62,6 +64,7 @@ var InlineCard = function InlineCard(props) {
     appearance: "inline",
     showHoverPreview: !hideHoverPreview,
     showAuthTooltip: showAuthTooltip,
+    actionOptions: actionOptions,
     showServerActions: showServerActions
   }, cardProps, {
     onResolve: function onResolve(data) {

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

@@ -116,10 +116,7 @@ var MediaSingle = function MediaSingle(props) {
   var isFullWidth = rendererAppearance === 'full-width';
   var calcDimensions = function calcDimensions(mediaContainerWidth) {
     var containerWidth = getMediaContainerWidth(mediaContainerWidth, layout);
-    var isPixel = widthType === 'pixel';
-
-    // max width and height are already handled in mediaSingle
-    var maxWidth = isPixel && widthAttr ? widthAttr : containerWidth;
+    var maxWidth = containerWidth;
     var maxHeight = height / width * maxWidth;
     var cardDimensions = {
       width: "".concat(maxWidth, "px"),

package/dist/esm/react/nodes/multiBodiedExtension.js

@@ -9,7 +9,7 @@ var _templateObject, _templateObject2;
 import { jsx } from '@emotion/react';
 // eslint-disable-next-line @typescript-eslint/no-duplicate-imports
 import { css } from '@emotion/react';
-import { N40, N50 } from '@atlaskit/theme/colors';
+import { N30, N40 } from '@atlaskit/theme/colors';
 import React, { useState } from 'react';
 import { renderExtension } from './extension';
 import ExtensionRenderer from '../../ui/ExtensionRenderer';
@@ -43,7 +43,7 @@ var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActions(_re
   }, [updateActiveChild, children]);
   return actions;
 };
-var navigationCSS = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  // make sure the user can't see a range selection inside the navigation\n  // This is really important to keep the navigation working properly\n  user-select: none;\n  -webkit-user-modify: read-only;\n  border: 1px solid ", ";\n  background-color: ", ";\n\n  .mbe-add-tab-button,\n  .mbe-remove-tab {\n    display: none;\n  }\n"])), "var(--ds-border, ".concat(N40, ")"), "var(--ds-background-inverse-subtle, ".concat(N50, ")"));
+var navigationCSS = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  // make sure the user can't see a range selection inside the navigation\n  // This is really important to keep the navigation working properly\n  user-select: none;\n  -webkit-user-modify: read-only;\n  border: 1px solid ", ";\n  border-bottom: none;\n  .mbe-add-tab-button,\n  .mbe-remove-tab {\n    display: none;\n  }\n"])), "var(--ds-border, ".concat(N40, ")"));
 var MultiBodiedExtension = function MultiBodiedExtension(props) {
   var children = props.children,
     _props$layout = props.layout,
@@ -67,7 +67,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
     updateActiveChild: updateActiveChild,
     children: children
   });
-  var containerCSS = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    min-height: 100px;\n\n    .multiBodiedExtension--frames > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension--frames\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      border: 1px solid ", ";\n      display: block;\n      min-height: 100px;\n    }\n  "])), activeChildIndex + 1, "var(--ds-border, ".concat(N50, ")"));
+  var containerCSS = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding: 0;\n    border-radius: ", ";\n    position: relative;\n    vertical-align: middle;\n    min-height: 100px;\n    .ak-renderer-extension {\n      margin-top: 0 !important;\n    }\n\n    .multiBodiedExtension--frames > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension--frames\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      padding: ", " !important;\n      border: 1px solid ", ";\n      display: block;\n      min-height: 100px;\n      background: ", ";\n      padding-left: ", ";\n      padding-right: ", ";\n\n      .bodiedExtensionView-content-wrap {\n        margin-top: ", " !important;\n      }\n      .extensionView-content-wrap {\n        margin-top: ", " !important;\n      }\n    }\n  "])), "var(--ds-border-radius, 3px)", activeChildIndex + 1, "var(--ds-space-100, 8px)", "var(--ds-border, ".concat(N30, ")"), "var(--ds-surface, white)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)");
   var isTopLevel = path.length < 1;
   var centerAlignClass = isTopLevel && ['wide', 'full-width'].includes(layout) ? RendererCssClassName.EXTENSION_CENTER_ALIGN : '';
   function renderMbeContent(width) {

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

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import { isHex, isRgb, rgbToHex, tableBackgroundColorPalette, getDarkModeLCHColor } from '@atlaskit/adf-schema';
+import { tableBackgroundColorPalette, getDarkModeLCHColor } from '@atlaskit/adf-schema';
 import { useThemeObserver } from '@atlaskit/tokens';
 import { SortOrder } from '@atlaskit/editor-common/types';
 import { hexToEditorBackgroundPaletteRawValue } from '@atlaskit/editor-palette';
@@ -10,7 +10,6 @@ import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/anal
 import { RendererCssClassName } from '../../consts';
 import { useIntl } from 'react-intl-next';
 import { tableCellMessages } from '../../messages';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 var IgnoreSorting = ['LABEL', 'INPUT'];
 var nextStatusOrder = function nextStatusOrder(currentSortOrder) {
   switch (currentSortOrder) {
@@ -62,38 +61,6 @@ var getDataAttributes = function getDataAttributes(colwidth, background) {
   }
   return attrs;
 };
-
-/**
- * This function is duplicated in
- * - @atlaskit/adf-schema
- * - ../marks/textColor.tsx
- * it takes a color string, and if the color string is a hex or rgb value
- * it will invert the color and return the inverted color.
- */
-function invertCustomColor(customColor) {
-  var hex;
-  if (isHex(customColor)) {
-    hex = customColor;
-  } else if (isRgb(customColor)) {
-    hex = rgbToHex(customColor);
-    if (hex === null) {
-      // in some cases the rgb color is invalid, in this case we just return the color
-      // See https://product-fabric.atlassian.net/browse/DTR-2003 for a ticket to improve the isRgb function
-      // to align with the rgbToHex function
-      return customColor;
-    }
-  } else {
-    return customColor;
-  }
-  var hexWithoutHash = hex.replace('#', '');
-
-  // This inverts the hex color by
-  // 1. converting the hex code to a number
-  // 2. XORing it with 0xffffff
-  // 3. Converting the result back to hex
-  // 4. Removing the leading 1 from the result
-  return "#".concat((Number("0x1".concat(hexWithoutHash)) ^ 0xffffff).toString(16).substring(1).toUpperCase());
-}
 var getStyle = function getStyle(_ref) {
   var background = _ref.background,
     colGroupWidth = _ref.colGroupWidth,
@@ -127,12 +94,7 @@ var getStyle = function getStyle(_ref) {
       // if we have a custom color, we need to check if we are in dark mode
       if (colorMode === 'dark') {
         // if we are in dark mode, we need to invert the color
-        // and if the feature flag is enabled we need to use the LCH conversion method
-        if (getBooleanFF('platform.editor.use-lch-for-color-inversion_1qv8ol')) {
-          style.backgroundColor = getDarkModeLCHColor(background);
-        } else {
-          style.backgroundColor = invertCustomColor(background);
-        }
+        style.backgroundColor = getDarkModeLCHColor(background);
       } else {
         // if we are in light mode, we can just set the color
         style.backgroundColor = background;

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.7";
+var packageVersion = "109.3.1";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/types/types/smartLinksOptions.d.ts

@@ -3,6 +3,12 @@ export interface SmartLinksOptions {
     ssr?: boolean;
     showAuthTooltip?: boolean;
     hideHoverPreview?: boolean;
+    /**
+     * @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-6348 Internal documentation for deprecation (no external access)}
+     *
+     * Prefer `actionOptions` prop.
+     */
     showServerActions?: boolean;
+    actionOptions?: CardProps['actionOptions'];
     frameStyle?: CardProps['frameStyle'];
 }

package/dist/types-ts4.5/types/smartLinksOptions.d.ts

@@ -3,6 +3,12 @@ export interface SmartLinksOptions {
     ssr?: boolean;
     showAuthTooltip?: boolean;
     hideHoverPreview?: boolean;
+    /**
+     * @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-6348 Internal documentation for deprecation (no external access)}
+     *
+     * Prefer `actionOptions` prop.
+     */
     showServerActions?: boolean;
+    actionOptions?: CardProps['actionOptions'];
     frameStyle?: CardProps['frameStyle'];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "109.2.7",
+  "version": "109.3.1",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,21 +25,21 @@
     "runReact18": false
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^35.3.0",
+    "@atlaskit/adf-schema": "^35.5.1",
     "@atlaskit/adf-utils": "^19.0.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/button": "^17.3.0",
     "@atlaskit/code": "^15.1.0",
-    "@atlaskit/editor-common": "^77.0.0",
+    "@atlaskit/editor-common": "^77.2.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-palette": "1.5.2",
     "@atlaskit/editor-prosemirror": "1.1.0",
     "@atlaskit/editor-shared-styles": "^2.9.0",
     "@atlaskit/emoji": "^67.6.0",
     "@atlaskit/icon": "^22.0.0",
-    "@atlaskit/link-datasource": "^1.19.0",
+    "@atlaskit/link-datasource": "^1.22.0",
     "@atlaskit/media-card": "^77.7.0",
     "@atlaskit/media-client": "^26.1.0",
     "@atlaskit/media-client-react": "^2.0.0",
@@ -48,11 +48,11 @@
     "@atlaskit/media-ui": "^25.0.0",
     "@atlaskit/media-viewer": "^48.2.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/smart-card": "^26.45.0",
+    "@atlaskit/smart-card": "^26.46.0",
     "@atlaskit/status": "^1.4.0",
     "@atlaskit/task-decision": "^17.9.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.34.0",
+    "@atlaskit/tokens": "^1.35.0",
     "@atlaskit/tooltip": "^18.1.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
@@ -63,7 +63,7 @@
     "uuid": "^3.1.0"
   },
   "peerDependencies": {
-    "@atlaskit/link-provider": "^1.6.2",
+    "@atlaskit/link-provider": "^1.7.0",
     "@atlaskit/media-core": "^34.1.2",
     "react": "^16.8.0",
     "react-dom": "^16.8.0"
@@ -73,7 +73,7 @@
     "@af/visual-regression": "*",
     "@atlaskit/analytics-gas-types": "^5.1.0",
     "@atlaskit/css-reset": "^6.6.0",
-    "@atlaskit/link-provider": "^1.6.0",
+    "@atlaskit/link-provider": "^1.7.0",
     "@atlaskit/link-test-helpers": "^6.2.0",
     "@atlaskit/media-core": "^34.1.0",
     "@atlaskit/media-integration-test-helpers": "^3.0.0",
@@ -126,9 +126,6 @@
       "type": "boolean",
       "referenceOnly": "true"
     },
-    "platform.editor.use-lch-for-color-inversion_1qv8ol": {
-      "type": "boolean"
-    },
     "platform.editor.show-embed-card-frame-renderer": {
       "type": "boolean"
     }