@atlaskit/renderer 108.4.2 → 108.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 108.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`a1b70608039`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a1b70608039) - [ux] Adds editor toolbar to link datasource component
8
+
9
+ ### Patch Changes
10
+
11
+ - Updated dependencies
12
+
13
+ ## 108.4.3
14
+
15
+ ### Patch Changes
16
+
17
+ - [`a390f5a61da`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a390f5a61da) - [ux] The change here enables the datasource table to render based on the layout defined in ADF.
18
+
3
19
  ## 108.4.2
4
20
 
5
21
  ### Patch Changes
@@ -15,12 +15,19 @@ var _fallback = require("./fallback");
15
15
  var _getCardClickHandler = require("../utils/getCardClickHandler");
16
16
  var _analyticsNext = require("@atlaskit/analytics-next");
17
17
  var _linkDatasource = require("@atlaskit/link-datasource");
18
+ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
19
+ var _colors = require("@atlaskit/theme/colors");
20
+ var _utils2 = require("@atlaskit/editor-common/utils");
18
21
  /** @jsx jsx */
19
22
 
20
23
  // Temporary, until we add aspect ratio to the datasource table
21
24
  var datasourceContainerStyle = (0, _react2.css)({
22
25
  height: '500px',
23
- overflow: 'auto'
26
+ overflow: 'auto',
27
+ borderRadius: "".concat("var(--ds-border-radius-100, ".concat(_editorSharedStyles.akEditorRuleBorderRadius, ")")),
28
+ border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
29
+ marginLeft: '50%',
30
+ transform: 'translateX(-50%)'
24
31
  });
25
32
  function BlockCard(props) {
26
33
  var url = props.url,
@@ -59,23 +66,31 @@ function BlockCard(props) {
59
66
  var key = _ref2.key;
60
67
  return key;
61
68
  });
69
+ var datasource = props.datasource,
70
+ layout = props.layout;
62
71
  return (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
63
72
  data: analyticsData
64
- }, (0, _react2.jsx)("div", {
65
- css: datasourceContainerStyle
66
73
  }, (0, _react2.jsx)(_fallback.CardErrorBoundary, (0, _extends2.default)({
67
74
  unsupportedComponent: _ui.UnsupportedBlock
68
- }, cardProps), (0, _react2.jsx)(_linkDatasource.DatasourceTableView, {
69
- datasourceId: props.datasource.id,
70
- parameters: props.datasource.parameters,
71
- visibleColumnKeys: visibleColumnKeys,
72
- onVisibleColumnKeysChange: undefined
73
- }))));
75
+ }, cardProps), (0, _react2.jsx)(_ui.WidthConsumer, null, function (_ref3) {
76
+ var width = _ref3.width;
77
+ return (0, _react2.jsx)("div", {
78
+ css: datasourceContainerStyle,
79
+ style: {
80
+ width: (0, _utils2.calcBreakoutWidth)(layout, width)
81
+ }
82
+ }, (0, _react2.jsx)(_linkDatasource.DatasourceTableView, {
83
+ datasourceId: datasource.id,
84
+ parameters: datasource.parameters,
85
+ visibleColumnKeys: visibleColumnKeys,
86
+ onVisibleColumnKeysChange: undefined
87
+ }));
88
+ })));
74
89
  }
75
90
  return null;
76
91
  }
