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

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/editor-synced-block-renderer
 
+## 2.2.4
+
+### Patch Changes
+
+- [`021d07c1b2d61`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/021d07c1b2d61) -
+  Minor refactor of editor-synced-block-renderer
+
 ## 2.2.3
 
 ### Patch Changes

package/dist/cjs/getSyncedBlockNodeComponent.js

@@ -0,0 +1,24 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSyncedBlockNodeComponent = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _SyncedBlockNodeComponentRenderer = require("./ui/SyncedBlockNodeComponentRenderer");
+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; }
+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; }
+var getSyncedBlockNodeComponent = exports.getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(dataProvider, doc) {
+  var content = doc.content;
+  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
+    return node.type === 'syncBlock';
+  });
+  var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
+  return function (props) {
+    return (0, _SyncedBlockNodeComponentRenderer.SyncedBlockNodeComponentRenderer)(_objectSpread(_objectSpread({}, props), {}, {
+      dataPromise: dataPromise
+    }));
+  };
+};

package/dist/cjs/getSyncedBlockRenderer.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSyncedBlockRenderer = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _SyncedBlockRenderer = require("./ui/SyncedBlockRenderer");
+var getSyncedBlockRenderer = exports.getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
+  return /*#__PURE__*/_react.default.createElement(_SyncedBlockRenderer.SyncedBlockRenderer, {
+    useFetchSyncBlockData: props.useFetchSyncBlockData
+  });
+};

package/dist/cjs/index.js

@@ -3,16 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "getSyncBlockNodeComponent", {
+Object.defineProperty(exports, "getSyncedBlockNodeComponent", {
   enumerable: true,
   get: function get() {
-    return _syncedBlockRenderer.getSyncBlockNodeComponent;
+    return _getSyncedBlockNodeComponent.getSyncedBlockNodeComponent;
   }
 });
 Object.defineProperty(exports, "getSyncedBlockRenderer", {
   enumerable: true,
   get: function get() {
-    return _syncedBlockRenderer.getSyncedBlockRenderer;
+    return _getSyncedBlockRenderer.getSyncedBlockRenderer;
   }
 });
-var _syncedBlockRenderer = require("./syncedBlockRenderer");
+var _getSyncedBlockNodeComponent = require("./getSyncedBlockNodeComponent");
+var _getSyncedBlockRenderer = require("./getSyncedBlockRenderer");

package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SyncedBlockNodeComponentRenderer = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
+var _renderer = require("@atlaskit/renderer");
+var _actions = require("@atlaskit/renderer/actions");
+var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
+var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
+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); }
+var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(props) {
+  var _useState = (0, _react.useState)(null),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    data = _useState2[0],
+    setData = _useState2[1];
+  (0, _react.useEffect)(function () {
+    if (!props.dataPromise) {
+      return;
+    }
+    if (data) {
+      return;
+    }
+    props.dataPromise.then(function (data) {
+      setData(data);
+    });
+  }, [props.dataPromise, data]);
+  if (!data) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
+  }
+  var fetchResult = data.find(function (item) {
+    return item.resourceId === props.resourceId;
+  });
+  if (!fetchResult) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
+      status: _editorSyncedBlockProvider.SyncBlockStatus.Errored
+    });
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  var syncBlockData = fetchResult;
+  var syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
+    "data-sync-block": true,
+    "data-testid": "sync-block-renderer-wrapper",
+    "data-resource-id": props.resourceId,
+    "data-local-id": props.localId
+  }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: props.providers
+  })));
+};

package/dist/cjs/ui/SyncedBlockRenderer.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SyncedBlockRenderer = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _renderer = require("@atlaskit/renderer");
+var _actions = require("@atlaskit/renderer/actions");
+var _SyncedBlockErrorComponent = require("./SyncedBlockErrorComponent");
+var _SyncedBlockLoadingState = require("./SyncedBlockLoadingState");
+var SyncedBlockRenderer = exports.SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
+  var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
+    dataProviders = _ref.dataProviders;
+  var fetchResult = useFetchSyncBlockData();
+  if (!fetchResult) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  var syncBlockData = fetchResult;
+  var syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
+    "data-testid": "sync-block-renderer-wrapper"
+  }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: dataProviders
+  })));
+};

