@atlaskit/renderer 108.2.5 → 108.3.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/renderer
 
+## 108.3.0
+
+### Minor Changes
+
+- [`714f16e525a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/714f16e525a) - [ux] Added blockCard integration with datasource ADFs
+
+## 108.2.6
+
+### Patch Changes
+
+- [`4807883cf8e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4807883cf8e) - [MEX-2468] Disable Tooltip in Media Card in Hybrid Renderer
+- Updated dependencies
+
 ## 108.2.5
 
 ### Patch Changes

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

@@ -1,21 +1,27 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = BlockCard;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
+var _react2 = require("@emotion/react");
 var _smartCard = require("@atlaskit/smart-card");
 var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("../../utils");
 var _fallback = require("./fallback");
 var _getCardClickHandler = require("../utils/getCardClickHandler");
 var _analyticsNext = require("@atlaskit/analytics-next");
-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 _linkDatasource = require("@atlaskit/link-datasource");
+/** @jsx jsx */
+
+//  Temporary, until we add aspect ratio to the datasource table
+var datasourceContainerStyle = (0, _react2.css)({
+  height: '500px',
+  overflow: 'auto'
+});
 function BlockCard(props) {
   var url = props.url,
     data = props.data,
@@ -42,22 +48,48 @@ function BlockCard(props) {
     // Below is added for the future implementation of Linking Platform namespaced analytic context
     location: 'renderer'
   };
-  var onError = function onError(_ref2) {
-    var err = _ref2.err;
+  if (props.datasource) {
+    var views = props.datasource.views;
+    var tableView = views.find(function (view) {
+      return view.type === 'table';
+    });
+    if (tableView) {
+      var _tableView$properties;
+      var visibleColumnKeys = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns.map(function (_ref2) {
+        var key = _ref2.key;
+        return key;
+      });
+      return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
+        data: analyticsData
+      }, (0, _react2.jsx)("div", {
+        css: datasourceContainerStyle
+      }, (0, _react2.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
+        unsupportedComponent: _ui.UnsupportedBlock
+      }, cardProps), (0, _react2.jsx)(_linkDatasource.DatasourceTableView, {
+        datasourceId: props.datasource.id,
+        parameters: props.datasource.parameters,
+        visibleColumnKeys: visibleColumnKeys,
+        onVisibleColumnKeysChange: undefined
+      }))));
+    }
+    return null;
+  }
+  var onError = function onError(_ref3) {
+    var err = _ref3.err;
     if (err) {
       throw err;
     }
   };
-  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+  return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
     data: analyticsData
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, (0, _react2.jsx)("div", {
     className: "blockCardView-content-wrap",
     "data-block-card": true,
     "data-card-data": data ? JSON.stringify(data) : undefined,
     "data-card-url": url
-  }, /*#__PURE__*/_react.default.createElement(_fallback.CardErrorBoundary, (0, _extends2.default)({
+  }, (0, _react2.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
     unsupportedComponent: _ui.UnsupportedBlock
-  }, cardProps), /*#__PURE__*/_react.default.createElement(_smartCard.Card, (0, _extends2.default)({
+  }, cardProps), (0, _react2.jsx)(_smartCard.Card, (0, _extends2.default)({
     appearance: "block",
     showActions: rendererAppearance !== 'mobile',
     platform: platform,

package/dist/cjs/ui/MediaCard.js

@@ -226,7 +226,8 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
         disableOverlay = _this$props4.disableOverlay,
         alt = _this$props4.alt,
         featureFlags = _this$props4.featureFlags,
-        ssr = _this$props4.ssr;
+        ssr = _this$props4.ssr,
+        rendererAppearance = _this$props4.rendererAppearance;
       if (imageStatus === 'loading' || !url) {
         return this.renderLoadingCard();
       }
@@ -249,7 +250,8 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
         mediaViewerItems: Array.from(mediaIdentifierMap.values()),
         featureFlags: featureFlags,
-        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+        shouldHideTooltip: rendererAppearance === 'mobile'
       });
     }
   }, {
@@ -325,7 +327,8 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
         mediaViewerItems: Array.from(mediaIdentifierMap.values()),
         featureFlags: featureFlags,
         shouldEnableDownloadButton: shouldEnableDownloadButton,
-        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+        shouldHideTooltip: isMobile
       }));
     }
   }]);

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