77
- var onError = function onError(_ref3) {
78
- var err = _ref3.err;
92
+ var onError = function onError(_ref4) {
93
+ var err = _ref4.err;
79
94
  if (err) {
80
95
  throw err;
81
96
  }
@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
55
55
  var DEGRADED_SEVERITY_THRESHOLD = 3000;
56
56
  exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
57
57
  var packageName = "@atlaskit/renderer";
58
- var packageVersion = "108.4.2";
58
+ var packageVersion = "108.5.0";
59
59
  var Renderer = /*#__PURE__*/function (_PureComponent) {
60
60
  (0, _inherits2.default)(Renderer, _PureComponent);
61
61
  var _super = _createSuper(Renderer);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "108.4.2",
3
+ "version": "108.5.0",
4
4
  "sideEffects": false
5
5
  }
@@ -3,16 +3,24 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import { useMemo } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { Card } from '@atlaskit/smart-card';
6
- import { UnsupportedBlock } from '@atlaskit/editor-common/ui';
6
+ import { UnsupportedBlock, WidthConsumer } from '@atlaskit/editor-common/ui';
7
7
  import { getPlatform } from '../../utils';
8
8
  import { CardErrorBoundary } from './fallback';
9
9
  import { getCardClickHandler } from '../utils/getCardClickHandler';
10
10
  import { AnalyticsContext } from '@atlaskit/analytics-next';
11
11
  import { DatasourceTableView } from '@atlaskit/link-datasource';
12
+ import { akEditorRuleBorderRadius } from '@atlaskit/editor-shared-styles';
13
+ import { N40 } from '@atlaskit/theme/colors';
14
+ import { calcBreakoutWidth } from '@atlaskit/editor-common/utils';
15
+
12
16
  // Temporary, until we add aspect ratio to the datasource table
13
17
  const datasourceContainerStyle = css({
14
18
  height: '500px',
15
- overflow: 'auto'
19
+ overflow: 'auto',
20
+ borderRadius: `${`var(--ds-border-radius-100, ${akEditorRuleBorderRadius})`}`,
21
+ border: `1px solid ${`var(--ds-border, ${N40})`}`,
22
+ marginLeft: '50%',
23
+ transform: 'translateX(-50%)'
16
24
  });
17
25
  export default function BlockCard(props) {
18
26
  const {
@@ -49,18 +57,27 @@ export default function BlockCard(props) {
49
57
  const visibleColumnKeys = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns.map(({
50
58
  key
51
59
  }) => key);
60
+ const {
61
+ datasource,
62
+ layout
63
+ } = props;
52
64
  return jsx(AnalyticsContext, {
53
65
  data: analyticsData
54
- }, jsx("div", {
55
- css: datasourceContainerStyle
56
66
  }, jsx(CardErrorBoundary, _extends({
57
67
  unsupportedComponent: UnsupportedBlock
58
- }, cardProps), jsx(DatasourceTableView, {
59
- datasourceId: props.datasource.id,
60
- parameters: props.datasource.parameters,
68
+ }, cardProps), jsx(WidthConsumer, null, ({
69
+ width
70
+ }) => jsx("div", {
71
+ css: datasourceContainerStyle,
72
+ style: {
73
+ width: calcBreakoutWidth(layout, width)
74
+ }
75
+ }, jsx(DatasourceTableView, {
76
+ datasourceId: datasource.id,
77
+ parameters: datasource.parameters,
61
78
  visibleColumnKeys: visibleColumnKeys,
62
79
  onVisibleColumnKeysChange: undefined
63
- }))));
80
+ })))));
64
81
  }
65
82
  return null;
66
83
  }
@@ -35,7 +35,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
35
35
  export const NORMAL_SEVERITY_THRESHOLD = 2000;
36
36
  export const DEGRADED_SEVERITY_THRESHOLD = 3000;
37
37
  const packageName = "@atlaskit/renderer";
