@atlaskit/editor-synced-block-renderer 4.0.7 → 4.0.8

package/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @atlaskit/editor-synced-block-renderer
 
+## 4.0.8
+
+### Patch Changes
+
+- [`79172823f4e47`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/79172823f4e47) -
+  [ux] EDITOR-3961 strip breakout mark from renderer sync block html
+- [`a4ed9f55162ae`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a4ed9f55162ae) -
+  EDITOR-3960 Refactor Synced Blocks initialization to remove multiple re-renders and duplicated
+  fetches
+- Updated dependencies
+
 ## 4.0.7
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "getSyncedBlockNodeComponent", {
+Object.defineProperty(exports, "getSyncBlockNodesFromDoc", {
   enumerable: true,
   get: function get() {
-    return _getSyncedBlockNodeComponent.getSyncedBlockNodeComponent;
+    return _useSyncedBlockNodeComponent.getSyncBlockNodesFromDoc;
   }
 });
 Object.defineProperty(exports, "getSyncedBlockRenderer", {
@@ -15,5 +15,11 @@ Object.defineProperty(exports, "getSyncedBlockRenderer", {
     return _getSyncedBlockRenderer.getSyncedBlockRenderer;
   }
 });
-var _getSyncedBlockNodeComponent = require("./getSyncedBlockNodeComponent");
+Object.defineProperty(exports, "useMemoizedSyncedBlockNodeComponent", {
+  enumerable: true,
+  get: function get() {
+    return _useSyncedBlockNodeComponent.useMemoizedSyncedBlockNodeComponent;
+  }
+});
+var _useSyncedBlockNodeComponent = require("./useSyncedBlockNodeComponent");
 var _getSyncedBlockRenderer = require("./getSyncedBlockRenderer");

package/dist/cjs/ui/SyncedBlockNodeComponentRenderer.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.SyncedBlockNodeComponentRenderer = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _syncBlock = require("@atlaskit/editor-common/sync-block");
 var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
@@ -42,16 +44,13 @@ var SyncedBlockNodeComponentRenderer = exports.SyncedBlockNodeComponentRenderer
     version: 1,
     type: 'doc'
   };
-  return (
-    /*#__PURE__*/
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-    _react.default.createElement("div", {
-      className: _syncBlock.SyncBlockSharedCssClassName.renderer,
-      "data-sync-block-renderer": true
-    }, /*#__PURE__*/_react.default.createElement(_AKRendererWrapper.AKRendererWrapper, {
-      doc: syncBlockDoc,
-      dataProviders: providerFactory,
-      options: rendererOptions
-    }))
-  );
+    className: _syncBlock.SyncBlockSharedCssClassName.renderer
+    // eslint-disable-next-line react/jsx-props-no-spreading
+  }, (0, _defineProperty2.default)({}, _syncBlock.SyncBlockRendererDataAttributeName, true)), /*#__PURE__*/_react.default.createElement(_AKRendererWrapper.AKRendererWrapper, {
+    doc: syncBlockDoc,
+    dataProviders: providerFactory,
+    options: rendererOptions
+  }));
 };

