@atlaskit/renderer 109.19.4 → 109.20.0

package/dist/esm/ui/Expand.js

@@ -3,7 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 import _extends from "@babel/runtime/helpers/extends";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _excluded = ["expanded"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3;
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import React, { useCallback, useMemo, useRef } from 'react';
@@ -19,39 +19,65 @@ 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 titleStyles = css({
+  outline: 'none',
+  border: 'none',
+  fontSize: relativeFontSizeToBase16(fontSize()),
+  lineHeight: akEditorLineHeight,
+  fontWeight: 'normal',
+  display: 'flex',
+  flex: 1,
+  margin: 0,
+  padding: "0 0 0 ".concat("var(--ds-space-050, 4px)"),
+  textAlign: 'left'
+});
 var Container = function Container(props) {
   var paddingBottom = props.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)";
   var sharedContainerStyles = sharedExpandStyles.containerStyles(props);
+
+  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
   var styles = function styles() {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    ", "\n    padding: 0;\n    padding-bottom: ", ";\n  "])), sharedContainerStyles(), paddingBottom);
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    ", "\n    padding: 0;\n    padding-bottom: ", ";\n  "])), sharedContainerStyles(), paddingBottom);
   };
-  return jsx("div", _extends({
-    css: styles
-  }, props), props.children);
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    jsx("div", _extends({
+      css: styles
+    }, props), props.children)
+  );
 };
 var TitleContainer = function TitleContainer(props) {
   var paddingBottom = !props.expanded ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)";
+
+  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
   var styles = function styles() {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    ", "\n    padding: ", ";\n    padding-bottom: ", ";\n  "])), sharedExpandStyles.titleContainerStyles(), "var(--ds-space-100, 8px)", paddingBottom);
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    ", "\n    padding: ", ";\n    padding-bottom: ", ";\n  "])), sharedExpandStyles.titleContainerStyles(), "var(--ds-space-100, 8px)", paddingBottom);
   };
   var expanded = props.expanded,
     buttonProps = _objectWithoutProperties(props, _excluded);
