@atlaskit/editor-common 76.25.4 → 76.26.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/editor-common
 
+## 76.26.0
+
+### Minor Changes
+
+- [#59421](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/59421) [`3747754f8ab0`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3747754f8ab0) - NO-ISSUE Added the capability to directly trigger an analytics event as an action to the editor analytics plugin
+
+### Patch Changes
+
+- [#59245](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/59245) [`0faff8fd352b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0faff8fd352b) - ED-20980 implemented default size for inline images.
+
+## 76.25.5
+
+### Patch Changes
+
+- [#57192](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/57192) [`cb7776f514cb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cb7776f514cb) - Fix issue like table and assets editor plugin card not translated issue
+
 ## 76.25.4
 
 ### Patch Changes

package/dist/cjs/media-inline/constants.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DEFAULT_IMAGE_WIDTH = exports.DEFAULT_IMAGE_HEIGHT = void 0;
+exports.DEFAULT_INLINE_IMAGE_ASPECT_RATIO = exports.DEFAULT_IMAGE_WIDTH = exports.DEFAULT_IMAGE_HEIGHT = void 0;
 var DEFAULT_IMAGE_WIDTH = exports.DEFAULT_IMAGE_WIDTH = 250;
-var DEFAULT_IMAGE_HEIGHT = exports.DEFAULT_IMAGE_HEIGHT = 200;
+var DEFAULT_IMAGE_HEIGHT = exports.DEFAULT_IMAGE_HEIGHT = 200;
+var DEFAULT_INLINE_IMAGE_ASPECT_RATIO = exports.DEFAULT_INLINE_IMAGE_ASPECT_RATIO = DEFAULT_IMAGE_WIDTH / DEFAULT_IMAGE_HEIGHT;

package/dist/cjs/media-inline/index.js

@@ -15,6 +15,18 @@ Object.defineProperty(exports, "DEFAULT_IMAGE_WIDTH", {
     return _constants.DEFAULT_IMAGE_WIDTH;
   }
 });
+Object.defineProperty(exports, "DEFAULT_INLINE_IMAGE_ASPECT_RATIO", {
+  enumerable: true,
+  get: function get() {
+    return _constants.DEFAULT_INLINE_IMAGE_ASPECT_RATIO;
+  }
+});
+Object.defineProperty(exports, "INLINE_IMAGE_WRAPPER_CLASS_NAME", {
+  enumerable: true,
+  get: function get() {
+    return _styles.INLINE_IMAGE_WRAPPER_CLASS_NAME;
+  }
+});
 Object.defineProperty(exports, "InlineImageWrapper", {
   enumerable: true,
   get: function get() {
@@ -27,6 +39,12 @@ Object.defineProperty(exports, "MediaInlineImageCard", {
     return _mediaInlineImageCard.MediaInlineImageCard;
   }
 });
+Object.defineProperty(exports, "mediaInlineImageStyles", {
+  enumerable: true,
+  get: function get() {
+    return _styles.mediaInlineImageStyles;
+  }
+});
 Object.defineProperty(exports, "shouldShowInlineImage", {
   enumerable: true,
   get: function get() {
@@ -36,4 +54,5 @@ Object.defineProperty(exports, "shouldShowInlineImage", {
 var _mediaInlineImageCard = require("./media-inline-image-card");
 var _utils = require("./utils");
 var _inlineImageWrapper = require("./inline-image-wrapper");
-var _constants = require("./constants");
+var _constants = require("./constants");
+var _styles = require("./styles");

package/dist/cjs/media-inline/inline-image-wrapper.js

@@ -1,17 +1,23 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InlineImageWrapper = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
+var _constants = require("./constants");
+var _styles = require("./styles");
 /** @jsx jsx */
 
 var wrapperStyle = (0, _react.css)({
   display: 'inline-block',
   verticalAlign: 'text-bottom',
-  borderRadius: "var(--ds-border-radius, 3px)"
+  overflow: 'hidden',
+  borderRadius: "var(--ds-border-radius, 3px)",
+  aspectRatio: "var(".concat(_styles.INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, ", ").concat(_constants.DEFAULT_INLINE_IMAGE_ASPECT_RATIO, ")")
 });
 var selectedStyle = (0, _react.css)({
   cursor: 'pointer',
@@ -21,8 +27,16 @@ var selectedStyle = (0, _react.css)({
 });
 var InlineImageWrapper = exports.InlineImageWrapper = function InlineImageWrapper(_ref) {
   var children = _ref.children,
-    isSelected = _ref.isSelected;
-  return (0, _react.jsx)("span", {
-    css: [wrapperStyle, isSelected && selectedStyle]
-  }, children);
+    isSelected = _ref.isSelected,
+    aspectRatio = _ref.aspectRatio;
+  var style = aspectRatio ? (0, _defineProperty2.default)({}, _styles.INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, aspectRatio) : {};
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/prefer-primitives
+    (0, _react.jsx)("span", {
+      style: style,
+      className: _styles.INLINE_IMAGE_WRAPPER_CLASS_NAME,
+      css: [wrapperStyle, isSelected && selectedStyle],
+      "data-testid": "inline-image-wrapper"
+    }, children)
+  );
 };

package/dist/cjs/media-inline/media-inline-image-card.js

@@ -22,7 +22,9 @@ var MediaInlineImageCardInternal = exports.MediaInlineImageCardInternal = functi
     isSelected = _ref.isSelected,
     intl = _ref.intl,
     alt = _ref.alt,
-    isLazy = _ref.isLazy;
+    isLazy = _ref.isLazy,
+    width = _ref.width,
+    height = _ref.height;
   var _useState = (0, _react.useState)(),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     fileState = _useState2[0],
@@ -88,8 +90,12 @@ var MediaInlineImageCardInternal = exports.MediaInlineImageCardInternal = functi
       alt: alt
     });
   };
+  var aspectRatio = (0, _react.useMemo)(function () {
+    return width && height ? width / height : undefined;
+  }, [width, height]);
   return (0, _react2.jsx)(_inlineImageWrapper.InlineImageWrapper, {
-    isSelected: isSelected
+    isSelected: isSelected,
+    aspectRatio: aspectRatio
   }, content());
 };
 var MediaInlineImageCard = exports.MediaInlineImageCard = (0, _reactIntlNext.injectIntl)(MediaInlineImageCardInternal, {

package/dist/cjs/media-inline/styles.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mediaInlineImageStyles = exports.INLINE_IMAGE_WRAPPER_CLASS_NAME = exports.INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _typography = require("@atlaskit/theme/typography");
+var _templateObject, _templateObject2;
+var INLINE_IMAGE_WRAPPER_CLASS_NAME = exports.INLINE_IMAGE_WRAPPER_CLASS_NAME = 'media-inline-image-wrapper';
+var INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = exports.INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = '--editor-media-inline-image-aspect-ratio';
+var inlineImageHeight = function inlineImageHeight(height) {
+  return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  > .", ",\n    > .mediaInlineView-content-wrap\n    > .", " {\n    height: ", "px;\n  }\n"])), INLINE_IMAGE_WRAPPER_CLASS_NAME, INLINE_IMAGE_WRAPPER_CLASS_NAME, height);
+};
+var mediaInlineImageStyles = exports.mediaInlineImageStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  h1 {\n    ", "\n  }\n\n  h2 {\n    ", "\n  }\n\n  // 24px\n  p,\n  h3 {\n    ", "\n  }\n\n  h4 {\n    ", "\n  }\n\n  h5,\n  h6 {\n    ", "\n  }\n"])), inlineImageHeight(_typography.headingSizes.h800.lineHeight), inlineImageHeight(_typography.headingSizes.h700.lineHeight), inlineImageHeight(_typography.headingSizes.h600.lineHeight), inlineImageHeight(_typography.headingSizes.h500.lineHeight), inlineImageHeight(_typography.headingSizes.h400.lineHeight));

package/dist/cjs/messages/card.js

@@ -90,5 +90,30 @@ var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
     id: 'fabric.editor.datasourceTitle',
     defaultMessage: 'Edit search query',
     description: 'Tooltip of button to edit a card into a datasource'
+  },
+  datasourceJiraIssue: {
+    id: 'fabric.editor.datasource.jiraIssue',
+    defaultMessage: 'Jira Issues',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceJiraIssueDescription: {
+    id: 'fabric.editor.datasource.jiraIssue.description',
+    defaultMessage: 'Insert Jira issues from Jira Cloud with enhanced search, filtering, and configuration.',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceAssetsObjects: {
+    id: 'fabric.editor.datasource.assetsObjects',
+    defaultMessage: 'Assets (Beta)',
+    description: 'Text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects. This feature is currently in Beta release, so we also include messaging for that.'
+  },
+  datasourceAssetsObjectsDescription: {
+    id: 'fabric.editor.datasource.assetsObjects.description',
+    defaultMessage: 'Insert objects from Assets in Jira Service Management with search and filtering',
+    description: 'Description text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects'
+  },
+  inlineOverlay: {
+    id: 'fabric.editor.inlineOverlay',
+    defaultMessage: 'Change view',
+    description: 'An overlay shown when hover over inline smart link to inform user that they can change link view to card and/or embed.'
   }
 });

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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 SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "76.25.4";
+var packageVersion = "76.26.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -24,7 +24,7 @@ var _templateObject, _templateObject2, _templateObject3;
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "76.25.4";
+var packageVersion = "76.26.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/es2019/media-inline/constants.js

@@ -1,2 +1,3 @@
 export const DEFAULT_IMAGE_WIDTH = 250;
-export const DEFAULT_IMAGE_HEIGHT = 200;
+export const DEFAULT_IMAGE_HEIGHT = 200;
+export const DEFAULT_INLINE_IMAGE_ASPECT_RATIO = DEFAULT_IMAGE_WIDTH / DEFAULT_IMAGE_HEIGHT;

package/dist/es2019/media-inline/index.js

@@ -1,4 +1,6 @@
 export { MediaInlineImageCard } from './media-inline-image-card';
 export { shouldShowInlineImage } from './utils';
 export { InlineImageWrapper } from './inline-image-wrapper';
-export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
+export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
+export { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+export { mediaInlineImageStyles, INLINE_IMAGE_WRAPPER_CLASS_NAME } from './styles';

package/dist/es2019/media-inline/inline-image-wrapper.js

@@ -5,8 +5,12 @@ import { B300 } from '@atlaskit/theme/colors';
 const wrapperStyle = css({
   display: 'inline-block',
   verticalAlign: 'text-bottom',
-  borderRadius: `${"var(--ds-border-radius, 3px)"}`
+  overflow: 'hidden',
+  borderRadius: `${"var(--ds-border-radius, 3px)"}`,
+  aspectRatio: `var(${INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY}, ${DEFAULT_INLINE_IMAGE_ASPECT_RATIO})`
 });
+import { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+import { INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, INLINE_IMAGE_WRAPPER_CLASS_NAME } from './styles';
 const selectedStyle = css({
   cursor: 'pointer',
   boxShadow: `0 0 0 1px ${`var(--ds-border-selected, ${B300})`}`,
@@ -15,9 +19,19 @@ const selectedStyle = css({
 });
 export const InlineImageWrapper = ({
   children,
-  isSelected
+  isSelected,
+  aspectRatio
 }) => {
-  return jsx("span", {
-    css: [wrapperStyle, isSelected && selectedStyle]
-  }, children);
+  const style = aspectRatio ? {
+    [INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY]: aspectRatio
+  } : {};
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/prefer-primitives
+    jsx("span", {
+      style: style,
+      className: INLINE_IMAGE_WRAPPER_CLASS_NAME,
+      css: [wrapperStyle, isSelected && selectedStyle],
+      "data-testid": "inline-image-wrapper"
+    }, children)
+  );
 };

package/dist/es2019/media-inline/media-inline-image-card.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 
-import { useEffect, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { createIntl, injectIntl } from 'react-intl-next';
 import { Card } from '@atlaskit/media-card';
@@ -14,7 +14,9 @@ export const MediaInlineImageCardInternal = ({
   isSelected,
   intl,
   alt,
-  isLazy
+  isLazy,
+  width,
+  height
 }) => {
   const [fileState, setFileState] = useState();
   const [subscribeError, setSubscribeError] = useState();
@@ -76,8 +78,10 @@ export const MediaInlineImageCardInternal = ({
       alt: alt
     });
   };
+  const aspectRatio = useMemo(() => width && height ? width / height : undefined, [width, height]);
   return jsx(InlineImageWrapper, {
-    isSelected: isSelected
+    isSelected: isSelected,
+    aspectRatio: aspectRatio
   }, content());
 };
 export const MediaInlineImageCard = injectIntl(MediaInlineImageCardInternal, {

package/dist/es2019/media-inline/styles.js

@@ -0,0 +1,35 @@
+import { css } from '@emotion/react';
+import { headingSizes } from '@atlaskit/theme/typography';
+export const INLINE_IMAGE_WRAPPER_CLASS_NAME = 'media-inline-image-wrapper';
+export const INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = '--editor-media-inline-image-aspect-ratio';
+const inlineImageHeight = height => css`
+  > .${INLINE_IMAGE_WRAPPER_CLASS_NAME},
+    > .mediaInlineView-content-wrap
+    > .${INLINE_IMAGE_WRAPPER_CLASS_NAME} {
+    height: ${height}px;
+  }
+`;
+export const mediaInlineImageStyles = css`
+  h1 {
+    ${inlineImageHeight(headingSizes.h800.lineHeight)}
+  }
+
+  h2 {
+    ${inlineImageHeight(headingSizes.h700.lineHeight)}
+  }
+
+  // 24px
+  p,
+  h3 {
+    ${inlineImageHeight(headingSizes.h600.lineHeight)}
+  }
+
+  h4 {
+    ${inlineImageHeight(headingSizes.h500.lineHeight)}
+  }
+
+  h5,
+  h6 {
+    ${inlineImageHeight(headingSizes.h400.lineHeight)}
+  }
+`;

package/dist/es2019/messages/card.js

@@ -84,5 +84,30 @@ export const messages = defineMessages({
     id: 'fabric.editor.datasourceTitle',
     defaultMessage: 'Edit search query',
     description: 'Tooltip of button to edit a card into a datasource'
+  },
+  datasourceJiraIssue: {
+    id: 'fabric.editor.datasource.jiraIssue',
+    defaultMessage: 'Jira Issues',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceJiraIssueDescription: {
+    id: 'fabric.editor.datasource.jiraIssue.description',
+    defaultMessage: 'Insert Jira issues from Jira Cloud with enhanced search, filtering, and configuration.',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceAssetsObjects: {
+    id: 'fabric.editor.datasource.assetsObjects',
+    defaultMessage: 'Assets (Beta)',
+    description: 'Text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects. This feature is currently in Beta release, so we also include messaging for that.'
+  },
+  datasourceAssetsObjectsDescription: {
+    id: 'fabric.editor.datasource.assetsObjects.description',
+    defaultMessage: 'Insert objects from Assets in Jira Service Management with search and filtering',
+    description: 'Description text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects'
+  },
+  inlineOverlay: {
+    id: 'fabric.editor.inlineOverlay',
+    defaultMessage: 'Change view',
+    description: 'An overlay shown when hover over inline smart link to inform user that they can change link view to card and/or embed.'
   }
 });

package/dist/es2019/monitoring/error.js

@@ -1,6 +1,6 @@
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "76.25.4";
+const packageVersion = "76.26.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -9,7 +9,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "76.25.4";
+const packageVersion = "76.26.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/esm/media-inline/constants.js

@@ -1,2 +1,3 @@
 export var DEFAULT_IMAGE_WIDTH = 250;
-export var DEFAULT_IMAGE_HEIGHT = 200;
+export var DEFAULT_IMAGE_HEIGHT = 200;
+export var DEFAULT_INLINE_IMAGE_ASPECT_RATIO = DEFAULT_IMAGE_WIDTH / DEFAULT_IMAGE_HEIGHT;

package/dist/esm/media-inline/index.js

@@ -1,4 +1,6 @@
 export { MediaInlineImageCard } from './media-inline-image-card';
 export { shouldShowInlineImage } from './utils';
 export { InlineImageWrapper } from './inline-image-wrapper';
-export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
+export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
+export { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+export { mediaInlineImageStyles, INLINE_IMAGE_WRAPPER_CLASS_NAME } from './styles';

package/dist/esm/media-inline/inline-image-wrapper.js

@@ -1,3 +1,4 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /** @jsx jsx */
 
 import { css, jsx } from '@emotion/react';
@@ -5,8 +6,12 @@ import { B300 } from '@atlaskit/theme/colors';
 var wrapperStyle = css({
   display: 'inline-block',
   verticalAlign: 'text-bottom',
-  borderRadius: "var(--ds-border-radius, 3px)"
+  overflow: 'hidden',
+  borderRadius: "var(--ds-border-radius, 3px)",
+  aspectRatio: "var(".concat(INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, ", ").concat(DEFAULT_INLINE_IMAGE_ASPECT_RATIO, ")")
 });
+import { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+import { INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, INLINE_IMAGE_WRAPPER_CLASS_NAME } from './styles';
 var selectedStyle = css({
   cursor: 'pointer',
   boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, ".concat(B300, ")")),
@@ -15,8 +20,16 @@ var selectedStyle = css({
 });
 export var InlineImageWrapper = function InlineImageWrapper(_ref) {
   var children = _ref.children,
-    isSelected = _ref.isSelected;
-  return jsx("span", {
-    css: [wrapperStyle, isSelected && selectedStyle]
-  }, children);
+    isSelected = _ref.isSelected,
+    aspectRatio = _ref.aspectRatio;
+  var style = aspectRatio ? _defineProperty({}, INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY, aspectRatio) : {};
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/prefer-primitives
+    jsx("span", {
+      style: style,
+      className: INLINE_IMAGE_WRAPPER_CLASS_NAME,
+      css: [wrapperStyle, isSelected && selectedStyle],
+      "data-testid": "inline-image-wrapper"
+    }, children)
+  );
 };

package/dist/esm/media-inline/media-inline-image-card.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
 
-import { useEffect, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { createIntl, injectIntl } from 'react-intl-next';
 import { Card } from '@atlaskit/media-card';
@@ -15,7 +15,9 @@ export var MediaInlineImageCardInternal = function MediaInlineImageCardInternal(
     isSelected = _ref.isSelected,
     intl = _ref.intl,
     alt = _ref.alt,
-    isLazy = _ref.isLazy;
+    isLazy = _ref.isLazy,
+    width = _ref.width,
+    height = _ref.height;
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     fileState = _useState2[0],
@@ -81,8 +83,12 @@ export var MediaInlineImageCardInternal = function MediaInlineImageCardInternal(
       alt: alt
     });
   };
+  var aspectRatio = useMemo(function () {
+    return width && height ? width / height : undefined;
+  }, [width, height]);
   return jsx(InlineImageWrapper, {
-    isSelected: isSelected
+    isSelected: isSelected,
+    aspectRatio: aspectRatio
   }, content());
 };
 export var MediaInlineImageCard = injectIntl(MediaInlineImageCardInternal, {

package/dist/esm/media-inline/styles.js

@@ -0,0 +1,10 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject, _templateObject2;
+import { css } from '@emotion/react';
+import { headingSizes } from '@atlaskit/theme/typography';
+export var INLINE_IMAGE_WRAPPER_CLASS_NAME = 'media-inline-image-wrapper';
+export var INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = '--editor-media-inline-image-aspect-ratio';
+var inlineImageHeight = function inlineImageHeight(height) {
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  > .", ",\n    > .mediaInlineView-content-wrap\n    > .", " {\n    height: ", "px;\n  }\n"])), INLINE_IMAGE_WRAPPER_CLASS_NAME, INLINE_IMAGE_WRAPPER_CLASS_NAME, height);
+};
+export var mediaInlineImageStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  h1 {\n    ", "\n  }\n\n  h2 {\n    ", "\n  }\n\n  // 24px\n  p,\n  h3 {\n    ", "\n  }\n\n  h4 {\n    ", "\n  }\n\n  h5,\n  h6 {\n    ", "\n  }\n"])), inlineImageHeight(headingSizes.h800.lineHeight), inlineImageHeight(headingSizes.h700.lineHeight), inlineImageHeight(headingSizes.h600.lineHeight), inlineImageHeight(headingSizes.h500.lineHeight), inlineImageHeight(headingSizes.h400.lineHeight));

package/dist/esm/messages/card.js

@@ -84,5 +84,30 @@ export var messages = defineMessages({
     id: 'fabric.editor.datasourceTitle',
     defaultMessage: 'Edit search query',
     description: 'Tooltip of button to edit a card into a datasource'
+  },
+  datasourceJiraIssue: {
+    id: 'fabric.editor.datasource.jiraIssue',
+    defaultMessage: 'Jira Issues',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceJiraIssueDescription: {
+    id: 'fabric.editor.datasource.jiraIssue.description',
+    defaultMessage: 'Insert Jira issues from Jira Cloud with enhanced search, filtering, and configuration.',
+    description: 'Insert a jira datasource table'
+  },
+  datasourceAssetsObjects: {
+    id: 'fabric.editor.datasource.assetsObjects',
+    defaultMessage: 'Assets (Beta)',
+    description: 'Text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects. This feature is currently in Beta release, so we also include messaging for that.'
+  },
+  datasourceAssetsObjectsDescription: {
+    id: 'fabric.editor.datasource.assetsObjects.description',
+    defaultMessage: 'Insert objects from Assets in Jira Service Management with search and filtering',
+    description: 'Description text displayed when selecting the type of data to include onto the page, in this case: JSM Assets objects'
+  },
+  inlineOverlay: {
+    id: 'fabric.editor.inlineOverlay',
+    defaultMessage: 'Change view',
+    description: 'An overlay shown when hover over inline smart link to inform user that they can change link view to card and/or embed.'
   }
 });

package/dist/esm/monitoring/error.js

@@ -6,7 +6,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "76.25.4";
+var packageVersion = "76.26.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

@@ -19,7 +19,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "76.25.4";
+var packageVersion = "76.26.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

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

@@ -2,4 +2,5 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { AnalyticsEventPayload } from './types';
 export type EditorAnalyticsAPI = {
     attachAnalyticsEvent: (payload: AnalyticsEventPayload, channel?: string) => (tr: Transaction) => boolean;
+    fireAnalyticsEvent: (payload: AnalyticsEventPayload) => void | undefined;
 };

package/dist/types/media-inline/constants.d.ts

@@ -1,2 +1,3 @@
 export declare const DEFAULT_IMAGE_WIDTH = 250;
 export declare const DEFAULT_IMAGE_HEIGHT = 200;
+export declare const DEFAULT_INLINE_IMAGE_ASPECT_RATIO: number;

package/dist/types/media-inline/index.d.ts

@@ -3,3 +3,5 @@ export { shouldShowInlineImage } from './utils';
 export { InlineImageWrapper } from './inline-image-wrapper';
 export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
 export type { MediaInlineAttrs } from './types';
+export { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+export { mediaInlineImageStyles, INLINE_IMAGE_WRAPPER_CLASS_NAME, } from './styles';

package/dist/types/media-inline/inline-image-wrapper.d.ts

@@ -1,8 +1,9 @@
 /** @jsx jsx */
 import type { FC, ReactElement } from 'react';
-type Prop = {
+type Props = {
     children: ReactElement;
     isSelected?: boolean;
+    aspectRatio?: number | string;
 };
-export declare const InlineImageWrapper: FC<Prop>;
+export declare const InlineImageWrapper: FC<Props>;
 export {};

package/dist/types/media-inline/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const INLINE_IMAGE_WRAPPER_CLASS_NAME = "media-inline-image-wrapper";
+export declare const INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = "--editor-media-inline-image-aspect-ratio";
+export declare const mediaInlineImageStyles: import("@emotion/react").SerializedStyles;

package/dist/types/messages/card.d.ts

@@ -84,4 +84,29 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    datasourceJiraIssue: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceJiraIssueDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceAssetsObjects: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceAssetsObjectsDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    inlineOverlay: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

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

@@ -2,4 +2,5 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { AnalyticsEventPayload } from './types';
 export type EditorAnalyticsAPI = {
     attachAnalyticsEvent: (payload: AnalyticsEventPayload, channel?: string) => (tr: Transaction) => boolean;
+    fireAnalyticsEvent: (payload: AnalyticsEventPayload) => void | undefined;
 };

package/dist/types-ts4.5/media-inline/constants.d.ts

@@ -1,2 +1,3 @@
 export declare const DEFAULT_IMAGE_WIDTH = 250;
 export declare const DEFAULT_IMAGE_HEIGHT = 200;
+export declare const DEFAULT_INLINE_IMAGE_ASPECT_RATIO: number;

package/dist/types-ts4.5/media-inline/index.d.ts

@@ -3,3 +3,5 @@ export { shouldShowInlineImage } from './utils';
 export { InlineImageWrapper } from './inline-image-wrapper';
 export { DEFAULT_IMAGE_WIDTH, DEFAULT_IMAGE_HEIGHT } from './constants';
 export type { MediaInlineAttrs } from './types';
+export { DEFAULT_INLINE_IMAGE_ASPECT_RATIO } from './constants';
+export { mediaInlineImageStyles, INLINE_IMAGE_WRAPPER_CLASS_NAME, } from './styles';

package/dist/types-ts4.5/media-inline/inline-image-wrapper.d.ts

@@ -1,8 +1,9 @@
 /** @jsx jsx */
 import type { FC, ReactElement } from 'react';
-type Prop = {
+type Props = {
     children: ReactElement;
     isSelected?: boolean;
+    aspectRatio?: number | string;
 };
-export declare const InlineImageWrapper: FC<Prop>;
+export declare const InlineImageWrapper: FC<Props>;
 export {};

package/dist/types-ts4.5/media-inline/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const INLINE_IMAGE_WRAPPER_CLASS_NAME = "media-inline-image-wrapper";
+export declare const INLINE_IMAGE_ASPECT_RATIO_CSS_VAR_KEY = "--editor-media-inline-image-aspect-ratio";
+export declare const mediaInlineImageStyles: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/messages/card.d.ts

@@ -84,4 +84,29 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    datasourceJiraIssue: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceJiraIssueDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceAssetsObjects: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    datasourceAssetsObjectsDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    inlineOverlay: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-common",
-  "version": "76.25.4",
+  "version": "76.26.0",
   "description": "A package that contains common classes and components for editor and renderer",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -116,7 +116,7 @@
     "@atlaskit/menu": "^2.1.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/profilecard": "^19.7.0",
-    "@atlaskit/smart-card": "^26.42.0",
+    "@atlaskit/smart-card": "^26.43.0",
     "@atlaskit/smart-user-picker": "^6.3.0",
     "@atlaskit/spinner": "^16.0.0",
     "@atlaskit/task-decision": "^17.9.0",