@atlaskit/editor-plugin-table
Version:
Table plugin for the @atlaskit/editor
87 lines (86 loc) • 4.08 kB
JavaScript
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid
import uuid from 'uuid';
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
import { isCSSAnchorSupported, isCSSAttrAnchorSupported } from '@atlaskit/editor-common/styles';
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
import { fg } from '@atlaskit/platform-feature-flags';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
var ObjHash = /*#__PURE__*/function () {
function ObjHash() {
_classCallCheck(this, ObjHash);
}
return _createClass(ObjHash, null, [{
key: "getForNode",
value: function getForNode(node) {
if (this.cache.has(node)) {
return this.cache.get(node) || '';
}
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid
var uniqueId = uuid();
this.cache.set(node, uniqueId);
return uniqueId;
}
}]);
}();
_defineProperty(ObjHash, "cache", new WeakMap());
var getNodeAnchor = function getNodeAnchor(node) {
var handleId = ObjHash.getForNode(node);
return "--table-".concat(node.type.name, "-").concat(handleId);
};
var createTableAnchorDecorations = function createTableAnchorDecorations(state) {
var decs = [];
var headerRowId;
state.doc.nodesBetween(0, state.doc.content.size, function (node, pos, parent, index) {
var _parent$attrs;
var isTableHeader = node.type.name === 'tableHeader';
var isTableRow = node.type.name === 'tableRow';
var isParentTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'tableRow';
var isParentTableHeaderRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'tableRow' && headerRowId && (parent === null || parent === void 0 || (_parent$attrs = parent.attrs) === null || _parent$attrs === void 0 ? void 0 : _parent$attrs.localId) === headerRowId;
var shouldAddDecorationToHeader = expValEquals('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? isParentTableHeaderRow && isTableHeader : isTableHeader;
var isFirstRow = isTableRow && index === 0;
if (isFirstRow) {
headerRowId = node.attrs.localId;
}
// only apply to header cells and the first row of a table, for performance reasons
if (isFirstRow || shouldAddDecorationToHeader) {
var anchorName = getNodeAnchor(node);
var shouldAddAnchorNameInDecoration = !isCSSAttrAnchorSupported() && isCSSAnchorSupported() && fg('platform_editor_table_sticky_header_patch_8');
var attributes = {
'data-node-anchor': anchorName,
style: "anchor-name: ".concat(anchorName, ";")
};
decs.push(Decoration.node(pos, pos + node.nodeSize, shouldAddAnchorNameInDecoration ? attributes : {
'data-node-anchor': anchorName
}));
}
// only decend if there is a possible table row or table header node after the current node, for performance reasons
return expValEquals('platform_editor_table_sticky_header_patch_9', 'isEnabled', true) ? !(isTableHeader || isParentTableHeaderRow) : !(isTableHeader || isParentTableRow);
});
return DecorationSet.create(state.doc, decs);
};
export var pluginKey = new PluginKey('tableAnchorNamesPlugin');
export var createPlugin = function createPlugin() {
return new SafePlugin({
state: {
init: function init(_config, state) {
return createTableAnchorDecorations(state);
},
apply: function apply(tr, decorationSet, _, newState) {
if (tr.docChanged) {
return createTableAnchorDecorations(newState);
}
return decorationSet;
}
},
key: pluginKey,
props: {
decorations: function decorations(state) {
return pluginKey.getState(state) || DecorationSet.empty;
}
}
});
};