package/dist/cjs/useSyncedBlockNodeComponent.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMemoizedSyncedBlockNodeComponent = exports.getSyncBlockNodesFromDoc = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
+var _SyncedBlockNodeComponentRenderer = require("./ui/SyncedBlockNodeComponentRenderer");
+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 getSyncBlockNodesFromDoc = exports.getSyncBlockNodesFromDoc = function getSyncBlockNodesFromDoc(doc) {
+  var content = doc.content;
+  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  var syncBlockNodes = isEmpty ? [] : content.map(function (node) {
+    return (0, _editorSyncedBlockProvider.convertSyncBlockJSONNodeToSyncBlockNode)(node);
+  }).filter(function (node) {
+    return node !== undefined;
+  });
+  return syncBlockNodes;
+};
+var useMemoizedSyncedBlockNodeComponent = exports.useMemoizedSyncedBlockNodeComponent = function useMemoizedSyncedBlockNodeComponent(_ref) {
+  var syncBlockNodes = _ref.syncBlockNodes,
+    syncBlockProvider = _ref.syncBlockProvider,
+    syncBlockRendererOptions = _ref.syncBlockRendererOptions,
+    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
+  var syncBlockStoreManager = (0, _editorSyncedBlockProvider.useMemoizedSyncBlockStoreManager)(syncBlockProvider, fireAnalyticsEvent);
+
+  // Initial fetch sync block data
+  (0, _react.useEffect)(function () {
+    syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
+  }, [syncBlockNodes, syncBlockStoreManager.referenceManager]);
+  return (0, _react.useCallback)(function (props) {
+    return /*#__PURE__*/_react.default.createElement(_SyncedBlockNodeComponentRenderer.SyncedBlockNodeComponentRenderer, {
+      key: props.localId,
+      nodeProps: props,
+      syncBlockStoreManager: syncBlockStoreManager,
+      rendererOptions: syncBlockRendererOptions
+    });
+  }, [syncBlockStoreManager, syncBlockRendererOptions]);
+};

package/dist/es2019/index.js

@@ -1,3 +1,3 @@
 /* eslint-disable @atlaskit/editor/no-re-export */
-export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { useMemoizedSyncedBlockNodeComponent, getSyncBlockNodesFromDoc } from './useSyncedBlockNodeComponent';
 export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/es2019/ui/SyncedBlockNodeComponentRenderer.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
+import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
 import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
 import { AKRendererWrapper } from './AKRendererWrapper';
 import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
@@ -39,16 +39,15 @@ export const SyncedBlockNodeComponentRenderer = ({
     version: 1,
     type: 'doc'
   };
-  return (
-    /*#__PURE__*/
+  return /*#__PURE__*/React.createElement("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-    React.createElement("div", {
-      className: SyncBlockSharedCssClassName.renderer,
-      "data-sync-block-renderer": true
-    }, /*#__PURE__*/React.createElement(AKRendererWrapper, {
-      doc: syncBlockDoc,
-      dataProviders: providerFactory,
-      options: rendererOptions
-    }))
-  );
+    className: SyncBlockSharedCssClassName.renderer
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    ,
+    [SyncBlockRendererDataAttributeName]: true
+  }, /*#__PURE__*/React.createElement(AKRendererWrapper, {
+    doc: syncBlockDoc,
+    dataProviders: providerFactory,
+    options: rendererOptions
+  }));
 };

package/dist/es2019/useSyncedBlockNodeComponent.js

@@ -0,0 +1,30 @@
+import React, { useCallback, useEffect } from 'react';
+import { convertSyncBlockJSONNodeToSyncBlockNode, useMemoizedSyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
+import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
+export const getSyncBlockNodesFromDoc = doc => {
+  const {
+    content
+  } = doc;
+  const isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  const syncBlockNodes = isEmpty ? [] : content.map(node => convertSyncBlockJSONNodeToSyncBlockNode(node)).filter(node => node !== undefined);
+  return syncBlockNodes;
+};
+export const useMemoizedSyncedBlockNodeComponent = ({
+  syncBlockNodes,
+  syncBlockProvider,
+  syncBlockRendererOptions,
+  fireAnalyticsEvent
+}) => {
+  const syncBlockStoreManager = useMemoizedSyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
+
+  // Initial fetch sync block data
+  useEffect(() => {
+    syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
+  }, [syncBlockNodes, syncBlockStoreManager.referenceManager]);
+  return useCallback(props => /*#__PURE__*/React.createElement(SyncedBlockNodeComponentRenderer, {
+    key: props.localId,
+    nodeProps: props,
+    syncBlockStoreManager: syncBlockStoreManager,
+    rendererOptions: syncBlockRendererOptions
+  }), [syncBlockStoreManager, syncBlockRendererOptions]);
+};

package/dist/esm/index.js

@@ -1,3 +1,3 @@
 /* eslint-disable @atlaskit/editor/no-re-export */
-export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { useMemoizedSyncedBlockNodeComponent, getSyncBlockNodesFromDoc } from './useSyncedBlockNodeComponent';
 export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';

package/dist/esm/ui/SyncedBlockNodeComponentRenderer.js

@@ -1,5 +1,7 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import { SyncBlockSharedCssClassName } from '@atlaskit/editor-common/sync-block';
+import { SyncBlockSharedCssClassName, SyncBlockRendererDataAttributeName } from '@atlaskit/editor-common/sync-block';
 import { SyncBlockError, useFetchSyncBlockData } from '@atlaskit/editor-synced-block-provider';
 import { AKRendererWrapper } from './AKRendererWrapper';
 import { SyncedBlockErrorComponent } from './SyncedBlockErrorComponent';
@@ -35,16 +37,13 @@ export var SyncedBlockNodeComponentRenderer = function SyncedBlockNodeComponentR
     version: 1,
     type: 'doc'
   };