38
- const packageVersion = "108.4.2";
38
+ const packageVersion = "108.5.0";
39
39
  export class Renderer extends PureComponent {
40
40
  constructor(props) {
41
41
  super(props);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "108.4.2",
3
+ "version": "108.5.0",
4
4
  "sideEffects": false
5
5
  }
@@ -3,16 +3,24 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import { useMemo } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { Card } from '@atlaskit/smart-card';
6
- import { UnsupportedBlock } from '@atlaskit/editor-common/ui';
6
+ import { UnsupportedBlock, WidthConsumer } from '@atlaskit/editor-common/ui';
7
7
  import { getPlatform } from '../../utils';
8
8
  import { CardErrorBoundary } from './fallback';
9
9
  import { getCardClickHandler } from '../utils/getCardClickHandler';
10
10
  import { AnalyticsContext } from '@atlaskit/analytics-next';
11
11
  import { DatasourceTableView } from '@atlaskit/link-datasource';
12
+ import { akEditorRuleBorderRadius } from '@atlaskit/editor-shared-styles';
13
+ import { N40 } from '@atlaskit/theme/colors';
14
+ import { calcBreakoutWidth } from '@atlaskit/editor-common/utils';
15
+
12
16
  // Temporary, until we add aspect ratio to the datasource table
13
17
  var datasourceContainerStyle = css({
14
18
  height: '500px',
15
- overflow: 'auto'
19
+ overflow: 'auto',
20
+ borderRadius: "".concat("var(--ds-border-radius-100, ".concat(akEditorRuleBorderRadius, ")")),
21
+ border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")")),
22
+ marginLeft: '50%',
23
+ transform: 'translateX(-50%)'
16
24
  });
17
25
  export default function BlockCard(props) {
18
26
  var url = props.url,
@@ -51,23 +59,31 @@ export default function BlockCard(props) {
51
59
  var key = _ref2.key;
52
60
  return key;
53
61
  });
62
+ var datasource = props.datasource,
63
+ layout = props.layout;
54
64
  return jsx(AnalyticsContext, {
55
65
  data: analyticsData
56
- }, jsx("div", {
57
- css: datasourceContainerStyle
58
66
  }, jsx(CardErrorBoundary, _extends({
59
67
  unsupportedComponent: UnsupportedBlock
60
- }, cardProps), jsx(DatasourceTableView, {
61
- datasourceId: props.datasource.id,
62
- parameters: props.datasource.parameters,
63
- visibleColumnKeys: visibleColumnKeys,
64
- onVisibleColumnKeysChange: undefined
65
- }))));
68
+ }, cardProps), jsx(WidthConsumer, null, function (_ref3) {
69
+ var width = _ref3.width;
70
+ return jsx("div", {
71
+ css: datasourceContainerStyle,
72
+ style: {
73
+ width: calcBreakoutWidth(layout, width)
74
+ }
75
+ }, jsx(DatasourceTableView, {
76
+ datasourceId: datasource.id,
77
+ parameters: datasource.parameters,
78
+ visibleColumnKeys: visibleColumnKeys,
79
+ onVisibleColumnKeysChange: undefined
80
+ }));
81
+ })));
66
82
  }
67
83
  return null;
68
84
  }
