UNPKG

@atlaskit/editor-core

Version:

A package contains Atlassian editor core functionality

64 lines 3.29 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var assert = require("assert"); var React = require("react"); var react_1 = require("react"); var wrapper_click_area_1 = require("./wrapper-click-area"); var react_nodeview_1 = require("../../plugins/react-nodeview"); var ReactProsemirrorNode = (function (_super) { tslib_1.__extends(ReactProsemirrorNode, _super); function ReactProsemirrorNode() { var _this = _super !== null && _super.apply(this, arguments) || this; /** * All children components of ReactProsemirrorNode are React components * which are completely rendered by us, not Prosemirror. This also means * that we're responsible for rendering them, supporting keyboard navigation * and showing "selected" element. Wrapping ReactProsemirrorNode into HOC * helps us to pass "selected" prop into child components */ _this.wrapped = wrapper_click_area_1.default(ReactProsemirrorNode); // Stores prosemirror offset of nodes with `attrs.id` _this.childIdToOffset = new Map(); /** * Child node position is parent position + offset + 1 * because each node has its own position * i.e. different nodes can't have the same position */ _this.handleGetPos = function (id) { return function () { var offset = 0; if (_this.childIdToOffset.has(id)) { offset = _this.childIdToOffset.get(id); } else if (!isNaN(id)) { offset = +id; } return _this.props.getPos() + offset + 1; }; }; return _this; } ReactProsemirrorNode.prototype.render = function () { var _this = this; var _a = this.props, components = _a.components, node = _a.node, providerFactory = _a.providerFactory, view = _a.view; var nodeTypeName = node.type.name; var pluginState = react_nodeview_1.stateKey.getState(view.state); assert(components[nodeTypeName], "Rich node with type " + nodeTypeName + " is not declared"); assert(pluginState, 'ReactNodeViewPlugin is not enabled'); var attrs = tslib_1.__assign({}, this.props, { node: node }); var children = []; // tslint:disable-next-line:variable-name var RichNodeWithClickArea = this.wrapped; node.forEach(function (childNode, offset, index) { children.push(React.createElement(RichNodeWithClickArea, { key: childNode.attrs.id ? "richnode-" + childNode.attrs.id : "richnode-" + offset + "-" + index, components: components, node: childNode, getPos: _this.handleGetPos(childNode.attrs.id || offset), view: view, pluginState: pluginState, providerFactory: providerFactory })); if (childNode.attrs.id) { _this.childIdToOffset.set(childNode.attrs.id, offset); } }); // tslint:disable-next-line:variable-name var RichNode = components[nodeTypeName]; return React.createElement(RichNode, tslib_1.__assign({}, attrs), children); }; return ReactProsemirrorNode; }(react_1.PureComponent)); exports.default = ReactProsemirrorNode; //# sourceMappingURL=prosemirror-node.js.map