-  return jsx("button", _extends({
-    type: "button",
-    css: styles
-  }, buttonProps), props.children);
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    jsx("button", _extends({
+      type: "button",
+      css: styles
+    }, buttonProps), props.children)
+  );
 };
 TitleContainer.displayName = 'TitleContainerButton';
 var ContentContainer = function ContentContainer(props) {
   var sharedContentStyles = sharedExpandStyles.contentStyles(props);
   var visibility = props.expanded ? 'visible' : 'hidden';
+
+  // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression  -- needs manual remediation
   var styles = function styles() {
-    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 css(_templateObject3 || (_templateObject3 = _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
-  }, props), props.children);
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    jsx("div", _extends({
+      css: styles
+    }, props), props.children)
+  );
 };
 function fireExpandToggleAnalytics(nodeType, expanded, fireAnalyticsEvent) {
   if (!fireAnalyticsEvent) {

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

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

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

@@ -1,5 +1,6 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation */
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 
 import { css } from '@emotion/react';
@@ -25,7 +26,7 @@ var telepointerStyles = function telepointerStyles() {
   var _getGlobalTheme = getGlobalTheme(),
     colorMode = _getGlobalTheme.colorMode;
 
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    #", " {\n      display: inline-block;\n      position: relative;\n      width: 1.5px;\n      height: 25px;\n      background: linear-gradient(\n        45deg,\n        ", " -12.02%,\n        ", " 19.18%,\n        ", " 71.87%\n      );\n      margin-left: ", ";\n\n      &::after {\n        content: 'AI';\n        position: absolute;\n        display: block;\n        top: 0;\n        left: 0;\n        font-size: 10px;\n        font-weight: 700;\n        width: 12.5px;\n        height: 13px;\n        padding-top: 1px;\n        padding-left: 1.5px;\n        line-height: initial;\n        border-radius: 0px 2px 2px 0px;\n        color: ", ";\n        background: linear-gradient(\n          45deg,\n          ", " -57%,\n          ", " 71.87%\n        );\n      }\n    }\n  "])), TELEPOINTER_ID, colorMode === 'dark' ? '#f5cd47' : '#f8e6a0', colorMode === 'dark' ? '#60c6d2' : '#8bdbe5', colorMode === 'dark' ? '#388bff' : '#0c66e4', "var(--ds-space-025, 2px)", "var(--ds-text-inverse, white)", colorMode === 'dark' ? '#60c6d2' : '#8bdbe5', colorMode === 'dark' ? '#388bff' : '#0c66e4');
 };
 var getLineHeight = function getLineHeight(fontCode) {

package/dist/esm/ui/Renderer/truncated-wrapper.js

@@ -3,15 +3,26 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import { Component } from 'react';
 var fadeOutStyles = function fadeOutStyles(maxHeight, top, backgroundColor) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  overflow-y: hidden;\n  max-height: ", "px;\n  &::after {\n    content: '';\n    position: absolute;\n    top: ", "px;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    background-image: linear-gradient(\n      ", ",\n      ", "\n    );\n  }\n"])), maxHeight, top, "var(--ds-background-neutral-subtle, rgba(255, 255, 255, 0))", backgroundColor);
+  return css({
+    position: 'relative',
+    overflowY: 'hidden',
+    maxHeight: "".concat(maxHeight, "px"),
+    '&::after': {
+      content: "''",
+      position: 'absolute',
+      top: "".concat(top, "px"),
+      bottom: 0,
+      left: 0,
+      right: 0,
+      backgroundImage: "linear-gradient( ".concat("var(--ds-background-neutral-subtle, rgba(255, 255, 255, 0))", ", ", backgroundColor, " )")
+    }
+  });
 };
 var FadeOut = function FadeOut(props) {
   var children = props.children,
@@ -20,6 +31,7 @@ var FadeOut = function FadeOut(props) {
     height = props.height;
   var top = height - fadeHeight;
   var styles = fadeOutStyles(height, top, backgroundColor);
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
   return jsx("div", {
     css: styles
   }, children);

package/dist/esm/ui/SortingIcon.js

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject, _templateObject2;
 /** @jsx jsx */
 import { css, jsx } from '@emotion/react';
 import Tooltip from '@atlaskit/tooltip';
@@ -15,13 +15,36 @@ export var StatusClassNames = /*#__PURE__*/function (StatusClassNames) {
   StatusClassNames["SORTING_NOT_ALLOWED"] = "sorting-icon-svg__not-allowed";
   return StatusClassNames;
 }({});
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
 var buttonStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  height: 28px;\n  width: 28px;\n  margin: ", ";\n  right: 0;\n  top: 0;\n  border: 2px solid ", ";\n  border-radius: ", ";\n  background-color: ", ";\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &.", "__not-allowed {\n    cursor: not-allowed;\n  }\n"])), "var(--ds-space-075, 6px)", "var(--ds-border, #fff)", "var(--ds-border-radius-100, 4px)", "var(--ds-surface-overlay, ".concat(N20, ")"), "var(--ds-surface-overlay-hovered, ".concat(N30, ")"), "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))", RendererCssClassName.SORTABLE_COLUMN_ICON);
+
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
 var iconWrapperStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 8px;\n  height: 12px;\n  transition: transform 0.3s cubic-bezier(0.15, 1, 0.3, 1);\n  transform-origin: 50% 50%;\n  display: flex;\n  justify-content: center;\n\n  &.", " {\n    transform: rotate(-180deg);\n  }\n\n  &.", "-inactive {\n    opacity: 0.7;\n  }\n"])), StatusClassNames.DESC, RendererCssClassName.SORTABLE_COLUMN_ICON);
 
 // The icon is created with CSS due to the following Firefox issue: https://product-fabric.atlassian.net/browse/ED-8001
 // The TL;DR is that svg's in tables mess up how HTML is copied in Firefox. Using a styled div instead solves the problem.
 // For this reason, svg's should be avoided in tables until this issue is fixed: https://bugzilla.mozilla.org/show_bug.cgi?id=1664350
-var iconStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 100%;\n  width: 2px;\n  border-radius: 50px;\n  background: ", ";\n\n  &::before,\n  &::after {\n    background: ", ";\n    content: '';\n    height: 2px;\n    width: 6px;\n    position: absolute;\n    border-radius: 50px;\n  }\n\n  &::before {\n    transform: rotate(45deg) translate(3.4px, 8.5px);\n  }\n\n  &::after {\n    transform: rotate(-45deg) translate(-6.3px, 5.7px);\n  }\n"])), "var(--ds-icon, #42526E)", "var(--ds-icon, #42526E)");
+var iconStyles = css({
+  height: '100%',
+  width: '2px',
+  borderRadius: '50px',
+  background: "var(--ds-icon, #42526E)",
+  '&::before, &::after': {
+    background: "var(--ds-icon, #42526E)",
+    content: "''",
+    height: '2px',
+    width: '6px',
+    position: 'absolute',
+    borderRadius: '50px'
+  },
+  '&::before': {
+    transform: 'rotate(45deg) translate(3.4px, 8.5px)'
+  },
+  '&::after': {
+    transform: 'rotate(-45deg) translate(-6.3px, 5.7px)'
+  }
+});
 var getIconClassName = function getIconClassName(isSortingAllowed, sortOrdered) {
   var activated = sortOrdered !== SortOrder.NO_ORDER;
   var activeStatusClass = "".concat(RendererCssClassName.SORTABLE_COLUMN_ICON, "-").concat(activated ? 'active' : 'inactive');

package/dist/types/react/marks/alignment.d.ts

@@ -1,4 +1,4 @@
 import { jsx } from '@emotion/react';
-import { AlignmentAttributes } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { AlignmentAttributes } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 export default function Alignment(props: MarkProps<AlignmentAttributes>): jsx.JSX.Element;

package/dist/types/react/marks/breakout.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
-import { BreakoutMarkAttrs } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { BreakoutMarkAttrs } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 export declare const wrapperStyles: import("@emotion/react").SerializedStyles;
 export default function Breakout(props: MarkProps<BreakoutMarkAttrs>): jsx.JSX.Element;

package/dist/types/react/marks/link.d.ts

@@ -1,6 +1,6 @@
 import { jsx } from '@emotion/react';
-import { LinkAttributes } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { LinkAttributes } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 interface LinkProps extends LinkAttributes {
     target?: string;
     isMediaLink?: boolean;

package/dist/types-ts4.5/react/marks/alignment.d.ts

@@ -1,4 +1,4 @@
 import { jsx } from '@emotion/react';
-import { AlignmentAttributes } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { AlignmentAttributes } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 export default function Alignment(props: MarkProps<AlignmentAttributes>): jsx.JSX.Element;

package/dist/types-ts4.5/react/marks/breakout.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
-import { BreakoutMarkAttrs } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { BreakoutMarkAttrs } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 export declare const wrapperStyles: import("@emotion/react").SerializedStyles;
 export default function Breakout(props: MarkProps<BreakoutMarkAttrs>): jsx.JSX.Element;

package/dist/types-ts4.5/react/marks/link.d.ts

@@ -1,6 +1,6 @@
 import { jsx } from '@emotion/react';
-import { LinkAttributes } from '@atlaskit/adf-schema';
-import { MarkProps } from '../types';
+import type { LinkAttributes } from '@atlaskit/adf-schema';
+import type { MarkProps } from '../types';
 interface LinkProps extends LinkAttributes {
     target?: string;
     isMediaLink?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "109.19.4",
+  "version": "109.20.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -24,30 +24,30 @@
     "runReact18": true
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^35.9.0",
+    "@atlaskit/adf-schema": "^35.9.2",
     "@atlaskit/adf-utils": "^19.0.0",
     "@atlaskit/analytics-listeners": "^8.9.0",
     "@atlaskit/analytics-namespaced-context": "^6.9.0",
-    "@atlaskit/analytics-next": "^9.2.0",
-    "@atlaskit/button": "^17.12.0",
+    "@atlaskit/analytics-next": "^9.3.0",
+    "@atlaskit/button": "^17.14.0",
     "@atlaskit/code": "^15.1.0",
-    "@atlaskit/editor-common": "^78.30.0",
-    "@atlaskit/editor-json-transformer": "^8.10.0",
+    "@atlaskit/editor-common": "^78.31.0",
+    "@atlaskit/editor-json-transformer": "^8.11.0",
     "@atlaskit/editor-palette": "1.5.3",
-    "@atlaskit/editor-prosemirror": "3.0.0",
+    "@atlaskit/editor-prosemirror": "4.0.0",
     "@atlaskit/editor-shared-styles": "^2.9.0",
     "@atlaskit/emoji": "^67.6.0",
     "@atlaskit/icon": "^22.1.0",
-    "@atlaskit/link-datasource": "^1.28.0",
+    "@atlaskit/link-datasource": "^1.29.0",
     "@atlaskit/media-card": "^77.11.0",
     "@atlaskit/media-client": "^26.3.0",
     "@atlaskit/media-client-react": "^2.0.0",
     "@atlaskit/media-common": "^11.1.0",
     "@atlaskit/media-filmstrip": "^47.0.0",
-    "@atlaskit/media-ui": "^25.8.0",
+    "@atlaskit/media-ui": "^25.9.0",
     "@atlaskit/media-viewer": "^48.4.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/smart-card": "^26.56.0",
+    "@atlaskit/smart-card": "^26.57.0",
     "@atlaskit/status": "^1.4.0",
     "@atlaskit/task-decision": "^17.9.0",
     "@atlaskit/theme": "^12.7.0",
@@ -72,7 +72,7 @@
     "@af/visual-regression": "*",
     "@atlaskit/analytics-gas-types": "^5.1.0",
     "@atlaskit/css-reset": "^6.9.0",
-    "@atlaskit/editor-test-helpers": "^18.20.0",
+    "@atlaskit/editor-test-helpers": "^18.21.0",
     "@atlaskit/link-provider": "^1.9.0",
     "@atlaskit/link-test-helpers": "^7.0.0",
     "@atlaskit/linking-common": "^5.6.0",
@@ -119,6 +119,9 @@
     }
   },
   "platform-feature-flags": {
+    "platform.editor.renderer-inline-card-ssr-fix_kqcwl": {
+      "type": "boolean"
+    },
     "platform.media-experience.media-viewer-v2_hgsii": {
       "type": "boolean",
       "referenceOnly": "true"