@atlaskit/editor-synced-block-renderer 2.2.3 → 2.2.5

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.
Files changed (38) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/getSyncedBlockNodeComponent.js +24 -0
  3. package/dist/cjs/getSyncedBlockRenderer.js +14 -0
  4. package/dist/cjs/index.js +5 -4
  5. package/dist/cjs/ui/SyncedBlockErrorComponent.js +5 -5
  6. package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js +62 -0
  7. package/dist/cjs/ui/SyncedBlockRenderer.js +41 -0
  8. package/dist/es2019/getSyncedBlockNodeComponent.js +13 -0
  9. package/dist/es2019/getSyncedBlockRenderer.js +7 -0
  10. package/dist/es2019/index.js +3 -2
  11. package/dist/es2019/ui/SyncedBlockErrorComponent.js +6 -6
  12. package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js +47 -0
  13. package/dist/es2019/ui/SyncedBlockRenderer.js +35 -0
  14. package/dist/esm/getSyncedBlockNodeComponent.js +17 -0
  15. package/dist/esm/getSyncedBlockRenderer.js +7 -0
  16. package/dist/esm/index.js +3 -2
  17. package/dist/esm/ui/SyncedBlockErrorComponent.js +6 -6
  18. package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js +53 -0
  19. package/dist/esm/ui/SyncedBlockRenderer.js +34 -0
  20. package/dist/types/getSyncedBlockNodeComponent.d.ts +5 -0
  21. package/dist/types/getSyncedBlockRenderer.d.ts +3 -0
  22. package/dist/types/index.d.ts +2 -1
  23. package/dist/types/ui/SyncedBlockErrorComponent.d.ts +3 -3
  24. package/dist/types/ui/SyncedBlockNodeComponentRenderer.d.ts +11 -0
  25. package/dist/types/ui/SyncedBlockRenderer.d.ts +8 -0
  26. package/dist/types-ts4.5/getSyncedBlockNodeComponent.d.ts +5 -0
  27. package/dist/types-ts4.5/getSyncedBlockRenderer.d.ts +3 -0
  28. package/dist/types-ts4.5/index.d.ts +2 -1
  29. package/dist/types-ts4.5/ui/SyncedBlockErrorComponent.d.ts +3 -3
  30. package/dist/types-ts4.5/ui/SyncedBlockNodeComponentRenderer.d.ts +11 -0
  31. package/dist/types-ts4.5/ui/SyncedBlockRenderer.d.ts +8 -0
  32. package/package.json +2 -2
  33. package/afm-townsquare/tsconfig.json +0 -35
  34. package/dist/cjs/syncedBlockRenderer.js +0 -127
  35. package/dist/es2019/syncedBlockRenderer.js +0 -109
  36. package/dist/esm/syncedBlockRenderer.js +0 -118
  37. package/dist/types/syncedBlockRenderer.d.ts +0 -38
  38. package/dist/types-ts4.5/syncedBlockRenderer.d.ts +0 -38
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-synced-block-renderer
2
2
 
3
+ ## 2.2.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`f282b1ca41f1c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f282b1ca41f1c) -
8
+ EDITOR-1648 refactor of sync block error types
9
+ - Updated dependencies
10
+
11
+ ## 2.2.4
12
+
13
+ ### Patch Changes
14
+
15
+ - [`021d07c1b2d61`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/021d07c1b2d61) -
16
+ Minor refactor of editor-synced-block-renderer
17
+
3
18
  ## 2.2.3
4
19
 