package/dist/es2019/getSyncedBlockNodeComponent.js

@@ -0,0 +1,13 @@
+import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
+export const getSyncedBlockNodeComponent = (dataProvider, doc) => {
+  const {
+    content
+  } = doc;
+  const isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  const syncBlockNodes = isEmpty ? [] : content.filter(node => node.type === 'syncBlock');
+  const dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
+  return props => SyncedBlockNodeComponentRenderer({
+    ...props,
+    dataPromise
+  });
+};

package/dist/es2019/getSyncedBlockRenderer.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
+export const getSyncedBlockRenderer = props => {
+  return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
+    useFetchSyncBlockData: props.useFetchSyncBlockData
+  });
+};

package/dist/es2019/index.js

@@ -1,2 +1,3 @@
-// eslint-disable-next-line @atlaskit/editor/no-re-export
-export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js

@@ -0,0 +1,52 @@
+import React, { useEffect, useState } from 'react';
+import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
+import { ReactRenderer } from '@atlaskit/renderer';
+import { RendererActionsContext } from '@atlaskit/renderer/actions';
+import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
+import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
+export const SyncedBlockNodeComponentRenderer = props => {
+  const [data, setData] = useState(null);
+  useEffect(() => {
+    if (!props.dataPromise) {
+      return;
+    }
+    if (data) {
+      return;
+    }
+    props.dataPromise.then(data => {
+      setData(data);
+    });
+  }, [props.dataPromise, data]);
+  if (!data) {
+    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
+  }
+  const fetchResult = data.find(item => item.resourceId === props.resourceId);
+  if (!fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: SyncBlockStatus.Errored
+    });
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  const syncBlockData = fetchResult;
+  const syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
+    "data-sync-block": true,
+    "data-testid": "sync-block-renderer-wrapper",
+    "data-resource-id": props.resourceId,
+    "data-local-id": props.localId
+  }, /*#__PURE__*/React.createElement(ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: props.providers
+  })));
+};

package/dist/es2019/ui/SyncedBlockRenderer.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { ReactRenderer } from '@atlaskit/renderer';
+import { RendererActionsContext } from '@atlaskit/renderer/actions';
+import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
+import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
+export const SyncedBlockRenderer = ({
+  useFetchSyncBlockData,
+  dataProviders
+}) => {
+  const fetchResult = useFetchSyncBlockData();
+  if (!fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  const syncBlockData = fetchResult;
+  const syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
+    "data-testid": "sync-block-renderer-wrapper"
+  }, /*#__PURE__*/React.createElement(ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: dataProviders
+  })));
+};

package/dist/esm/getSyncedBlockNodeComponent.js

@@ -0,0 +1,17 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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; }
+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; }
+import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
+export var getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(dataProvider, doc) {
+  var content = doc.content;
+  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
+    return node.type === 'syncBlock';
+  });
+  var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
+  return function (props) {
+    return SyncedBlockNodeComponentRenderer(_objectSpread(_objectSpread({}, props), {}, {
+      dataPromise: dataPromise
+    }));
+  };
+};

package/dist/esm/getSyncedBlockRenderer.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { SyncedBlockRenderer } from './ui/SyncedBlockRenderer';
+export var getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
+  return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
+    useFetchSyncBlockData: props.useFetchSyncBlockData
+  });
+};

package/dist/esm/index.js

@@ -1,2 +1,3 @@
-// eslint-disable-next-line @atlaskit/editor/no-re-export
-export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js

@@ -0,0 +1,58 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useEffect, useState } from 'react';
+import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
+import { ReactRenderer } from '@atlaskit/renderer';
+import { RendererActionsContext } from '@atlaskit/renderer/actions';
+import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
+import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
+export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentRenderer(props) {
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    data = _useState2[0],
+    setData = _useState2[1];
+  useEffect(function () {
+    if (!props.dataPromise) {
+      return;
+    }
+    if (data) {
+      return;
+    }
+    props.dataPromise.then(function (data) {
+      setData(data);
+    });
+  }, [props.dataPromise, data]);
+  if (!data) {
+    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
+  }
+  var fetchResult = data.find(function (item) {
+    return item.resourceId === props.resourceId;
+  });
+  if (!fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: SyncBlockStatus.Errored
+    });
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  var syncBlockData = fetchResult;
+  var syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
+    "data-sync-block": true,
+    "data-testid": "sync-block-renderer-wrapper",
+    "data-resource-id": props.resourceId,
+    "data-local-id": props.localId
+  }, /*#__PURE__*/React.createElement(ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: props.providers
+  })));
+};

