mirror of
https://github.com/streetwriters/notesnook.git
synced 2025-12-19 04:59:33 +01:00
feat: fix codeblock for mobile
This commit is contained in:
thecodrr
241
packages/editor/dist/extensions/react/ReactNodeView.js
vendored
Normal file
241
packages/editor/dist/extensions/react/ReactNodeView.js
vendored
Normal file
@@ -0,0 +1,241 @@
|
||||
var __assign = (this && this.__assign) || function () {
|
||||
__assign = Object.assign || function(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
||||
t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
};
|
||||
var __read = (this && this.__read) || function (o, n) {
|
||||
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
||||
if (!m) return o;
|
||||
var i = m.call(o), r, ar = [], e;
|
||||
try {
|
||||
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
||||
}
|
||||
catch (error) { e = { error: error }; }
|
||||
finally {
|
||||
try {
|
||||
if (r && !r.done && (m = i["return"])) m.call(i);
|
||||
}
|
||||
finally { if (e) throw e.error; }
|
||||
}
|
||||
return ar;
|
||||
};
|
||||
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
||||
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
||||
if (ar || !(i in from)) {
|
||||
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
||||
ar[i] = from[i];
|
||||
}
|
||||
}
|
||||
return to.concat(ar || Array.prototype.slice.call(from));
|
||||
};
|
||||
import { jsx as _jsx } from "react/jsx-runtime";
|
||||
var ReactNodeView = /** @class */ (function () {
|
||||
function ReactNodeView(node, editor, getPos, portalProviderAPI, eventDispatcher, options) {
|
||||
var _this = this;
|
||||
this.editor = editor;
|
||||
this.getPos = getPos;
|
||||
this.portalProviderAPI = portalProviderAPI;
|
||||
this.eventDispatcher = eventDispatcher;
|
||||
this.options = options;
|
||||
this.handleRef = function (node) { return _this._handleRef(node); };
|
||||
this.node = node;
|
||||
}
|
||||
/**
|
||||
* This method exists to move initialization logic out of the constructor,
|
||||
* so object can be initialized properly before calling render first time.
|
||||
*
|
||||
* Example:
|
||||
* Instance properties get added to an object only after super call in
|
||||
* constructor, which leads to some methods being undefined during the
|
||||
* first render.
|
||||
*/
|
||||
ReactNodeView.prototype.init = function () {
|
||||
var _this = this;
|
||||
this.domRef = this.createDomRef();
|
||||
// this.setDomAttrs(this.node, this.domRef);
|
||||
var _a = this.getContentDOM() || {
|
||||
dom: undefined,
|
||||
contentDOM: undefined,
|
||||
}, contentDOMWrapper = _a.dom, contentDOM = _a.contentDOM;
|
||||
if (this.domRef && contentDOMWrapper) {
|
||||
this.domRef.appendChild(contentDOMWrapper);
|
||||
this.contentDOM = contentDOM ? contentDOM : contentDOMWrapper;
|
||||
this.contentDOMWrapper = contentDOMWrapper || contentDOM;
|
||||
}
|
||||
// @see ED-3790
|
||||
// something gets messed up during mutation processing inside of a
|
||||
// nodeView if DOM structure has nested plain "div"s, it doesn't see the
|
||||
// difference between them and it kills the nodeView
|
||||
this.domRef.classList.add("".concat(this.node.type.name, "-view-content-wrap"));
|
||||
this.renderReactComponent(function () {
|
||||
return _this.render(_this.options.props, _this.handleRef);
|
||||
});
|
||||
return this;
|
||||
};
|
||||
ReactNodeView.prototype.renderReactComponent = function (component) {
|
||||
if (!this.domRef || !component) {
|
||||
return;
|
||||
}
|
||||
this.portalProviderAPI.render(component, this.domRef);
|
||||
};
|
||||
ReactNodeView.prototype.createDomRef = function () {
|
||||
if (this.options.wrapperFactory)
|
||||
return this.options.wrapperFactory();
|
||||
if (!this.node.isInline) {
|
||||
return document.createElement("div");
|
||||
}
|
||||
var htmlElement = document.createElement("span");
|
||||
return htmlElement;
|
||||
};
|
||||
ReactNodeView.prototype.getContentDOM = function () {
|
||||
var _a, _b;
|
||||
return (_b = (_a = this.options).contentDOMFactory) === null || _b === void 0 ? void 0 : _b.call(_a);
|
||||
};
|
||||
ReactNodeView.prototype._handleRef = function (node) {
|
||||
var contentDOM = this.contentDOMWrapper || this.contentDOM;
|
||||
// move the contentDOM node inside the inner reference after rendering
|
||||
if (node && contentDOM && !node.contains(contentDOM)) {
|
||||
node.appendChild(contentDOM);
|
||||
}
|
||||
};
|
||||
ReactNodeView.prototype.render = function (props, forwardRef) {
|
||||
var _this = this;
|
||||
if (props === void 0) { props = {}; }
|
||||
if (!this.options.component)
|
||||
return null;
|
||||
return (_jsx(this.options.component, __assign({}, props, { editor: this.editor, getPos: this.getPos, node: this.node, forwardRef: forwardRef, updateAttributes: function (attr) { return _this.updateAttributes(attr); } })));
|
||||
};
|
||||
ReactNodeView.prototype.updateAttributes = function (attributes) {
|
||||
var _this = this;
|
||||
this.editor.commands.command(function (_a) {
|
||||
var tr = _a.tr;
|
||||
if (typeof _this.getPos === "boolean")
|
||||
return false;
|
||||
var pos = _this.getPos();
|
||||
tr.setNodeMarkup(pos, undefined, __assign(__assign({}, _this.node.attrs), attributes));
|
||||
return true;
|
||||
});
|
||||
};
|
||||
ReactNodeView.prototype.update = function (node, _decorations, _innerDecorations
|
||||
// _innerDecorations?: Array<Decoration>,
|
||||
// validUpdate: (currentNode: PMNode, newNode: PMNode) => boolean = () => true
|
||||
) {
|
||||
var _this = this;
|
||||
// @see https://github.com/ProseMirror/prosemirror/issues/648
|
||||
var isValidUpdate = this.node.type === node.type; // && validUpdate(this.node, node);
|
||||
if (!isValidUpdate) {
|
||||
return false;
|
||||
}
|
||||
// if (this.domRef && !this.node.sameMarkup(node)) {
|
||||
// this.setDomAttrs(node, this.domRef);
|
||||
// }
|
||||
// View should not process a re-render if this is false.
|
||||
// We dont want to destroy the view, so we return true.
|
||||
if (!this.viewShouldUpdate(node)) {
|
||||
this.node = node;
|
||||
return true;
|
||||
}
|
||||
this.node = node;
|
||||
this.renderReactComponent(function () {
|
||||
return _this.render(_this.options.props, _this.handleRef);
|
||||
});
|
||||
return true;
|
||||
};
|
||||
ReactNodeView.prototype.ignoreMutation = function (mutation) {
|
||||
if (!this.dom || !this.contentDOM) {
|
||||
return true;
|
||||
}
|
||||
// TODO if (typeof this.options.ignoreMutation === 'function') {
|
||||
// return this.options.ignoreMutation({ mutation })
|
||||
// }
|
||||
// a leaf/atom node is like a black box for ProseMirror
|
||||
// and should be fully handled by the node view
|
||||
if (this.node.isLeaf || this.node.isAtom) {
|
||||
return true;
|
||||
}
|
||||
// ProseMirror should handle any selections
|
||||
if (mutation.type === "selection") {
|
||||
return false;
|
||||
}
|
||||
// try to prevent a bug on mobiles that will break node views on enter
|
||||
// this is because ProseMirror can’t preventDispatch on enter
|
||||
// this will lead to a re-render of the node view on enter
|
||||
// see: https://github.com/ueberdosis/tiptap/issues/1214
|
||||
if (this.dom.contains(mutation.target) &&
|
||||
mutation.type === "childList" &&
|
||||
this.editor.isFocused) {
|
||||
var changedNodes = __spreadArray(__spreadArray([], __read(Array.from(mutation.addedNodes)), false), __read(Array.from(mutation.removedNodes)), false);
|
||||
// we’ll check if every changed node is contentEditable
|
||||
// to make sure it’s probably mutated by ProseMirror
|
||||
if (changedNodes.every(function (node) { return node.isContentEditable; })) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
// we will allow mutation contentDOM with attributes
|
||||
// so we can for example adding classes within our node view
|
||||
if (this.contentDOM === mutation.target && mutation.type === "attributes") {
|
||||
return true;
|
||||
}
|
||||
// ProseMirror should handle any changes within contentDOM
|
||||
if (this.contentDOM.contains(mutation.target)) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
ReactNodeView.prototype.viewShouldUpdate = function (nextNode) {
|
||||
if (this.options.shouldUpdate)
|
||||
return this.options.shouldUpdate(this.node, nextNode);
|
||||
return true;
|
||||
};
|
||||
/**
|
||||
* Copies the attributes from a ProseMirror Node to a DOM node.
|
||||
* @param node The Prosemirror Node from which to source the attributes
|
||||
*/
|
||||
ReactNodeView.prototype.setDomAttrs = function (node, element) {
|
||||
Object.keys(node.attrs || {}).forEach(function (attr) {
|
||||
element.setAttribute(attr, node.attrs[attr]);
|
||||
});
|
||||
};
|
||||
Object.defineProperty(ReactNodeView.prototype, "dom", {
|
||||
get: function () {
|
||||
return this.domRef;
|
||||
},
|
||||
enumerable: false,
|
||||
configurable: true
|
||||
});
|
||||
ReactNodeView.prototype.destroy = function () {
|
||||
if (!this.domRef) {
|
||||
return;
|
||||
}
|
||||
this.portalProviderAPI.remove(this.domRef);
|
||||
// @ts-ignore NEW PM API
|
||||
this.domRef = undefined;
|
||||
this.contentDOM = undefined;
|
||||
};
|
||||
ReactNodeView.fromComponent = function (component, options) {
|
||||
return function (_a) {
|
||||
var node = _a.node, getPos = _a.getPos, editor = _a.editor;
|
||||
return new ReactNodeView(node, editor, getPos, editor.storage.portalProviderAPI, editor.storage.eventDispatcher, __assign(__assign({}, options), { component: component })).init();
|
||||
};
|
||||
};
|
||||
return ReactNodeView;
|
||||
}());
|
||||
export default ReactNodeView;
|
||||
function isiOS() {
|
||||
return ([
|
||||
"iPad Simulator",
|
||||
"iPhone Simulator",
|
||||
"iPod Simulator",
|
||||
"iPad",
|
||||
"iPhone",
|
||||
"iPod",
|
||||
].includes(navigator.platform) ||
|
||||
// iPad on iOS 13 detection
|
||||
(navigator.userAgent.includes("Mac") && "ontouchend" in document));
|
||||
}
|
||||
Reference in New Issue
Block a user