5
20
  ### Patch Changes
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.getSyncedBlockNodeComponent = void 0;
8
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
+ var _SyncedBlockNodeComponentRenderer = require("./ui/SyncedBlockNodeComponentRenderer");
10
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
11
+ 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) { (0, _defineProperty2.default)(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; }
12
+ var getSyncedBlockNodeComponent = exports.getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(dataProvider, doc) {
13
+ var content = doc.content;
14
+ var isEmpty = !content || !Array.isArray(content) || content.length === 0;
15
+ var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
16
+ return node.type === 'syncBlock';
17
+ });
18
+ var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
19
+ return function (props) {
20
+ return (0, _SyncedBlockNodeComponentRenderer.SyncedBlockNodeComponentRenderer)(_objectSpread(_objectSpread({}, props), {}, {
21
+ dataPromise: dataPromise
22
+ }));
23
+ };
24
+ };
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.getSyncedBlockRenderer = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _SyncedBlockRenderer = require("./ui/SyncedBlockRenderer");
10
+ var getSyncedBlockRenderer = exports.getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
11
+ return /*#__PURE__*/_react.default.createElement(_SyncedBlockRenderer.SyncedBlockRenderer, {
12
+ useFetchSyncBlockData: props.useFetchSyncBlockData
13
+ });
14
+ };
package/dist/cjs/index.js CHANGED
@@ -3,16 +3,17 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- Object.defineProperty(exports, "getSyncBlockNodeComponent", {
6
+ Object.defineProperty(exports, "getSyncedBlockNodeComponent", {
7
7
  enumerable: true,
8
8
  get: function get() {
9
- return _syncedBlockRenderer.getSyncBlockNodeComponent;
9
+ return _getSyncedBlockNodeComponent.getSyncedBlockNodeComponent;
10
10
  }
11
11
  });
12
12
  Object.defineProperty(exports, "getSyncedBlockRenderer", {
13
13
  enumerable: true,
14
14
  get: function get() {
15
- return _syncedBlockRenderer.getSyncedBlockRenderer;
15
+ return _getSyncedBlockRenderer.getSyncedBlockRenderer;
16
16
  }
17
17
  });
18
- var _syncedBlockRenderer = require("./syncedBlockRenderer");
18
+ var _getSyncedBlockNodeComponent = require("./getSyncedBlockNodeComponent");
19
+ var _getSyncedBlockRenderer = require("./getSyncedBlockRenderer");
@@ -8,13 +8,13 @@ exports.SyncedBlockErrorComponent = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
10
10
  var SyncedBlockErrorComponent = exports.SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref) {
11
- var status = _ref.status;
12
- switch (status) {
13
- case _editorSyncedBlockProvider.SyncBlockStatus.Unauthorized:
11
+ var error = _ref.error;
12
+ switch (error) {
13
+ case _editorSyncedBlockProvider.SyncBlockError.Forbidden:
14
14
  return /*#__PURE__*/_react.default.createElement("div", null, "You don't have permission to view this sync block");
15
- case _editorSyncedBlockProvider.SyncBlockStatus.NotFound:
15
+ case _editorSyncedBlockProvider.SyncBlockError.NotFound:
16
16
  return /*#__PURE__*/_react.default.createElement("div", null, "Sync Block Not Found");
17
- case _editorSyncedBlockProvider.SyncBlockStatus.Errored:
17
+ case _editorSyncedBlockProvider.SyncBlockError.Errored:
18
18
  default:
19
19
  return /*#__PURE__*/_react.default.createElement("div", null, "Something went wrong");
20
20
  }
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.SyncedBlockNodeComponentRenderer = void 0;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
+ var _react = _interopRequireWildcard(require("react"));
11
+ var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
12
+ var _renderer = require("@atlaskit/renderer");
13
+ var _actions = require("@atlaskit/renderer/actions");
14
+ var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
15
+ var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
16
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
17
+ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(props) {
18
+ var _useState = (0, _react.useState)(null),
19
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
20
+ data = _useState2[0],
21
+ setData = _useState2[1];
22
+ (0, _react.useEffect)(function () {
23
+ if (!props.dataPromise) {
24
+ return;
25
+ }
26
+ if (data) {
27
+ return;
28
+ }
29
+ props.dataPromise.then(function (data) {
30
+ setData(data);
31
+ });
32
+ }, [props.dataPromise, data]);
33
+ if (!data) {
34
+ return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
35
+ }
36
+ var fetchResult = data.find(function (item) {
37
+ return item.resourceId === props.resourceId;
38
+ });
39
+ if (fetchResult !== null && fetchResult !== void 0 && fetchResult.error || !(fetchResult !== null && fetchResult !== void 0 && fetchResult.data)) {
40
+ var _fetchResult$error;
41
+ return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
42
+ error: (_fetchResult$error = fetchResult === null || fetchResult === void 0 ? void 0 : fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : _editorSyncedBlockProvider.SyncBlockError.Errored
43
+ });
44
+ }
45
+ var syncBlockDoc = {
46
+ content: fetchResult.data.content,
47
+ version: 1,
48
+ type: 'doc'
49
+ };
50
+ return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
51
+ "data-sync-block": true,
52
+ "data-testid": "sync-block-renderer-wrapper",
53
+ "data-resource-id": props.resourceId,
54
+ "data-local-id": props.localId
55
+ }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
56
+ appearance: "full-width",
57
+ adfStage: "stage0",
58
+ document: syncBlockDoc,
59
+ disableHeadingIDs: true,
60
+ dataProviders: props.providers
61
+ })));
62
+ };
@@ -0,0 +1,41 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.SyncedBlockRenderer = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
10
+ var _renderer = require("@atlaskit/renderer");
11
+ var _actions = require("@atlaskit/renderer/actions");
12
+ var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
13
+ var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
14
+ var SyncedBlockRenderer = exports.SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
15
+ var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
16
+ dataProviders = _ref.dataProviders;
17
+ var fetchResult = useFetchSyncBlockData();
18
+ if (!fetchResult) {
19
+ return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
20
+ }
21
+ if (fetchResult.error || !fetchResult.data) {
22
+ var _fetchResult$error;
23
+ return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
24
+ error: (_fetchResult$error = fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : _editorSyncedBlockProvider.SyncBlockError.Errored
25
+ });
26
+ }
27
+ var syncBlockDoc = {
28
+ content: fetchResult.data.content,
29
+ version: 1,
30
+ type: 'doc'
31
+ };
32
+ return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
33
+ "data-testid": "sync-block-renderer-wrapper"
34
+ }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
35
+ appearance: "full-width",
36
+ adfStage: "stage0",
37
+ document: syncBlockDoc,
38
+ disableHeadingIDs: true,
39
+ dataProviders: dataProviders
40
+ })));
41
+ };
@@ -0,0 +1,13 @@
1
+ import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
2
+ export const getSyncedBlockNodeComponent = (dataProvider, doc) => {
3
+ const {
4
+ content
5
+ } = doc;
6
+ const isEmpty = !content || !Array.isArray(content) || content.length === 0;
7
+ const syncBlockNodes = isEmpty ? [] : content.filter(node => node.type === 'syncBlock');
8
+ const dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
9
+ return props => SyncedBlockNodeComponentRenderer({
10
+ ...props,
11
+ dataPromise
12
+ });
13
+ };
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
3
+ export const getSyncedBlockRenderer = props => {
4
+ return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
5
+ useFetchSyncBlockData: props.useFetchSyncBlockData
6
+ });
7
+ };
@@ -1,2 +1,3 @@
1
- // eslint-disable-next-line @atlaskit/editor/no-re-export
2
- export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
1
+ /* eslint-disable @atlaskit/editor/no-re-export */
2
+ export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
3
+ export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
@@ -1,14 +1,14 @@
1
1
  import React from 'react';
