@atlaskit/renderer 108.9.1 → 108.10.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/renderer
 
+## 108.10.0
+
+### Minor Changes
+
+- [`b9a083dc04d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b9a083dc04d) - [ux] Adds error boundaries specific to datasource in editor and renderer. Fallback to unsupported block if no url or inline if url
+
 ## 108.9.1
 
 ### Patch Changes

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

@@ -45,7 +45,8 @@ function BlockCard(props) {
     url: url,
     data: data,
     onClick: onClick,
-    container: portal
+    container: portal,
+    isDatasource: !!props.datasource
   };
   var analyticsData = {
     attributes: {
@@ -80,7 +81,7 @@ function BlockCard(props) {
       return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
         data: analyticsData
       }, (0, _react2.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
-        unsupportedComponent: _ui.UnsupportedBlock
+        unsupportedComponent: _ui.UnsupportedInline
       }, cardProps), (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref4) {
         var width = _ref4.width;
         return (0, _react2.jsx)("div", {

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

@@ -13,6 +13,8 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
+var _ = require("./");
+var _adfSchema = require("@atlaskit/adf-schema");
 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; } }
 var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
@@ -43,14 +45,19 @@ var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
     key: "render",
     value: function render() {
       if (this.state.isError) {
-        var _url = this.props.url;
+        var _this$props2 = this.props,
+          _url = _this$props2.url,
+          isDatasource = _this$props2.isDatasource,
+          UnsupportedComponent = _this$props2.unsupportedComponent;
         if (_url) {
+          if (isDatasource && (0, _adfSchema.isSafeUrl)(_url)) {
+            return /*#__PURE__*/_react.default.createElement(_.InlineCard, this.props);
+          }
           return /*#__PURE__*/_react.default.createElement("a", {
             href: _url,
             onClick: this.onClickFallback
           }, _url);
         } else {
-          var UnsupportedComponent = this.props.unsupportedComponent;
           return /*#__PURE__*/_react.default.createElement(UnsupportedComponent, null);
         }
       }
@@ -63,6 +70,13 @@ var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
         isError: true
       });
     }
+  }], [{
+    key: "getDerivedStateFromError",
+    value: function getDerivedStateFromError() {
+      return {
+        isError: true
+      };
+    }
   }]);
   return CardErrorBoundary;
 }(_react.default.PureComponent);

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.9.1";
+var packageVersion = "108.10.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.9.1",
+	"version": "108.10.0",
 	"sideEffects": false
 }

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

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import { useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
 import { Card } from '@atlaskit/smart-card';
-import { UnsupportedBlock, WidthConsumer } from '@atlaskit/editor-common/ui';
+import { UnsupportedBlock, UnsupportedInline, WidthConsumer } from '@atlaskit/editor-common/ui';
 import { getPlatform } from '../../utils';
 import { CardErrorBoundary } from './fallback';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
@@ -39,7 +39,8 @@ export default function BlockCard(props) {
     url,
     data,
     onClick,
-    container: portal
+    container: portal,
+    isDatasource: !!props.datasource
   };
   const analyticsData = {
     attributes: {
@@ -74,7 +75,7 @@ export default function BlockCard(props) {
       return jsx(AnalyticsContext, {
         data: analyticsData
       }, jsx(CardErrorBoundary, _extends({
-        unsupportedComponent: UnsupportedBlock
+        unsupportedComponent: UnsupportedInline
       }, cardProps), jsx(WidthConsumer, null, ({
         width
       }) => jsx("div", {

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

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
+import { InlineCard } from './';
+import { isSafeUrl } from '@atlaskit/adf-schema';
 export class CardErrorBoundary extends React.PureComponent {
   constructor(...args) {
     super(...args);
@@ -17,20 +19,27 @@ export class CardErrorBoundary extends React.PureComponent {
       }
     });
   }
+  static getDerivedStateFromError() {
+    return {
+      isError: true
+    };
+  }
   render() {
     if (this.state.isError) {
       const {
-        url
+        url,
+        isDatasource,
+        unsupportedComponent: UnsupportedComponent
       } = this.props;
       if (url) {
+        if (isDatasource && isSafeUrl(url)) {
+          return /*#__PURE__*/React.createElement(InlineCard, this.props);
+        }
         return /*#__PURE__*/React.createElement("a", {
           href: url,
           onClick: this.onClickFallback
         }, url);
       } else {
-        const {
-          unsupportedComponent: UnsupportedComponent
-        } = this.props;
         return /*#__PURE__*/React.createElement(UnsupportedComponent, null);
       }
     }

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.9.1";
+const packageVersion = "108.10.0";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/es2019/version.json

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

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

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import { useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
 import { Card } from '@atlaskit/smart-card';
-import { UnsupportedBlock, WidthConsumer } from '@atlaskit/editor-common/ui';
+import { UnsupportedBlock, UnsupportedInline, WidthConsumer } from '@atlaskit/editor-common/ui';
 import { getPlatform } from '../../utils';
 import { CardErrorBoundary } from './fallback';
 import { getCardClickHandler } from '../utils/getCardClickHandler';
@@ -38,7 +38,8 @@ export default function BlockCard(props) {
     url: url,
     data: data,
     onClick: onClick,
-    container: portal
+    container: portal,
+    isDatasource: !!props.datasource
   };
   var analyticsData = {
     attributes: {
@@ -73,7 +74,7 @@ export default function BlockCard(props) {
       return jsx(AnalyticsContext, {
         data: analyticsData
       }, jsx(CardErrorBoundary, _extends({
-        unsupportedComponent: UnsupportedBlock
+        unsupportedComponent: UnsupportedInline
       }, cardProps), jsx(WidthConsumer, null, function (_ref4) {
         var width = _ref4.width;
         return jsx("div", {

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

@@ -8,6 +8,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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() { 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; } }
 import React from 'react';
+import { InlineCard } from './';
+import { isSafeUrl } from '@atlaskit/adf-schema';
 export var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(CardErrorBoundary, _React$PureComponent);
   var _super = _createSuper(CardErrorBoundary);
@@ -36,14 +38,19 @@ export var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
     key: "render",
     value: function render() {
       if (this.state.isError) {
-        var _url = this.props.url;
+        var _this$props2 = this.props,
+          _url = _this$props2.url,
+          isDatasource = _this$props2.isDatasource,
+          UnsupportedComponent = _this$props2.unsupportedComponent;
         if (_url) {
+          if (isDatasource && isSafeUrl(_url)) {
+            return /*#__PURE__*/React.createElement(InlineCard, this.props);
+          }
           return /*#__PURE__*/React.createElement("a", {
             href: _url,
             onClick: this.onClickFallback
           }, _url);
         } else {
-          var UnsupportedComponent = this.props.unsupportedComponent;
           return /*#__PURE__*/React.createElement(UnsupportedComponent, null);
         }
       }
@@ -56,6 +63,13 @@ export var CardErrorBoundary = /*#__PURE__*/function (_React$PureComponent) {
         isError: true
       });
     }
+  }], [{
+    key: "getDerivedStateFromError",
+    value: function getDerivedStateFromError() {
+      return {
+        isError: true
+      };
+    }
   }]);
   return CardErrorBoundary;
 }(React.PureComponent);

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.9.1";
+var packageVersion = "108.10.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.9.1",
+	"version": "108.10.0",
 	"sideEffects": false
 }

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

@@ -5,11 +5,15 @@ export type CardErrorBoundaryProps = {
 export declare class CardErrorBoundary extends React.PureComponent<{
     url?: string;
     onClick?: (e: React.MouseEvent<HTMLElement>, url?: string) => void;
+    isDatasource?: boolean;
 } & CardErrorBoundaryProps> {
     state: {
         isError: boolean;
     };
     onClickFallback: (e: React.MouseEvent<HTMLElement>) => void;
+    static getDerivedStateFromError(): {
+        isError: boolean;
+    };
     render(): React.ReactNode;
     componentDidCatch(_error: Error): void;
 }

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

@@ -5,11 +5,15 @@ export type CardErrorBoundaryProps = {
 export declare class CardErrorBoundary extends React.PureComponent<{
     url?: string;
     onClick?: (e: React.MouseEvent<HTMLElement>, url?: string) => void;
+    isDatasource?: boolean;
 } & CardErrorBoundaryProps> {
     state: {
         isError: boolean;
     };
     onClickFallback: (e: React.MouseEvent<HTMLElement>) => void;
+    static getDerivedStateFromError(): {
+        isError: boolean;
+    };
     render(): React.ReactNode;
     componentDidCatch(_error: Error): void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "108.9.1",
+  "version": "108.10.0",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -35,7 +35,7 @@
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-prosemirror": "1.0.2",
-    "@atlaskit/editor-shared-styles": "^2.5.0",
+    "@atlaskit/editor-shared-styles": "^2.6.0",
     "@atlaskit/emoji": "^67.4.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/link-datasource": "^0.33.0",