@atlaskit/editor-plugin-synced-block
Version:
SyncedBlock plugin for @atlaskit/editor-core
130 lines • 7.2 kB
JavaScript
import React from 'react';
import { syncBlock, bodiedSyncBlock } from '@atlaskit/adf-schema';
import { SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
import { flushBodiedSyncBlocks as _flushBodiedSyncBlocks, flushSyncBlocks } from './editor-actions';
import { copySyncedBlockReferenceToClipboardEditorCommand, createSyncedBlock } from './editor-commands';
import { bodiedSyncBlockNodeWithToDOMFixed } from './nodeviews/bodiedSyncBlockNodeWithToDOMFixed';
import { createPlugin, syncedBlockPluginKey } from './pm-plugins/main';
import { getMenuAndToolbarExperiencesPlugin } from './pm-plugins/menu-and-toolbar-experiences';
import { getBlockMenuComponents } from './ui/block-menu-components';
import { DeleteConfirmationModal } from './ui/DeleteConfirmationModal';
import { Flag } from './ui/Flag';
import { getToolbarConfig } from './ui/floating-toolbar';
import { getQuickInsertConfig } from './ui/quick-insert';
import { SyncBlockRefresher } from './ui/SyncBlockRefresher';
import { getToolbarComponents } from './ui/toolbar-components';
export var syncedBlockPlugin = function syncedBlockPlugin(_ref) {
var _api$editorViewMode, _api$analytics, _api$blockMenu, _config$enableSourceC, _api$toolbar, _config$enableSourceC2;
var config = _ref.config,
api = _ref.api;
var refs = {};
var viewMode = api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode;
var syncBlockStore = new SyncBlockStoreManager(config === null || config === void 0 ? void 0 : config.syncBlockDataProvider, viewMode, config === null || config === void 0 ? void 0 : config.__livePage);
syncBlockStore.setFireAnalyticsEvent(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 ? void 0 : _api$analytics.fireAnalyticsEvent);
api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getBlockMenuComponents(api, (_config$enableSourceC = config === null || config === void 0 ? void 0 : config.enableSourceCreation) !== null && _config$enableSourceC !== void 0 ? _config$enableSourceC : false));
api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents(getToolbarComponents(api, (_config$enableSourceC2 = config === null || config === void 0 ? void 0 : config.enableSourceCreation) !== null && _config$enableSourceC2 !== void 0 ? _config$enableSourceC2 : false));
return {
name: 'syncedBlock',
nodes: function nodes() {
return [{
name: 'syncBlock',
node: syncBlock
}, {
name: 'bodiedSyncBlock',
node: !editorExperiment('platform_synced_block_patch_6', true, {
exposure: true
}) ?
// delete bodiedSyncBlockNodeWithToDOMFixed when cleaning up platform_synced_block_patch_6
bodiedSyncBlockNodeWithToDOMFixed() : bodiedSyncBlock
}];
},
pmPlugins: function pmPlugins() {
return [{
name: 'syncedBlockPlugin',
plugin: function plugin(params) {
return createPlugin(config, params, syncBlockStore, api);
}
}, {
name: 'menuAndToolbarExperiencesPlugin',
plugin: function plugin() {
return getMenuAndToolbarExperiencesPlugin({
refs: refs,
dispatchAnalyticsEvent: function dispatchAnalyticsEvent(payload) {
var _api$analytics2;
return api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || (_api$analytics2 = _api$analytics2.actions) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.fireAnalyticsEvent(payload);
}
});
}
}];
},
commands: {
copySyncedBlockReferenceToClipboard: function copySyncedBlockReferenceToClipboard(inputMethod) {
return copySyncedBlockReferenceToClipboardEditorCommand(syncBlockStore, inputMethod, api);
},
insertSyncedBlock: function insertSyncedBlock() {
return function (_ref2) {
var _api$analytics3;
var tr = _ref2.tr;
if (!(config !== null && config !== void 0 && config.enableSourceCreation)) {
return null;
}
return createSyncedBlock({
tr: tr,
syncBlockStore: syncBlockStore,
fireAnalyticsEvent: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent
}) || null;
};
}
},
actions: {
flushBodiedSyncBlocks: function flushBodiedSyncBlocks() {
return _flushBodiedSyncBlocks(syncBlockStore);
},
flushSyncedBlocks: function flushSyncedBlocks() {
return flushSyncBlocks(syncBlockStore);
}
},
pluginsOptions: {
quickInsert: getQuickInsertConfig(config, api, syncBlockStore),
floatingToolbar: function floatingToolbar(state, intl) {
return getToolbarConfig(state, intl, api, syncBlockStore);
}
},
contentComponent: function contentComponent(_ref3) {
var containerElement = _ref3.containerElement,
wrapperElement = _ref3.wrapperElement,
popupsMountPoint = _ref3.popupsMountPoint;
refs.containerElement = containerElement || undefined;
refs.popupsMountPoint = popupsMountPoint || undefined;
refs.wrapperElement = wrapperElement || undefined;
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SyncBlockRefresher, {
syncBlockStoreManager: syncBlockStore,
api: api
}), /*#__PURE__*/React.createElement(DeleteConfirmationModal, {
syncBlockStoreManager: syncBlockStore,
api: api
}), /*#__PURE__*/React.createElement(Flag, {
api: api
}));
},
getSharedState: function getSharedState(editorState) {
if (!editorState) {
return;
}
var _syncedBlockPluginKey = syncedBlockPluginKey.getState(editorState),
activeFlag = _syncedBlockPluginKey.activeFlag,
currentSyncBlockStore = _syncedBlockPluginKey.syncBlockStore,
bodiedSyncBlockDeletionStatus = _syncedBlockPluginKey.bodiedSyncBlockDeletionStatus,
retryCreationPosMap = _syncedBlockPluginKey.retryCreationPosMap,
hasUnsavedBodiedSyncBlockChanges = _syncedBlockPluginKey.hasUnsavedBodiedSyncBlockChanges;
return {
activeFlag: activeFlag,
syncBlockStore: currentSyncBlockStore,
bodiedSyncBlockDeletionStatus: bodiedSyncBlockDeletionStatus,
retryCreationPosMap: retryCreationPosMap,
hasUnsavedBodiedSyncBlockChanges: hasUnsavedBodiedSyncBlockChanges
};
}
};
};