package/dist/esm/ui/SyncedBlockRenderer.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { ReactRenderer } from '@atlaskit/renderer';
+import { RendererActionsContext } from '@atlaskit/renderer/actions';
+import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
+import { SyncedBlockLoadingState } from './SyncedBlockLoadingState';
+export var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
+  var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
+    dataProviders = _ref.dataProviders;
+  var fetchResult = useFetchSyncBlockData();
+  if (!fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
+  }
+  if ('status' in fetchResult) {
+    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
+      status: fetchResult.status
+    });
+  }
+  var syncBlockData = fetchResult;
+  var syncBlockDoc = {
+    content: syncBlockData.content,
+    version: 1,
+    type: 'doc'
+  };
+  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
+    "data-testid": "sync-block-renderer-wrapper"
+  }, /*#__PURE__*/React.createElement(ReactRenderer, {
+    appearance: "full-width",
+    adfStage: "stage0",
+    document: syncBlockDoc,
+    disableHeadingIDs: true,
+    dataProviders: dataProviders
+  })));
+};

package/dist/types/getSyncedBlockNodeComponent.d.ts

@@ -0,0 +1,5 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+import type { NodeDataProvider } from '@atlaskit/node-data-provider';
+import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
+export declare const getSyncedBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: SyncedBlockNodeProps) => import("react").JSX.Element;

package/dist/types/getSyncedBlockRenderer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { type SyncedBlockRendererProps } from './ui/SyncedBlockRenderer';
+export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;

package/dist/types/index.d.ts

@@ -1 +1,2 @@
-export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
+export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/types/ui/SyncedBlockNodeComponentRenderer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+import { type NodeProps } from '@atlaskit/renderer';
+export interface SyncedBlockProps {
+    localId?: string;
+    resourceId?: string;
+}
+export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
+export declare const SyncedBlockNodeComponentRenderer: (props: SyncedBlockNodeProps & {
+    dataPromise: Promise<FetchSyncBlockDataResult[]> | null;
+}) => React.JSX.Element;

package/dist/types/ui/SyncedBlockRenderer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+export type SyncedBlockRendererProps = {
+    dataProviders?: ProviderFactory;
+    useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
+};
+export declare const SyncedBlockRenderer: ({ useFetchSyncBlockData, dataProviders, }: SyncedBlockRendererProps) => React.JSX.Element;

package/dist/types-ts4.5/getSyncedBlockNodeComponent.d.ts

@@ -0,0 +1,5 @@
+import type { DocNode } from '@atlaskit/adf-schema';
+import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+import type { NodeDataProvider } from '@atlaskit/node-data-provider';
+import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
+export declare const getSyncedBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: SyncedBlockNodeProps) => import("react").JSX.Element;

package/dist/types-ts4.5/getSyncedBlockRenderer.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { type SyncedBlockRendererProps } from './ui/SyncedBlockRenderer';
+export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;

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

@@ -1 +1,2 @@
-export { getSyncBlockNodeComponent, getSyncedBlockRenderer } from './syncedBlockRenderer';
+export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/types-ts4.5/ui/SyncedBlockNodeComponentRenderer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+import { type NodeProps } from '@atlaskit/renderer';
+export interface SyncedBlockProps {
+    localId?: string;
+    resourceId?: string;
+}
+export type SyncedBlockNodeProps = NodeProps<SyncedBlockProps>;
+export declare const SyncedBlockNodeComponentRenderer: (props: SyncedBlockNodeProps & {
+    dataPromise: Promise<FetchSyncBlockDataResult[]> | null;
+}) => React.JSX.Element;