2
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
3
  export const SyncedBlockErrorComponent = ({
4
- status
4
+ error
5
5
  }) => {
6
- switch (status) {
7
- case SyncBlockStatus.Unauthorized:
6
+ switch (error) {
7
+ case SyncBlockError.Forbidden:
8
8
  return /*#__PURE__*/React.createElement("div", null, "You don't have permission to view this sync block");
9
- case SyncBlockStatus.NotFound:
9
+ case SyncBlockError.NotFound:
10
10
  return /*#__PURE__*/React.createElement("div", null, "Sync Block Not Found");
11
- case SyncBlockStatus.Errored:
11
+ case SyncBlockError.Errored:
12
12
  default:
13
13
  return /*#__PURE__*/React.createElement("div", null, "Something went wrong");
14
14
  }
@@ -0,0 +1,47 @@
1
+ import React, { useEffect, useState } from 'react';
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
+ import { ReactRenderer } from '@atlaskit/renderer';
4
+ import { RendererActionsContext } from '@atlaskit/renderer/actions';
5
+ import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
6
+ import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
7
+ export const SyncedBlockNodeComponentRenderer = props => {
8
+ const [data, setData] = useState(null);
9
+ useEffect(() => {
10
+ if (!props.dataPromise) {
11
+ return;
12
+ }
13
+ if (data) {
14
+ return;
15
+ }
16
+ props.dataPromise.then(data => {
17
+ setData(data);
18
+ });
19
+ }, [props.dataPromise, data]);
20
+ if (!data) {
21
+ return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
22
+ }
23
+ const fetchResult = data.find(item => item.resourceId === props.resourceId);
24
+ if (fetchResult !== null && fetchResult !== void 0 && fetchResult.error || !(fetchResult !== null && fetchResult !== void 0 && fetchResult.data)) {
25
+ var _fetchResult$error;
26
+ return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
27
+ error: (_fetchResult$error = fetchResult === null || fetchResult === void 0 ? void 0 : fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : SyncBlockError.Errored
28
+ });
29
+ }
30
+ const syncBlockDoc = {
31
+ content: fetchResult.data.content,
32
+ version: 1,
33
+ type: 'doc'
34
+ };
35
+ return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
36
+ "data-sync-block": true,
37
+ "data-testid": "sync-block-renderer-wrapper",
38
+ "data-resource-id": props.resourceId,
39
+ "data-local-id": props.localId
40
+ }, /*#__PURE__*/React.createElement(ReactRenderer, {
41
+ appearance: "full-width",
42
+ adfStage: "stage0",
43
+ document: syncBlockDoc,
44
+ disableHeadingIDs: true,
45
+ dataProviders: props.providers
46
+ })));
47
+ };
@@ -0,0 +1,35 @@
1
+ import React from 'react';
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
+ import { ReactRenderer } from '@atlaskit/renderer';
4
+ import { RendererActionsContext } from '@atlaskit/renderer/actions';
5
+ import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
6
+ import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
7
+ export const SyncedBlockRenderer = ({
8
+ useFetchSyncBlockData,
9
+ dataProviders
10
+ }) => {
11
+ const fetchResult = useFetchSyncBlockData();
12
+ if (!fetchResult) {
13
+ return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
14
+ }
15
+ if (fetchResult.error || !fetchResult.data) {
16
+ var _fetchResult$error;
17
+ return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
18
+ error: (_fetchResult$error = fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : SyncBlockError.Errored
19
+ });
20
+ }
21
+ const syncBlockDoc = {
22
+ content: fetchResult.data.content,
23
+ version: 1,
24
+ type: 'doc'
25
+ };
26
+ return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
27
+ "data-testid": "sync-block-renderer-wrapper"
28
+ }, /*#__PURE__*/React.createElement(ReactRenderer, {
29
+ appearance: "full-width",
30
+ adfStage: "stage0",
31
+ document: syncBlockDoc,
32
+ disableHeadingIDs: true,
33
+ dataProviders: dataProviders
34
+ })));
35
+ };
@@ -0,0 +1,17 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ 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; }
4
+ import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
5
+ export var getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(dataProvider, doc) {
6
+ var content = doc.content;
7
+ var isEmpty = !content || !Array.isArray(content) || content.length === 0;
8
+ var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
9
+ return node.type === 'syncBlock';
10
+ });
11
+ var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
12
+ return function (props) {
13
+ return SyncedBlockNodeComponentRenderer(_objectSpread(_objectSpread({}, props), {}, {
14
+ dataPromise: dataPromise
15
+ }));
16
+ };
17
+ };
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
3
+ export var getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
4
+ return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
5
+ useFetchSyncBlockData: props.useFetchSyncBlockData
6
+ });
7
+ };
package/dist/esm/index.js CHANGED
@@ -1,2 +1,3 @@
1
- // eslint-disable-next-line @atlaskit/editor/no-re-export
2
- export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
1
+ /* eslint-disable @atlaskit/editor/no-re-export */
2
+ export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
3
+ export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
@@ -1,13 +1,13 @@
1
1
  import React from 'react';
