@atlaskit/editor-plugin-table
Version:
Table plugin for the @atlaskit/editor
91 lines (89 loc) • 4.29 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.pluginKey = exports.handleDocOrSelectionChanged = exports.getDecorations = exports.createPlugin = void 0;
var _coreUtils = require("@atlaskit/editor-common/core-utils");
var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
var _state = require("@atlaskit/editor-prosemirror/state");
var _view = require("@atlaskit/editor-prosemirror/view");
var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
var _utils = require("@atlaskit/editor-tables/utils");
var _pluginKey = require("../plugin-key");
var _tableWidth = require("../table-width");
var _columnControls = require("./utils/column-controls");
var pluginKey = exports.pluginKey = new _state.PluginKey('tableDecorationsPlugin');
var getDecorations = exports.getDecorations = function getDecorations(state) {
return pluginKey.getState(state);
};
var handleDocOrSelectionChanged = exports.handleDocOrSelectionChanged = function handleDocOrSelectionChanged(tr, decorationSet, oldState, newState) {
var _tableWidthPluginKey$, _tableWidthPluginKey$2;
var isResizing = (_tableWidthPluginKey$ = _tableWidth.pluginKey.getState(newState)) === null || _tableWidthPluginKey$ === void 0 ? void 0 : _tableWidthPluginKey$.resizing;
var wasResizing = (_tableWidthPluginKey$2 = _tableWidth.pluginKey.getState(oldState)) === null || _tableWidthPluginKey$2 === void 0 ? void 0 : _tableWidthPluginKey$2.resizing;
var _ref = _pluginKey.pluginKey.getState(newState) || {},
_ref$isDragAndDropEna = _ref.isDragAndDropEnabled,
isDragAndDropEnabled = _ref$isDragAndDropEna === void 0 ? false : _ref$isDragAndDropEna,
isInDanger = _ref.isInDanger,
isTableHovered = _ref.isTableHovered;
var changedResizing = isResizing !== wasResizing;
// Remove column controls when resizing and don't add column decoration controls when DnD enabled
if (isResizing) {
return _view.DecorationSet.empty;
} else if (tr.docChanged || tr.selection instanceof _cellSelection.CellSelection || changedResizing) {
return (0, _columnControls.buildColumnControlsDecorations)({
decorationSet: decorationSet,
tr: tr,
options: {
isDragAndDropEnabled: isDragAndDropEnabled
}
});
} else if (tr.selectionSet) {
var _findTable, _findTable2;
var isTransactionFromMouseClick = !tr.docChanged && tr.selectionSet && tr.getMeta('pointer');
if (isTransactionFromMouseClick || oldState.selection instanceof _cellSelection.CellSelection) {
return (0, _columnControls.maybeUpdateColumnControlsSelectedDecoration)({
decorationSet: decorationSet,
tr: tr
});
}
// We're exiting a table with an existing decorations so we should clean it up
if ((isInDanger || isTableHovered) && (!(0, _coreUtils.insideTable)(newState) || ((_findTable = (0, _utils.findTable)(newState.selection)) === null || _findTable === void 0 ? void 0 : _findTable.node) !== ((_findTable2 = (0, _utils.findTable)(oldState.selection)) === null || _findTable2 === void 0 ? void 0 : _findTable2.node))) {
return (0, _columnControls.buildColumnControlsDecorations)({
decorationSet: decorationSet,
tr: tr,
options: {
isDragAndDropEnabled: isDragAndDropEnabled
}
});
}
}
return decorationSet;
};
var createPlugin = exports.createPlugin = function createPlugin() {
return new _safePlugin.SafePlugin({
state: {
init: function init() {
return _view.DecorationSet.empty;
},
apply: function apply(tr, decorationSet, oldState, newState) {
var pluginState = decorationSet;
// main table plugin --->
var meta = tr.getMeta(_pluginKey.pluginKey);
if (meta && meta.data && meta.data.decorationSet) {
pluginState = meta.data.decorationSet;
}
if (tr.docChanged || tr.selectionSet || tr.getMeta(_tableWidth.pluginKey)) {
pluginState = pluginState.map(tr.mapping, tr.doc);
return handleDocOrSelectionChanged(tr, pluginState, oldState, newState);
}
return pluginState;
}
},
key: pluginKey,
props: {
decorations: function decorations(state) {
return getDecorations(state);
}
}
});
};