-  return (
-    /*#__PURE__*/
+  return /*#__PURE__*/React.createElement("div", _extends({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-    React.createElement("div", {
-      className: SyncBlockSharedCssClassName.renderer,
-      "data-sync-block-renderer": true
-    }, /*#__PURE__*/React.createElement(AKRendererWrapper, {
-      doc: syncBlockDoc,
-      dataProviders: providerFactory,
-      options: rendererOptions
-    }))
-  );
+    className: SyncBlockSharedCssClassName.renderer
+    // eslint-disable-next-line react/jsx-props-no-spreading
+  }, _defineProperty({}, SyncBlockRendererDataAttributeName, true)), /*#__PURE__*/React.createElement(AKRendererWrapper, {
+    doc: syncBlockDoc,
+    dataProviders: providerFactory,
+    options: rendererOptions
+  }));
 };

package/dist/esm/useSyncedBlockNodeComponent.js

@@ -0,0 +1,33 @@
+import React, { useCallback, useEffect } from 'react';
+import { convertSyncBlockJSONNodeToSyncBlockNode, useMemoizedSyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
+import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
+export var getSyncBlockNodesFromDoc = function getSyncBlockNodesFromDoc(doc) {
+  var content = doc.content;
+  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
+  var syncBlockNodes = isEmpty ? [] : content.map(function (node) {
+    return convertSyncBlockJSONNodeToSyncBlockNode(node);
+  }).filter(function (node) {
+    return node !== undefined;
+  });
+  return syncBlockNodes;
+};
+export var useMemoizedSyncedBlockNodeComponent = function useMemoizedSyncedBlockNodeComponent(_ref) {
+  var syncBlockNodes = _ref.syncBlockNodes,
+    syncBlockProvider = _ref.syncBlockProvider,
+    syncBlockRendererOptions = _ref.syncBlockRendererOptions,
+    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
+  var syncBlockStoreManager = useMemoizedSyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
+
+  // Initial fetch sync block data
+  useEffect(function () {
+    syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
+  }, [syncBlockNodes, syncBlockStoreManager.referenceManager]);
+  return useCallback(function (props) {
+    return /*#__PURE__*/React.createElement(SyncedBlockNodeComponentRenderer, {
+      key: props.localId,
+      nodeProps: props,
+      syncBlockStoreManager: syncBlockStoreManager,
+      rendererOptions: syncBlockRendererOptions
+    });
+  }, [syncBlockStoreManager, syncBlockRendererOptions]);
+};

package/dist/types/index.d.ts

@@ -1,2 +1,3 @@
-export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { useMemoizedSyncedBlockNodeComponent, getSyncBlockNodesFromDoc, } from './useSyncedBlockNodeComponent';
 export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
+export type { SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';

package/dist/{types-ts4.5/getSyncedBlockNodeComponent.d.ts → types/useSyncedBlockNodeComponent.d.ts}

@@ -1,14 +1,16 @@
-import type React from 'react';
+import React from 'react';
 import type { DocNode } from '@atlaskit/adf-schema';
 import type { SyncBlockEventPayload } from '@atlaskit/editor-common/analytics';
+import { type SyncBlockNode } from '@atlaskit/editor-synced-block-provider';
 import type { SyncedBlockProvider } from '@atlaskit/editor-synced-block-provider';
 import type { SyncedBlockRendererOptions } from './types';
 import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
 type GetSyncedBlockNodeComponentProps = {
-    doc: DocNode;
     fireAnalyticsEvent?: (payload: SyncBlockEventPayload) => void;
+    syncBlockNodes: SyncBlockNode[];
     syncBlockProvider: SyncedBlockProvider;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
-export declare const getSyncedBlockNodeComponent: ({ doc, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
+export declare const getSyncBlockNodesFromDoc: (doc: DocNode) => SyncBlockNode[];
+export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
 export {};

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

@@ -1,2 +1,3 @@
-export { getSyncedBlockNodeComponent } from './getSyncedBlockNodeComponent';
+export { useMemoizedSyncedBlockNodeComponent, getSyncBlockNodesFromDoc, } from './useSyncedBlockNodeComponent';
 export { getSyncedBlockRenderer } from './getSyncedBlockRenderer';
+export type { SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';

package/dist/{types/getSyncedBlockNodeComponent.d.ts → types-ts4.5/useSyncedBlockNodeComponent.d.ts}

@@ -1,14 +1,16 @@
-import type React from 'react';
+import React from 'react';
 import type { DocNode } from '@atlaskit/adf-schema';
 import type { SyncBlockEventPayload } from '@atlaskit/editor-common/analytics';
+import { type SyncBlockNode } from '@atlaskit/editor-synced-block-provider';
 import type { SyncedBlockProvider } from '@atlaskit/editor-synced-block-provider';
 import type { SyncedBlockRendererOptions } from './types';
 import { type SyncedBlockNodeProps } from './ui/SyncedBlockNodeComponentRenderer';
 type GetSyncedBlockNodeComponentProps = {
-    doc: DocNode;
     fireAnalyticsEvent?: (payload: SyncBlockEventPayload) => void;
+    syncBlockNodes: SyncBlockNode[];
     syncBlockProvider: SyncedBlockProvider;
     syncBlockRendererOptions: SyncedBlockRendererOptions | undefined;
 };
-export declare const getSyncedBlockNodeComponent: ({ doc, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
+export declare const getSyncBlockNodesFromDoc: (doc: DocNode) => SyncBlockNode[];
+export declare const useMemoizedSyncedBlockNodeComponent: ({ syncBlockNodes, syncBlockProvider, syncBlockRendererOptions, fireAnalyticsEvent, }: GetSyncedBlockNodeComponentProps) => ((props: SyncedBlockNodeProps) => React.JSX.Element);
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-synced-block-renderer",
-	"version": "4.0.7",
+	"version": "4.0.8",
 	"description": "SyncedBlockRenderer for @atlaskit/editor-plugin-synced-block",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -28,7 +28,7 @@
 	"sideEffects": false,
 	"atlaskit:src": "src/index.ts",
 	"dependencies": {
-		"@atlaskit/button": "^23.8.0",
+		"@atlaskit/button": "^23.9.0",
 		"@atlaskit/css": "^0.18.0",
 		"@atlaskit/editor-plugin-synced-block": "^4.6.0",
 		"@atlaskit/editor-synced-block-provider": "^2.15.0",

package/dist/cjs/getSyncedBlockNodeComponent.js

@@ -1,37 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getSyncedBlockNodeComponent = void 0;
-var _editorSyncedBlockProvider = require("@atlaskit/editor-synced-block-provider");
-var _SyncedBlockNodeComponentRenderer = require("./ui/SyncedBlockNodeComponentRenderer");
-var getSyncBlockNodesFromContent = function getSyncBlockNodesFromContent(content) {
-  return content.map(function (node) {
-    return (0, _editorSyncedBlockProvider.convertSyncBlockJSONNodeToSyncBlockNode)(node);
-  }).filter(function (node) {
-    return node !== undefined;
-  });
-};
-
-// For rendering reference synced block nodes in Renderer
-var getSyncedBlockNodeComponent = exports.getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(_ref) {
-  var doc = _ref.doc,
-    syncBlockProvider = _ref.syncBlockProvider,
-    syncBlockRendererOptions = _ref.syncBlockRendererOptions,
-    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
-  var content = doc.content;
-  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  var syncBlockNodes = isEmpty ? [] : getSyncBlockNodesFromContent(content);
-  var syncBlockStoreManager = new _editorSyncedBlockProvider.SyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
-
-  // Pre-fetch sync block data
-  syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
-  return function (props) {
-    return (0, _SyncedBlockNodeComponentRenderer.SyncedBlockNodeComponentRenderer)({
-      nodeProps: props,
-      syncBlockStoreManager: syncBlockStoreManager,
-      rendererOptions: syncBlockRendererOptions
-    });
-  };
-};

package/dist/es2019/getSyncedBlockNodeComponent.js

@@ -1,28 +0,0 @@
-import { convertSyncBlockJSONNodeToSyncBlockNode, SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
-import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
-const getSyncBlockNodesFromContent = content => {
-  return content.map(node => convertSyncBlockJSONNodeToSyncBlockNode(node)).filter(node => node !== undefined);
-};
-
-// For rendering reference synced block nodes in Renderer
-export const getSyncedBlockNodeComponent = ({
-  doc,
-  syncBlockProvider,
-  syncBlockRendererOptions,
-  fireAnalyticsEvent
-}) => {
-  const {
-    content
-  } = doc;
-  const isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  const syncBlockNodes = isEmpty ? [] : getSyncBlockNodesFromContent(content);
-  const syncBlockStoreManager = new SyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
-
-  // Pre-fetch sync block data
-  syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
-  return props => SyncedBlockNodeComponentRenderer({
-    nodeProps: props,
-    syncBlockStoreManager,
-    rendererOptions: syncBlockRendererOptions
-  });
-};

package/dist/esm/getSyncedBlockNodeComponent.js

@@ -1,31 +0,0 @@
-import { convertSyncBlockJSONNodeToSyncBlockNode, SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
-import { SyncedBlockNodeComponentRenderer } from './ui/SyncedBlockNodeComponentRenderer';
-var getSyncBlockNodesFromContent = function getSyncBlockNodesFromContent(content) {
-  return content.map(function (node) {
-    return convertSyncBlockJSONNodeToSyncBlockNode(node);
-  }).filter(function (node) {
-    return node !== undefined;
-  });
-};
-
-// For rendering reference synced block nodes in Renderer
-export var getSyncedBlockNodeComponent = function getSyncedBlockNodeComponent(_ref) {
-  var doc = _ref.doc,
-    syncBlockProvider = _ref.syncBlockProvider,
-    syncBlockRendererOptions = _ref.syncBlockRendererOptions,
-    fireAnalyticsEvent = _ref.fireAnalyticsEvent;
-  var content = doc.content;
-  var isEmpty = !content || !Array.isArray(content) || content.length === 0;
-  var syncBlockNodes = isEmpty ? [] : getSyncBlockNodesFromContent(content);
-  var syncBlockStoreManager = new SyncBlockStoreManager(syncBlockProvider, fireAnalyticsEvent);
-
-  // Pre-fetch sync block data
-  syncBlockStoreManager.referenceManager.fetchSyncBlocksData(syncBlockNodes);
-  return function (props) {
-    return SyncedBlockNodeComponentRenderer({
-      nodeProps: props,
-      syncBlockStoreManager: syncBlockStoreManager,
-      rendererOptions: syncBlockRendererOptions
-    });
-  };
-};