69
- var onError = function onError(_ref3) {
70
- var err = _ref3.err;
85
+ var onError = function onError(_ref4) {
86
+ var err = _ref4.err;
71
87
  if (err) {
72
88
  throw err;
73
89
  }
@@ -45,7 +45,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
45
45
  export var NORMAL_SEVERITY_THRESHOLD = 2000;
46
46
  export var DEGRADED_SEVERITY_THRESHOLD = 3000;
47
47
  var packageName = "@atlaskit/renderer";
48
- var packageVersion = "108.4.2";
48
+ var packageVersion = "108.5.0";
49
49
  export var Renderer = /*#__PURE__*/function (_PureComponent) {
50
50
  _inherits(Renderer, _PureComponent);
51
51
  var _super = _createSuper(Renderer);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "108.4.2",
3
+ "version": "108.5.0",
4
4
  "sideEffects": false
5
5
  }
@@ -11,4 +11,5 @@ export default function BlockCard(props: {
11
11
  portal?: HTMLElement;
12
12
  rendererAppearance?: RendererAppearance;
13
13
  smartLinks?: SmartLinksOptions;
14
+ layout?: string;
14
15
  }): jsx.JSX.Element | null;
@@ -53,6 +53,7 @@ declare const BlockCard: React.ComponentType<{
53
53
  portal?: HTMLElement | undefined;
54
54
  rendererAppearance?: import("../../ui/Renderer/types").RendererAppearance;
55
55
  smartLinks?: import("../../types/smartLinksOptions").SmartLinksOptions | undefined;
56
+ layout?: string | undefined;
56
57
  }> & Loadable.LoadableComponent;
57
58
  declare const Media: React.ComponentType<import("./media").MediaProps> & Loadable.LoadableComponent;
58
59
  declare const MediaGroup: React.ComponentType<import("./mediaGroup").MediaGroupProps> & Loadable.LoadableComponent;
@@ -11,4 +11,5 @@ export default function BlockCard(props: {
11
11
  portal?: HTMLElement;
12
12
  rendererAppearance?: RendererAppearance;
13
13
  smartLinks?: SmartLinksOptions;
14
+ layout?: string;
14
15
  }): jsx.JSX.Element | null;
@@ -53,6 +53,7 @@ declare const BlockCard: React.ComponentType<{
53
53
  portal?: HTMLElement | undefined;
54
54
  rendererAppearance?: import("../../ui/Renderer/types").RendererAppearance;
55
55
  smartLinks?: import("../../types/smartLinksOptions").SmartLinksOptions | undefined;
56
+ layout?: string | undefined;
56
57
  }> & Loadable.LoadableComponent;
57
58
  declare const Media: React.ComponentType<import("./media").MediaProps> & Loadable.LoadableComponent;
58
59
  declare const MediaGroup: React.ComponentType<import("./mediaGroup").MediaGroupProps> & Loadable.LoadableComponent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "108.4.2",
3
+ "version": "108.5.0",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -39,13 +39,13 @@
39
39
  "@atlaskit/analytics-next": "^9.1.0",
40
40
  "@atlaskit/button": "^16.8.0",
41
41
  "@atlaskit/code": "^14.6.0",
42
- "@atlaskit/editor-common": "^74.11.0",
42
+ "@atlaskit/editor-common": "^74.12.0",
43
43
  "@atlaskit/editor-json-transformer": "^8.9.0",
44
44
  "@atlaskit/editor-palette": "1.5.1",
45
45
  "@atlaskit/editor-shared-styles": "^2.4.0",
46
46
  "@atlaskit/emoji": "^67.4.0",
47
47
  "@atlaskit/icon": "^21.12.0",
48
- "@atlaskit/link-datasource": "^0.25.0",
48
+ "@atlaskit/link-datasource": "^0.26.0",
49
49
  "@atlaskit/media-card": "^76.0.0",
50
50
  "@atlaskit/media-client": "^23.1.0",
51
51
  "@atlaskit/media-common": "^7.1.0",
@@ -53,7 +53,7 @@
53
53
  "@atlaskit/media-ui": "^23.1.0",
54
54
  "@atlaskit/media-viewer": "^48.0.0",
55
55
  "@atlaskit/platform-feature-flags": "^0.2.0",
56
- "@atlaskit/smart-card": "^26.6.0",
56
+ "@atlaskit/smart-card": "^26.8.0",
57
57
  "@atlaskit/status": "^1.3.0",
58
58
  "@atlaskit/task-decision": "^17.6.0",
59
59
  "@atlaskit/theme": "^12.5.0",
@@ -81,7 +81,7 @@
81
81
  "@atlaskit/avatar": "^21.3.0",
82
82
  "@atlaskit/css-reset": "^6.5.0",
83
83
  "@atlaskit/docs": "*",
84
- "@atlaskit/editor-core": "^185.5.0",
84
+ "@atlaskit/editor-core": "^185.6.0",
85
85
  "@atlaskit/editor-test-helpers": "^18.7.0",
86
86
  "@atlaskit/inline-edit": "^12.3.3",
87
87
  "@atlaskit/link-provider": "^1.6.0",