@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
 var DEGRADED_SEVERITY_THRESHOLD = 3000;
 exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "108.2.5";
+var packageVersion = "108.3.0";
 var Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.2.5",
+	"version": "108.3.0",
 	"sideEffects": false
 }

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

@@ -1,11 +1,19 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React, { useMemo } from 'react';
+/** @jsx jsx */
+import { useMemo } from 'react';
+import { css, jsx } from '@emotion/react';
 import { Card } from '@atlaskit/smart-card';
 import { UnsupportedBlock } from '@atlaskit/editor-common/ui';
 import { getPlatform } from '../../utils';
 import { CardErrorBoundary } from './fallback';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { DatasourceTableView } from '@atlaskit/link-datasource';
+//  Temporary, until we add aspect ratio to the datasource table
+const datasourceContainerStyle = css({
+  height: '500px',
+  overflow: 'auto'
+});
 export default function BlockCard(props) {
   const {
     url,
@@ -33,6 +41,29 @@ export default function BlockCard(props) {
     // Below is added for the future implementation of Linking Platform namespaced analytic context
     location: 'renderer'
   };
+  if (props.datasource) {
+    const views = props.datasource.views;
+    const tableView = views.find(view => view.type === 'table');
+    if (tableView) {
+      var _tableView$properties;
+      const visibleColumnKeys = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns.map(({
+        key
+      }) => key);
+      return jsx(AnalyticsContext, {
+        data: analyticsData
+      }, jsx("div", {
+        css: datasourceContainerStyle
+      }, jsx(CardErrorBoundary, _extends({
+        unsupportedComponent: UnsupportedBlock
+      }, cardProps), jsx(DatasourceTableView, {
+        datasourceId: props.datasource.id,
+        parameters: props.datasource.parameters,
+        visibleColumnKeys: visibleColumnKeys,
+        onVisibleColumnKeysChange: undefined
+      }))));
+    }
+    return null;
+  }
   const onError = ({
     err
   }) => {
@@ -40,16 +71,16 @@ export default function BlockCard(props) {
       throw err;
     }
   };
-  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+  return jsx(AnalyticsContext, {
     data: analyticsData
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     className: "blockCardView-content-wrap",
     "data-block-card": true,
     "data-card-data": data ? JSON.stringify(data) : undefined,
     "data-card-url": url
-  }, /*#__PURE__*/React.createElement(CardErrorBoundary, _extends({
+  }, jsx(CardErrorBoundary, _extends({
     unsupportedComponent: UnsupportedBlock
-  }, cardProps), /*#__PURE__*/React.createElement(Card, _extends({
+  }, cardProps), jsx(Card, _extends({
     appearance: "block",
     showActions: rendererAppearance !== 'mobile',
     platform: platform,

package/dist/es2019/ui/MediaCard.js

@@ -158,7 +158,8 @@ export class MediaCardInternal extends Component {
       disableOverlay,
       alt,
       featureFlags,
-      ssr
+      ssr,
+      rendererAppearance
     } = this.props;
     if (imageStatus === 'loading' || !url) {
       return this.renderLoadingCard();
@@ -182,7 +183,8 @@ export class MediaCardInternal extends Component {
       shouldOpenMediaViewer: shouldOpenMediaViewer,
       mediaViewerItems: Array.from(mediaIdentifierMap.values()),
       featureFlags: featureFlags,
-      ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+      ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+      shouldHideTooltip: rendererAppearance === 'mobile'
     });
   }
   render() {
@@ -258,7 +260,8 @@ export class MediaCardInternal extends Component {
       mediaViewerItems: Array.from(mediaIdentifierMap.values()),
       featureFlags: featureFlags,
       shouldEnableDownloadButton: shouldEnableDownloadButton,
-      ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+      ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+      shouldHideTooltip: isMobile
     }));
   }
 }

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

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

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.2.5",
+	"version": "108.3.0",
 	"sideEffects": false
 }

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

@@ -1,11 +1,19 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React, { useMemo } from 'react';
+/** @jsx jsx */
+import { useMemo } from 'react';
+import { css, jsx } from '@emotion/react';
 import { Card } from '@atlaskit/smart-card';
 import { UnsupportedBlock } from '@atlaskit/editor-common/ui';
 import { getPlatform } from '../../utils';
 import { CardErrorBoundary } from './fallback';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { DatasourceTableView } from '@atlaskit/link-datasource';
+//  Temporary, until we add aspect ratio to the datasource table
+var datasourceContainerStyle = css({
+  height: '500px',
+  overflow: 'auto'
+});
 export default function BlockCard(props) {
   var url = props.url,
     data = props.data,
@@ -32,22 +40,48 @@ export default function BlockCard(props) {
     // Below is added for the future implementation of Linking Platform namespaced analytic context
     location: 'renderer'
   };
-  var onError = function onError(_ref2) {
-    var err = _ref2.err;
+  if (props.datasource) {
+    var views = props.datasource.views;
+    var tableView = views.find(function (view) {
+      return view.type === 'table';
+    });
+    if (tableView) {
+      var _tableView$properties;
+      var visibleColumnKeys = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns.map(function (_ref2) {
+        var key = _ref2.key;
+        return key;
+      });
+      return jsx(AnalyticsContext, {
+        data: analyticsData
+      }, jsx("div", {
+        css: datasourceContainerStyle
+      }, jsx(CardErrorBoundary, _extends({
+        unsupportedComponent: UnsupportedBlock
+      }, cardProps), jsx(DatasourceTableView, {
+        datasourceId: props.datasource.id,
+        parameters: props.datasource.parameters,
+        visibleColumnKeys: visibleColumnKeys,
+        onVisibleColumnKeysChange: undefined
+      }))));
+    }
+    return null;
+  }
+  var onError = function onError(_ref3) {
+    var err = _ref3.err;
     if (err) {
       throw err;
     }
   };
-  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+  return jsx(AnalyticsContext, {
     data: analyticsData
-  }, /*#__PURE__*/React.createElement("div", {
+  }, jsx("div", {
     className: "blockCardView-content-wrap",
     "data-block-card": true,
     "data-card-data": data ? JSON.stringify(data) : undefined,
     "data-card-url": url
-  }, /*#__PURE__*/React.createElement(CardErrorBoundary, _extends({
+  }, jsx(CardErrorBoundary, _extends({
     unsupportedComponent: UnsupportedBlock
-  }, cardProps), /*#__PURE__*/React.createElement(Card, _extends({
+  }, cardProps), jsx(Card, _extends({
     appearance: "block",
     showActions: rendererAppearance !== 'mobile',
     platform: platform,

package/dist/esm/ui/MediaCard.js

@@ -214,7 +214,8 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
         disableOverlay = _this$props4.disableOverlay,
         alt = _this$props4.alt,
         featureFlags = _this$props4.featureFlags,
-        ssr = _this$props4.ssr;
+        ssr = _this$props4.ssr,
+        rendererAppearance = _this$props4.rendererAppearance;
       if (imageStatus === 'loading' || !url) {
         return this.renderLoadingCard();
       }
@@ -237,7 +238,8 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
         shouldOpenMediaViewer: shouldOpenMediaViewer,
         mediaViewerItems: Array.from(mediaIdentifierMap.values()),
         featureFlags: featureFlags,
-        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+        shouldHideTooltip: rendererAppearance === 'mobile'
       });
     }
   }, {
@@ -313,7 +315,8 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
         mediaViewerItems: Array.from(mediaIdentifierMap.values()),
         featureFlags: featureFlags,
         shouldEnableDownloadButton: shouldEnableDownloadButton,
-        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode
+        ssr: ssr === null || ssr === void 0 ? void 0 : ssr.mode,
+        shouldHideTooltip: isMobile
       }));
     }
   }]);

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

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

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "108.2.5",
+	"version": "108.3.0",
 	"sideEffects": false
 }

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

@@ -1,12 +1,14 @@
-/// <reference types="react" />
+import { jsx } from '@emotion/react';
 import type { EventHandlers } from '@atlaskit/editor-common/ui';
 import { RendererAppearance } from '../../ui/Renderer/types';
 import { SmartLinksOptions } from '../../types/smartLinksOptions';
+import type { DatasourceAttributeProperties } from '@atlaskit/adf-schema/schema';
 export default function BlockCard(props: {
     url?: string;
     data?: object;
     eventHandlers?: EventHandlers;
+    datasource?: DatasourceAttributeProperties;
     portal?: HTMLElement;
     rendererAppearance?: RendererAppearance;
     smartLinks?: SmartLinksOptions;
-}): JSX.Element;
+}): jsx.JSX.Element | null;

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

@@ -49,6 +49,7 @@ declare const BlockCard: React.ComponentType<{
     url?: string | undefined;
     data?: object | undefined;
     eventHandlers?: import("@atlaskit/editor-common/ui").EventHandlers | undefined;
+    datasource?: import("@atlaskit/adf-schema/schema").DatasourceAttributeProperties | undefined;
     portal?: HTMLElement | undefined;
     rendererAppearance?: import("../../ui/Renderer/types").RendererAppearance;
     smartLinks?: import("../../types/smartLinksOptions").SmartLinksOptions | undefined;

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

@@ -1,12 +1,14 @@
-/// <reference types="react" />
+import { jsx } from '@emotion/react';
 import type { EventHandlers } from '@atlaskit/editor-common/ui';
 import { RendererAppearance } from '../../ui/Renderer/types';
 import { SmartLinksOptions } from '../../types/smartLinksOptions';
+import type { DatasourceAttributeProperties } from '@atlaskit/adf-schema/schema';
 export default function BlockCard(props: {
     url?: string;
     data?: object;
     eventHandlers?: EventHandlers;
+    datasource?: DatasourceAttributeProperties;
     portal?: HTMLElement;
     rendererAppearance?: RendererAppearance;
     smartLinks?: SmartLinksOptions;
-}): JSX.Element;
+}): jsx.JSX.Element | null;

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

@@ -49,6 +49,7 @@ declare const BlockCard: React.ComponentType<{
     url?: string | undefined;
     data?: object | undefined;
     eventHandlers?: import("@atlaskit/editor-common/ui").EventHandlers | undefined;
+    datasource?: import("@atlaskit/adf-schema/schema").DatasourceAttributeProperties | undefined;
     portal?: HTMLElement | undefined;
     rendererAppearance?: import("../../ui/Renderer/types").RendererAppearance;
     smartLinks?: import("../../types/smartLinksOptions").SmartLinksOptions | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "108.2.5",
+  "version": "108.3.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -32,7 +32,7 @@
     }
   },
   "dependencies": {
-    "@atlaskit/adf-schema": "^25.9.0",
+    "@atlaskit/adf-schema": "^25.10.0",
     "@atlaskit/adf-utils": "^18.4.0",
     "@atlaskit/analytics-listeners": "^8.7.0",
     "@atlaskit/analytics-namespaced-context": "^6.7.0",
@@ -45,6 +45,7 @@
     "@atlaskit/editor-shared-styles": "^2.4.0",
     "@atlaskit/emoji": "^67.4.0",
     "@atlaskit/icon": "^21.12.0",
+    "@atlaskit/link-datasource": "^0.24.0",
     "@atlaskit/media-card": "^76.0.0",
     "@atlaskit/media-client": "^23.1.0",
     "@atlaskit/media-common": "^7.0.0",
@@ -80,7 +81,7 @@
     "@atlaskit/avatar": "^21.3.0",
     "@atlaskit/css-reset": "^6.5.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/editor-core": "^185.3.0",
+    "@atlaskit/editor-core": "^185.4.0",
     "@atlaskit/editor-test-helpers": "^18.7.0",
     "@atlaskit/inline-edit": "^12.3.3",
     "@atlaskit/link-provider": "^1.6.0",