package/dist/types-ts4.5/ui/SyncedBlockRenderer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
+export type SyncedBlockRendererProps = {
+    dataProviders?: ProviderFactory;
+    useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
+};
+export declare const SyncedBlockRenderer: ({ useFetchSyncBlockData, dataProviders, }: SyncedBlockRendererProps) => React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-synced-block-renderer",
-	"version": "2.2.3",
+	"version": "2.2.4",
 	"description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",

package/dist/cjs/syncedBlockRenderer.js

@@ -1,127 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getSyncedBlockRenderer = exports.getSyncBlockNodeComponent = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
-var _renderer = require("@atlaskit/renderer");
-var _actions = require("@atlaskit/renderer/actions");
-var _SyncedBlockErrorComponent = require("./ui/SyncedBlockErrorComponent");
-var _SyncedBlockLoadingState = require("./ui/SyncedBlockLoadingState");
-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); }
-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; }
-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; }
-var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
-  var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
-    dataProviders = _ref.dataProviders;
-  var fetchResult = useFetchSyncBlockData();
-  if (!fetchResult) {
-    return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  var syncBlockData = fetchResult;
-  var syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": "sync-block-renderer-wrapper"
-  }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: dataProviders
-  })));
-};
-var getSyncedBlockRenderer = exports.getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
-  return /*#__PURE__*/_react.default.createElement(SyncedBlockRenderer, {
-    useFetchSyncBlockData: props.useFetchSyncBlockData
-  });
-};
-
-/**
- * From packages packages/editor/renderer/src/react/types.ts
- * Avoid importing from renderer package directly to avoid circular dependency
- */
-
-/**
- * This is a subset of the full NodeMeta type defined in renderer package
- * packages/editor/renderer/src/react/types.ts
- */
-
-var SyncBlockNodeComponent = function SyncBlockNodeComponent(props) {
-  var _useState = (0, _react.useState)(null),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    data = _useState2[0],
-    setData = _useState2[1];
-  (0, _react.useEffect)(function () {
-    if (!props.dataPromise) {
-      return;
-    }
-    if (data) {
-      return;
-    }
-    props.dataPromise.then(function (data) {
-      setData(data);
-    });
-  }, [props.dataPromise, data]);
-  if (!data) {
-    return /*#__PURE__*/_react.default.createElement(_SyncedBlockLoadingState.SyncedBlockLoadingState, null);
-  }
-  var fetchResult = data.find(function (item) {
-    return item.resourceId === props.resourceId;
-  });
-  if (!fetchResult) {
-    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
-      status: _editorSyncedBlockProvider.SyncBlockStatus.Errored
-    });
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/_react.default.createElement(_SyncedBlockErrorComponent.SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  var syncBlockData = fetchResult;
-  var syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/_react.default.createElement(_actions.RendererActionsContext, null, /*#__PURE__*/_react.default.createElement("div", {
-    "data-sync-block": true,
-    "data-testid": "sync-block-renderer-wrapper",
-    "data-resource-id": props.resourceId,
-    "data-local-id": props.localId
-  }, /*#__PURE__*/_react.default.createElement(_renderer.ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: props.providers
-  })));
-};
-var getSyncBlockNodeComponent = exports.getSyncBlockNodeComponent = function getSyncBlockNodeComponent(dataProvider, doc) {
-  var content = doc.content;
-  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
-    return node.type === 'syncBlock';
-  });
-  var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
-  return function (props) {
-    return SyncBlockNodeComponent(_objectSpread(_objectSpread({}, props), {}, {
-      dataPromise: dataPromise
-    }));
-  };
-};

package/dist/es2019/syncedBlockRenderer.js