2
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
3
  export var SyncedBlockErrorComponent = function SyncedBlockErrorComponent(_ref) {
4
- var status = _ref.status;
5
- switch (status) {
6
- case SyncBlockStatus.Unauthorized:
4
+ var error = _ref.error;
5
+ switch (error) {
6
+ case SyncBlockError.Forbidden:
7
7
  return /*#__PURE__*/React.createElement("div", null, "You don't have permission to view this sync block");
8
- case SyncBlockStatus.NotFound:
8
+ case SyncBlockError.NotFound:
9
9
  return /*#__PURE__*/React.createElement("div", null, "Sync Block Not Found");
10
- case SyncBlockStatus.Errored:
10
+ case SyncBlockError.Errored:
11
11
  default:
12
12
  return /*#__PURE__*/React.createElement("div", null, "Something went wrong");
13
13
  }
@@ -0,0 +1,53 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
+ import React, { useEffect, useState } from 'react';
3
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
4
+ import { ReactRenderer } from '@atlaskit/renderer';
5
+ import { RendererActionsContext } from '@atlaskit/renderer/actions';
6
+ import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
7
+ import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
8
+ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(props) {
9
+ var _useState = useState(null),
10
+ _useState2 = _slicedToArray(_useState, 2),
11
+ data = _useState2[0],
12
+ setData = _useState2[1];
13
+ useEffect(function () {
14
+ if (!props.dataPromise) {
15
+ return;
16
+ }
17
+ if (data) {
18
+ return;
19
+ }
20
+ props.dataPromise.then(function (data) {
21
+ setData(data);
22
+ });
23
+ }, [props.dataPromise, data]);
24
+ if (!data) {
25
+ return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
26
+ }
27
+ var fetchResult = data.find(function (item) {
28
+ return item.resourceId === props.resourceId;
29
+ });
30
+ if (fetchResult !== null && fetchResult !== void 0 && fetchResult.error || !(fetchResult !== null && fetchResult !== void 0 && fetchResult.data)) {
31
+ var _fetchResult$error;
32
+ return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
33
+ error: (_fetchResult$error = fetchResult === null || fetchResult === void 0 ? void 0 : fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : SyncBlockError.Errored
34
+ });
35
+ }
36
+ var syncBlockDoc = {
37
+ content: fetchResult.data.content,
38
+ version: 1,
39
+ type: 'doc'
40
+ };
41
+ return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
42
+ "data-sync-block": true,
43
+ "data-testid": "sync-block-renderer-wrapper",
44
+ "data-resource-id": props.resourceId,
45
+ "data-local-id": props.localId
46
+ }, /*#__PURE__*/React.createElement(ReactRenderer, {
47
+ appearance: "full-width",
48
+ adfStage: "stage0",
49
+ document: syncBlockDoc,
50
+ disableHeadingIDs: true,
51
+ dataProviders: props.providers
52
+ })));
53
+ };
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
+ import { ReactRenderer } from '@atlaskit/renderer';
4
+ import { RendererActionsContext } from '@atlaskit/renderer/actions';
5
+ import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
6
+ import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
7
+ export var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
8
+ var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
9
+ dataProviders = _ref.dataProviders;
10
+ var fetchResult = useFetchSyncBlockData();
11
+ if (!fetchResult) {
12
+ return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
13
+ }
14
+ if (fetchResult.error || !fetchResult.data) {
15
+ var _fetchResult$error;
16
+ return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
17
+ error: (_fetchResult$error = fetchResult.error) !== null && _fetchResult$error !== void 0 ? _fetchResult$error : SyncBlockError.Errored
18
+ });
19
+ }
20
+ var syncBlockDoc = {
21
+ content: fetchResult.data.content,
22
+ version: 1,
23
+ type: 'doc'
24
+ };
25
+ return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
26
+ "data-testid": "sync-block-renderer-wrapper"
27
+ }, /*#__PURE__*/React.createElement(ReactRenderer, {
28
+ appearance: "full-width",
29
+ adfStage: "stage0",
30
+ document: syncBlockDoc,
31
+ disableHeadingIDs: true,
32
+ dataProviders: dataProviders
33
+ })));
34
+ };
@@ -0,0 +1,5 @@
1
+ import type { DocNode } from '@atlaskit/adf-schema';
2
+ import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
3
+ import type { NodeDataProvider } from '@atlaskit/node-data-provider';
4
+ import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
5
+ export declare const getSyncedBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: SyncedBlockNodeProps) => import("react").JSX.Element;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { type SyncedBlockRendererProps } from './ui/SyncedBlockRenderer';
3
+ export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
@@ -1 +1,2 @@
1
- export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
1
+ export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
2
+ export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
3
- export declare const SyncedBlockErrorComponent: ({ status }: {
4
- status: SyncBlockStatus;
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
+ export declare const SyncedBlockErrorComponent: ({ error }: {
4
+ error: SyncBlockError;
5
5
  }) => React.JSX.Element;
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
3
+ import { type NodeProps } from '@atlaskit/renderer';
4
+ export interface SyncedBlockProps {
5
+ localId?: string;
6
+ resourceId?: string;
7
+ }
8
+ export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
9
+ export declare const SyncedBlockNodeComponentRenderer: (props: SyncedBlockNodeProps & {
10
+ dataPromise: Promise<FetchSyncBlockDataResult[]> | null;
11
+ }) => React.JSX.Element;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
3
+ import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
4
+ export type SyncedBlockRendererProps = {
5
+ dataProviders?: ProviderFactory;
6
+ useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
7
+ };
8
+ export declare const SyncedBlockRenderer: ({ useFetchSyncBlockData, dataProviders, }: SyncedBlockRendererProps) => React.JSX.Element;
@@ -0,0 +1,5 @@
1
+ import type { DocNode } from '@atlaskit/adf-schema';
2
+ import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
3
+ import type { NodeDataProvider } from '@atlaskit/node-data-provider';
4
+ import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
5
+ export declare const getSyncedBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: SyncedBlockNodeProps) => import("react").JSX.Element;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { type SyncedBlockRendererProps } from './ui/SyncedBlockRenderer';
3
+ export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
@@ -1 +1,2 @@
1
- export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
1
+ export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
2
+ export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
3
- export declare const SyncedBlockErrorComponent: ({ status }: {
4
- status: SyncBlockStatus;
2
+ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
3
+ export declare const SyncedBlockErrorComponent: ({ error }: {
4
+ error: SyncBlockError;
5
5
  }) => React.JSX.Element;
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
3
+ import { type NodeProps } from '@atlaskit/renderer';
4
+ export interface SyncedBlockProps {
5
+ localId?: string;
6
+ resourceId?: string;
7
+ }
8
+ export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
9
+ export declare const SyncedBlockNodeComponentRenderer: (props: SyncedBlockNodeProps & {
10
+ dataPromise: Promise<FetchSyncBlockDataResult[]> | null;
11
+ }) => React.JSX.Element;
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
3
+ import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
4
+ export type SyncedBlockRendererProps = {
5
+ dataProviders?: ProviderFactory;
6
+ useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
7
+ };
8
+ export declare const SyncedBlockRenderer: ({ useFetchSyncBlockData, dataProviders, }: SyncedBlockRendererProps) => React.JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-synced-block-renderer",
3
- "version": "2.2.3",
3
+ "version": "2.2.5",
4
4
  "description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -29,7 +29,7 @@
29
29
  "atlaskit:src": "src/index.ts",
30
30
  "dependencies": {
31
31
  "@atlaskit/editor-prosemirror": "7.0.0",
32
- "@atlaskit/editor-synced-block-provider": "^2.1.0",
32
+ "@atlaskit/editor-synced-block-provider": "^2.2.0",
33
33
  "@atlaskit/renderer": "^124.9.0",
34
34
  "@babel/runtime": "^7.0.0"
35
35
  },
@@ -1,35 +0,0 @@
1
- {
2
- "extends": "../../../../tsconfig.entry-points.townsquare.json",
3
- "compilerOptions": {
4
- "target": "es5",
5
- "outDir": "../../../../../townsquare/tsDist/@atlaskit__editor-synced-block-renderer/app",
6
- "rootDir": "../",
7
- "composite": true
8
- },
9
- "include": [
10
- "../src/**/*.ts",
11
- "../src/**/*.tsx"
12
- ],
13
- "exclude": [
14
- "../src/**/__tests__/*",
15
- "../src/**/*.test.*",
16
- "../src/**/test.*",
17
- "../src/**/examples.*",
18
- "../src/**/examples/*",
19
- "../src/**/examples/**/*",
20
- "../src/**/*.stories.*",
21
- "../src/**/stories/*",
22
- "../src/**/stories/**/*"
23
- ],
24
- "references": [
25
- {
26
- "path": "../../editor-synced-block-provider/afm-townsquare/tsconfig.json"
27
- },
28
- {
29
- "path": "../../renderer/afm-townsquare/tsconfig.json"
30
- },
31
- {
32
- "path": "../../editor-common/afm-townsquare/tsconfig.json"
33
- }
34
- ]
35
- }
@@ -1,127 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _typeof = require("@babel/runtime/helpers/typeof");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.getSyncedBlockRenderer = exports.getSyncBlockNodeComponent = void 0;
9
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
11
- var _react = _interopRequireWildcard(require("react"));
12
- var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
13
- var _renderer = require("@atlaskit/renderer");
14
- var _actions = require("@atlaskit/renderer/actions");
15
- var _SyncedBlockErrorComponent = require("./ui/SyncedBlockErrorComponent");
16
- var _SyncedBlockLoadingState = require("./ui/SyncedBlockLoadingState");
17
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
18
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
19
- 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) { (0, _defineProperty2.default)(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; }
20
- var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
21
- var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
22
- dataProviders = _ref.dataProviders;
23
- var fetchResult = useFetchSyncBlockData();
24
- if (!fetchResult) {
25
- return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
26
- }
27
- if ('status' in fetchResult) {
28
- return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
29
- status: fetchResult.status
30
- });
31
- }
32
- var syncBlockData = fetchResult;
33
- var syncBlockDoc = {
34
- content: syncBlockData.content,
35
- version: 1,
36
- type: 'doc'
37
- };
38
- return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
39
- "data-testid": "sync-block-renderer-wrapper"
40
- }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
41
- appearance: "full-width",
42
- adfStage: "stage0",
43
- document: syncBlockDoc,
44
- disableHeadingIDs: true,
45
- dataProviders: dataProviders
46
- })));
47
- };
48
- var getSyncedBlockRenderer = exports.getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
49
- return /*#__PURE__*/_react.default.createElement(SyncedBlockRenderer, {
50
- useFetchSyncBlockData: props.useFetchSyncBlockData
51
- });
52
- };
53
-
54
- /**
55
- * From packages packages/editor/renderer/src/react/types.ts
56
- * Avoid importing from renderer package directly to avoid circular dependency
57
- */
58
-
59
- /**
60
- * This is a subset of the full NodeMeta type defined in renderer package
61
- * packages/editor/renderer/src/react/types.ts
62
- */
63
-
64
- var SyncBlockNodeComponent = function SyncBlockNodeComponent(props) {
65
- var _useState = (0, _react.useState)(null),
66
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
67
- data = _useState2[0],
68
- setData = _useState2[1];
69
- (0, _react.useEffect)(function () {
70
- if (!props.dataPromise) {
71
- return;
72
- }
73
- if (data) {
74
- return;
75
- }
76
- props.dataPromise.then(function (data) {
77
- setData(data);
78
- });
79
- }, [props.dataPromise, data]);
80
- if (!data) {
81
- return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
82
- }
83
- var fetchResult = data.find(function (item) {
84
- return item.resourceId === props.resourceId;
85
- });
86
- if (!fetchResult) {
87
- return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
88
- status: _editorSyncedBlockProvider.SyncBlockStatus.Errored
89
- });
90
- }
91
- if ('status' in fetchResult) {
92
- return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
93
- status: fetchResult.status
94
- });
95
- }
96
- var syncBlockData = fetchResult;
97
- var syncBlockDoc = {
98
- content: syncBlockData.content,
99
- version: 1,
100
- type: 'doc'
101
- };
102
- return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
103
- "data-sync-block": true,
104
- "data-testid": "sync-block-renderer-wrapper",
105
- "data-resource-id": props.resourceId,
106
- "data-local-id": props.localId
107
- }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
108
- appearance: "full-width",
109
- adfStage: "stage0",
110
- document: syncBlockDoc,
111
- disableHeadingIDs: true,
112
- dataProviders: props.providers
113
- })));
114
- };
115
- var getSyncBlockNodeComponent = exports.getSyncBlockNodeComponent = function getSyncBlockNodeComponent(dataProvider, doc) {
116
- var content = doc.content;
117
- var isEmpty = !content || !Array.isArray(content) || content.length === 0;
118
- var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
119
- return node.type === 'syncBlock';
120
- });
121
- var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
122
- return function (props) {
123
- return SyncBlockNodeComponent(_objectSpread(_objectSpread({}, props), {}, {
124
- dataPromise: dataPromise
125
- }));
126
- };
127
- };
@@ -1,109 +0,0 @@
1
- import React, { useEffect, useState } from 'react';
2
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
3
- import { ReactRenderer } from '@atlaskit/renderer';
4
- import { RendererActionsContext } from '@atlaskit/renderer/actions';
5
- import { SyncedBlockErrorComponent } from './ui/SyncedBlockErrorComponent';
6
- import { SyncedBlockLoadingState } from './ui/SyncedBlockLoadingState';
7
- const SyncedBlockRenderer = ({
8
- useFetchSyncBlockData,
9
- dataProviders
10
- }) => {
11
- const fetchResult = useFetchSyncBlockData();
12
- if (!fetchResult) {
13
- return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
14
- }
15
- if ('status' in fetchResult) {
16
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
17
- status: fetchResult.status
18
- });
19
- }
20
- const syncBlockData = fetchResult;
21
- const syncBlockDoc = {
22
- content: syncBlockData.content,
23
- version: 1,
24
- type: 'doc'
25
- };
26
- return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
27
- "data-testid": "sync-block-renderer-wrapper"
28
- }, /*#__PURE__*/React.createElement(ReactRenderer, {
29
- appearance: "full-width",
30
- adfStage: "stage0",
31
- document: syncBlockDoc,
32
- disableHeadingIDs: true,
33
- dataProviders: dataProviders
34
- })));
35
- };
36
- export const getSyncedBlockRenderer = props => {
37
- return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
38
- useFetchSyncBlockData: props.useFetchSyncBlockData
39
- });
40
- };
41
-
42
- /**
43
- * From packages packages/editor/renderer/src/react/types.ts
44
- * Avoid importing from renderer package directly to avoid circular dependency
45
- */
46
-
47
- /**
48
- * This is a subset of the full NodeMeta type defined in renderer package
49
- * packages/editor/renderer/src/react/types.ts
50
- */
51
-
52
- const SyncBlockNodeComponent = props => {
53
- const [data, setData] = useState(null);
54
- useEffect(() => {
55
- if (!props.dataPromise) {
56
- return;
57
- }
58
- if (data) {
59
- return;
60
- }
61
- props.dataPromise.then(data => {
62
- setData(data);
63
- });
64
- }, [props.dataPromise, data]);
65
- if (!data) {
66
- return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
67
- }
68
- const fetchResult = data.find(item => item.resourceId === props.resourceId);
69
- if (!fetchResult) {
70
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
71
- status: SyncBlockStatus.Errored
72
- });
73
- }
74
- if ('status' in fetchResult) {
75
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
76
- status: fetchResult.status
77
- });
78
- }
79
- const syncBlockData = fetchResult;
80
- const syncBlockDoc = {
81
- content: syncBlockData.content,
82
- version: 1,
83
- type: 'doc'
84
- };
85
- return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
86
- "data-sync-block": true,
87
- "data-testid": "sync-block-renderer-wrapper",
88
- "data-resource-id": props.resourceId,
89
- "data-local-id": props.localId
90
- }, /*#__PURE__*/React.createElement(ReactRenderer, {
91
- appearance: "full-width",
92
- adfStage: "stage0",
93
- document: syncBlockDoc,
94
- disableHeadingIDs: true,
95
- dataProviders: props.providers
96
- })));
97
- };
98
- export const getSyncBlockNodeComponent = (dataProvider, doc) => {
99
- const {
100
- content
101
- } = doc;
102
- const isEmpty = !content || !Array.isArray(content) || content.length === 0;
103
- const syncBlockNodes = isEmpty ? [] : content.filter(node => node.type === 'syncBlock');
104
- const dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
105
- return props => SyncBlockNodeComponent({
106
- ...props,
107
- dataPromise
108
- });
109
- };
@@ -1,118 +0,0 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
4
- 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; }
5
- import React, { useEffect, useState } from 'react';
6
- import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
7
- import { ReactRenderer } from '@atlaskit/renderer';
8
- import { RendererActionsContext } from '@atlaskit/renderer/actions';
9
- import { SyncedBlockErrorComponent } from './ui/SyncedBlockErrorComponent';
10
- import { SyncedBlockLoadingState } from './ui/SyncedBlockLoadingState';
11
- var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
12
- var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
13
- dataProviders = _ref.dataProviders;
14
- var fetchResult = useFetchSyncBlockData();
15
- if (!fetchResult) {
16
- return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
17
- }
18
- if ('status' in fetchResult) {
19
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
20
- status: fetchResult.status
21
- });
22
- }
23
- var syncBlockData = fetchResult;
24
- var syncBlockDoc = {
25
- content: syncBlockData.content,
26
- version: 1,
27
- type: 'doc'
28
- };
29
- return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
30
- "data-testid": "sync-block-renderer-wrapper"
31
- }, /*#__PURE__*/React.createElement(ReactRenderer, {
32
- appearance: "full-width",
33
- adfStage: "stage0",
34
- document: syncBlockDoc,
35
- disableHeadingIDs: true,
36
- dataProviders: dataProviders
37
- })));
38
- };
39
- export var getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
40
- return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
41
- useFetchSyncBlockData: props.useFetchSyncBlockData
42
- });
43
- };
44
-
45
- /**
46
- * From packages packages/editor/renderer/src/react/types.ts
47
- * Avoid importing from renderer package directly to avoid circular dependency
48
- */
49
-
50
- /**
51
- * This is a subset of the full NodeMeta type defined in renderer package
52
- * packages/editor/renderer/src/react/types.ts
53
- */
54
-
55
- var SyncBlockNodeComponent = function SyncBlockNodeComponent(props) {
56
- var _useState = useState(null),
57
- _useState2 = _slicedToArray(_useState, 2),
58
- data = _useState2[0],
59
- setData = _useState2[1];
60
- useEffect(function () {
61
- if (!props.dataPromise) {
62
- return;
63
- }
64
- if (data) {
65
- return;
66
- }
67
- props.dataPromise.then(function (data) {
68
- setData(data);
69
- });
70
- }, [props.dataPromise, data]);
71
- if (!data) {
72
- return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
73
- }
74
- var fetchResult = data.find(function (item) {
75
- return item.resourceId === props.resourceId;
76
- });
77
- if (!fetchResult) {
78
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
79
- status: SyncBlockStatus.Errored
80
- });
81
- }
82
- if ('status' in fetchResult) {
83
- return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
84
- status: fetchResult.status
85
- });
86
- }
87
- var syncBlockData = fetchResult;
88
- var syncBlockDoc = {
89
- content: syncBlockData.content,
90
- version: 1,
91
- type: 'doc'
92
- };
93
- return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
94
- "data-sync-block": true,
95
- "data-testid": "sync-block-renderer-wrapper",
96
- "data-resource-id": props.resourceId,
97
- "data-local-id": props.localId
98
- }, /*#__PURE__*/React.createElement(ReactRenderer, {
99
- appearance: "full-width",
100
- adfStage: "stage0",
101
- document: syncBlockDoc,
102
- disableHeadingIDs: true,
103
- dataProviders: props.providers
104
- })));
105
- };
106
- export var getSyncBlockNodeComponent = function getSyncBlockNodeComponent(dataProvider, doc) {
107
- var content = doc.content;
108
- var isEmpty = !content || !Array.isArray(content) || content.length === 0;
109
- var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
110
- return node.type === 'syncBlock';
111
- });
112
- var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
113
- return function (props) {
114
- return SyncBlockNodeComponent(_objectSpread(_objectSpread({}, props), {}, {
115
- dataPromise: dataPromise
116
- }));
117
- };
118
- };
@@ -1,38 +0,0 @@
1
- import React from 'react';
2
- import type { DocNode } from '@atlaskit/adf-schema';
3
- import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
4
- import type { NodeType, Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
5
- import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
6
- import type { NodeDataProvider } from '@atlaskit/node-data-provider';
7
- export type SyncedBlockRendererProps = {
8
- dataProviders?: ProviderFactory;
9
- useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
10
- };
11
- export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
12
- /**
13
- * From packages packages/editor/renderer/src/react/types.ts
14
- * Avoid importing from renderer package directly to avoid circular dependency
15
- */
16
- export interface RendererContext {
17
- adDoc?: any;
18
- containerAri?: string;
19
- objectAri?: string;
20
- schema?: Schema;
21
- }
22
- /**
23
- * This is a subset of the full NodeMeta type defined in renderer package
24
- * packages/editor/renderer/src/react/types.ts
25
- */
26
- export interface NodeMeta {
27
- dataAttributes: {
28
- 'data-renderer-start-pos': number;
29
- };
30
- localId?: string;
31
- marks: PMNode['marks'];
32
- nodeType: NodeType['name'];
33
- portal?: HTMLElement | undefined;
34
- providers?: ProviderFactory | undefined;
35
- rendererContext?: RendererContext;
36
- resourceId?: string;
37
- }
38
- export declare const getSyncBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: NodeMeta) => React.JSX.Element;
@@ -1,38 +0,0 @@
1
- import React from 'react';
2
- import type { DocNode } from '@atlaskit/adf-schema';
3
- import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
4
- import type { NodeType, Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
5
- import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
6
- import type { NodeDataProvider } from '@atlaskit/node-data-provider';
7
- export type SyncedBlockRendererProps = {
8
- dataProviders?: ProviderFactory;
9
- useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
10
- };
11
- export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
12
- /**
13
- * From packages packages/editor/renderer/src/react/types.ts
14
- * Avoid importing from renderer package directly to avoid circular dependency
15
- */
16
- export interface RendererContext {
17
- adDoc?: any;
18
- containerAri?: string;
19
- objectAri?: string;
20
- schema?: Schema;
21
- }
22
- /**
23
- * This is a subset of the full NodeMeta type defined in renderer package
24
- * packages/editor/renderer/src/react/types.ts
25
- */
26
- export interface NodeMeta {
27
- dataAttributes: {
28
- 'data-renderer-start-pos': number;
29
- };
30
- localId?: string;
31
- marks: PMNode['marks'];
32
- nodeType: NodeType['name'];
33
- portal?: HTMLElement | undefined;
34
- providers?: ProviderFactory | undefined;
35
- rendererContext?: RendererContext;
36
- resourceId?: string;
37
- }
38
- export declare const getSyncBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: NodeMeta) => React.JSX.Element;