@opentiny/fluent-editor
Version:
A rich text editor based on Quill 2.0, which extends rich modules and formats on the basis of Quill. It's powerful and out-of-the-box.
93 lines (92 loc) • 3.57 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
function setupAwareness(options, defaultAwareness) {
if (!defaultAwareness) return null;
const awareness = defaultAwareness;
if (options == null ? void 0 : options.state) {
awareness.setLocalStateField("user", options.state);
}
return awareness;
}
function bindAwarenessToCursors(awareness, cursorsModule, quill, yText, Yjs) {
if (!cursorsModule || !awareness) return;
const doc = yText.doc;
const updateCursor = (clientId, state) => {
try {
if ((state == null ? void 0 : state.cursor) && clientId !== awareness.clientID) {
const user = state.user || {};
const color = user.color || "#ff6b6b";
const name = user.name || `User ${clientId}`;
cursorsModule.createCursor(clientId.toString(), name, color);
const anchor = Yjs.createAbsolutePositionFromRelativePosition(Yjs.createRelativePositionFromJSON(state.cursor.anchor), doc);
const head = Yjs.createAbsolutePositionFromRelativePosition(Yjs.createRelativePositionFromJSON(state.cursor.head), doc);
if (anchor && head && anchor.type === yText && clientId) {
setTimeout(() => {
cursorsModule.moveCursor(clientId.toString(), {
index: anchor.index,
length: head.index - anchor.index
});
}, 0);
}
} else {
cursorsModule.removeCursor(clientId.toString());
}
} catch (err) {
console.error("Cursor update failed:", err);
}
};
const selectionChangeHandler = (range) => {
setTimeout(() => {
var _a;
if (range) {
const anchor = Yjs.createRelativePositionFromTypeIndex(yText, range.index);
const head = Yjs.createRelativePositionFromTypeIndex(yText, range.index + range.length);
const currentState = awareness.getLocalState();
if (!(currentState == null ? void 0 : currentState.cursor) || !Yjs.compareRelativePositions(anchor, currentState.cursor.anchor) || !Yjs.compareRelativePositions(head, currentState.cursor.head)) {
awareness.setLocalStateField("cursor", { anchor, head });
}
} else {
if (((_a = awareness.getLocalState()) == null ? void 0 : _a.cursor) !== null) {
awareness.setLocalStateField("cursor", null);
}
}
}, 0);
};
const changeHandler = ({ added, updated, removed }) => {
if (quill.composition.isComposing) return;
const states = awareness.getStates();
added.forEach((id) => {
updateCursor(id, states.get(id));
});
updated.forEach((id) => {
updateCursor(id, states.get(id));
});
removed.forEach((id) => {
cursorsModule.removeCursor(id.toString());
});
};
awareness.on("change", changeHandler);
quill.on("editor-change", (eventName, ...args) => {
if (quill.composition.isComposing) return;
if (eventName === "text-change") {
if (args[2] === "user") {
const range = quill.getSelection();
selectionChangeHandler(range);
}
} else if (eventName === "selection-change") {
if (args[2] === "user") {
selectionChangeHandler(args[0]);
}
}
});
awareness.getStates().forEach((state, clientId) => {
updateCursor(clientId, state);
});
return () => {
awareness.off("change", changeHandler);
quill.off("editor-change", selectionChangeHandler);
};
}
exports.bindAwarenessToCursors = bindAwarenessToCursors;
exports.setupAwareness = setupAwareness;
//# sourceMappingURL=awareness.cjs.js.map