@@ -1,109 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
-import { ReactRenderer } from '@atlaskit/renderer';
-import { RendererActionsContext } from '@atlaskit/renderer/actions';
-import { SyncedBlockErrorComponent } from './ui/SyncedBlockErrorComponent';
-import { SyncedBlockLoadingState } from './ui/SyncedBlockLoadingState';
-const SyncedBlockRenderer = ({
-  useFetchSyncBlockData,
-  dataProviders
-}) => {
-  const fetchResult = useFetchSyncBlockData();
-  if (!fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  const syncBlockData = fetchResult;
-  const syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
-    "data-testid": "sync-block-renderer-wrapper"
-  }, /*#__PURE__*/React.createElement(ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: dataProviders
-  })));
-};
-export const getSyncedBlockRenderer = props => {
-  return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
-    useFetchSyncBlockData: props.useFetchSyncBlockData
-  });
-};
-
-/**
- * From packages packages/editor/renderer/src/react/types.ts
- * Avoid importing from renderer package directly to avoid circular dependency
- */
-
-/**
- * This is a subset of the full NodeMeta type defined in renderer package
- * packages/editor/renderer/src/react/types.ts
- */
-
-const SyncBlockNodeComponent = props => {
-  const [data, setData] = useState(null);
-  useEffect(() => {
-    if (!props.dataPromise) {
-      return;
-    }
-    if (data) {
-      return;
-    }
-    props.dataPromise.then(data => {
-      setData(data);
-    });
-  }, [props.dataPromise, data]);
-  if (!data) {
-    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
-  }
-  const fetchResult = data.find(item => item.resourceId === props.resourceId);
-  if (!fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: SyncBlockStatus.Errored
-    });
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  const syncBlockData = fetchResult;
-  const syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
-    "data-sync-block": true,
-    "data-testid": "sync-block-renderer-wrapper",
-    "data-resource-id": props.resourceId,
-    "data-local-id": props.localId
-  }, /*#__PURE__*/React.createElement(ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: props.providers
-  })));
-};
-export const getSyncBlockNodeComponent = (dataProvider, doc) => {
-  const {
-    content
-  } = doc;
-  const isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  const syncBlockNodes = isEmpty ? [] : content.filter(node => node.type === 'syncBlock');
-  const dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
-  return props => SyncBlockNodeComponent({
-    ...props,
-    dataPromise
-  });
-};

package/dist/esm/syncedBlockRenderer.js

@@ -1,118 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-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; }
-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; }
-import React, { useEffect, useState } from 'react';
-import { SyncBlockStatus } from '@atlaskit/editor-synced-block-provider';
-import { ReactRenderer } from '@atlaskit/renderer';
-import { RendererActionsContext } from '@atlaskit/renderer/actions';
-import { SyncedBlockErrorComponent } from './ui/SyncedBlockErrorComponent';
-import { SyncedBlockLoadingState } from './ui/SyncedBlockLoadingState';
-var SyncedBlockRenderer = function SyncedBlockRenderer(_ref) {
-  var useFetchSyncBlockData = _ref.useFetchSyncBlockData,
-    dataProviders = _ref.dataProviders;
-  var fetchResult = useFetchSyncBlockData();
-  if (!fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  var syncBlockData = fetchResult;
-  var syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
-    "data-testid": "sync-block-renderer-wrapper"
-  }, /*#__PURE__*/React.createElement(ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: dataProviders
-  })));
-};
-export var getSyncedBlockRenderer = function getSyncedBlockRenderer(props) {
-  return /*#__PURE__*/React.createElement(SyncedBlockRenderer, {
-    useFetchSyncBlockData: props.useFetchSyncBlockData
-  });
-};
-
-/**
- * From packages packages/editor/renderer/src/react/types.ts
- * Avoid importing from renderer package directly to avoid circular dependency
- */
-
-/**
- * This is a subset of the full NodeMeta type defined in renderer package
- * packages/editor/renderer/src/react/types.ts
- */
-
-var SyncBlockNodeComponent = function SyncBlockNodeComponent(props) {
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    data = _useState2[0],
-    setData = _useState2[1];
-  useEffect(function () {
-    if (!props.dataPromise) {
-      return;
-    }
-    if (data) {
-      return;
-    }
-    props.dataPromise.then(function (data) {
-      setData(data);
-    });
-  }, [props.dataPromise, data]);
-  if (!data) {
-    return /*#__PURE__*/React.createElement(SyncedBlockLoadingState, null);
-  }
-  var fetchResult = data.find(function (item) {
-    return item.resourceId === props.resourceId;
-  });
-  if (!fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: SyncBlockStatus.Errored
-    });
-  }
-  if ('status' in fetchResult) {
-    return /*#__PURE__*/React.createElement(SyncedBlockErrorComponent, {
-      status: fetchResult.status
-    });
-  }
-  var syncBlockData = fetchResult;
-  var syncBlockDoc = {
-    content: syncBlockData.content,
-    version: 1,
-    type: 'doc'
-  };
-  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement("div", {
-    "data-sync-block": true,
-    "data-testid": "sync-block-renderer-wrapper",
-    "data-resource-id": props.resourceId,
-    "data-local-id": props.localId
-  }, /*#__PURE__*/React.createElement(ReactRenderer, {
-    appearance: "full-width",
-    adfStage: "stage0",
-    document: syncBlockDoc,
-    disableHeadingIDs: true,
-    dataProviders: props.providers
-  })));
-};
-export var getSyncBlockNodeComponent = function getSyncBlockNodeComponent(dataProvider, doc) {
-  var content = doc.content;
-  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  var syncBlockNodes = isEmpty ? [] : content.filter(function (node) {
-    return node.type === 'syncBlock';
-  });
-  var dataPromise = dataProvider.fetchNodesData(syncBlockNodes);
-  return function (props) {
-    return SyncBlockNodeComponent(_objectSpread(_objectSpread({}, props), {}, {
-      dataPromise: dataPromise
-    }));
-  };
-};

package/dist/types/syncedBlockRenderer.d.ts

@@ -1,38 +0,0 @@
-import React from 'react';
-import type { DocNode } from '@atlaskit/adf-schema';
-import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
-import type { NodeType, Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
-import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
-import type { NodeDataProvider } from '@atlaskit/node-data-provider';
-export type SyncedBlockRendererProps = {
-    dataProviders?: ProviderFactory;
-    useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
-};
-export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
-/**
- * From packages packages/editor/renderer/src/react/types.ts
- * Avoid importing from renderer package directly to avoid circular dependency
- */
-export interface RendererContext {
-    adDoc?: any;
-    containerAri?: string;
-    objectAri?: string;
-    schema?: Schema;
-}
-/**
- * This is a subset of the full NodeMeta type defined in renderer package
- * packages/editor/renderer/src/react/types.ts
- */
-export interface NodeMeta {
-    dataAttributes: {
-        'data-renderer-start-pos': number;
-    };
-    localId?: string;
-    marks: PMNode['marks'];
-    nodeType: NodeType['name'];
-    portal?: HTMLElement | undefined;
-    providers?: ProviderFactory | undefined;
-    rendererContext?: RendererContext;
-    resourceId?: string;
-}
-export declare const getSyncBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: NodeMeta) => React.JSX.Element;

package/dist/types-ts4.5/syncedBlockRenderer.d.ts

@@ -1,38 +0,0 @@
-import React from 'react';
-import type { DocNode } from '@atlaskit/adf-schema';
-import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
-import type { NodeType, Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
-import { type SyncBlockNode, type FetchSyncBlockDataResult } from '@atlaskit/editor-synced-block-provider';
-import type { NodeDataProvider } from '@atlaskit/node-data-provider';
-export type SyncedBlockRendererProps = {
-    dataProviders?: ProviderFactory;
-    useFetchSyncBlockData: () => FetchSyncBlockDataResult | null;
-};
-export declare const getSyncedBlockRenderer: (props: SyncedBlockRendererProps) => React.JSX.Element;
-/**
- * From packages packages/editor/renderer/src/react/types.ts
- * Avoid importing from renderer package directly to avoid circular dependency
- */
-export interface RendererContext {
-    adDoc?: any;
-    containerAri?: string;
-    objectAri?: string;
-    schema?: Schema;
-}
-/**
- * This is a subset of the full NodeMeta type defined in renderer package
- * packages/editor/renderer/src/react/types.ts
- */
-export interface NodeMeta {
-    dataAttributes: {
-        'data-renderer-start-pos': number;
-    };
-    localId?: string;
-    marks: PMNode['marks'];
-    nodeType: NodeType['name'];
-    portal?: HTMLElement | undefined;
-    providers?: ProviderFactory | undefined;
-    rendererContext?: RendererContext;
-    resourceId?: string;
-}
-export declare const getSyncBlockNodeComponent: (dataProvider: NodeDataProvider<SyncBlockNode, FetchSyncBlockDataResult>, doc: DocNode) => (props: NodeMeta) => React.JSX.Element;