matrix-react-sdk
Version:
SDK for matrix.org using React
837 lines (823 loc) • 138 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.REGEX_EMOTICON = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _emoticon = _interopRequireDefault(require("emojibase-regex/emoticon"));
var _logger = require("matrix-js-sdk/src/logger");
var _emojibaseBindings = require("@matrix-org/emojibase-bindings");
var _history = _interopRequireDefault(require("../../../editor/history"));
var _caret = require("../../../editor/caret");
var _operations = require("../../../editor/operations");
var _dom = require("../../../editor/dom");
var _Autocomplete = _interopRequireWildcard(require("../rooms/Autocomplete"));
var _parts = require("../../../editor/parts");
var _deserialize = require("../../../editor/deserialize");
var _render = require("../../../editor/render");
var _SettingsStore = _interopRequireDefault(require("../../../settings/SettingsStore"));
var _Keyboard = require("../../../Keyboard");
var _SlashCommands = require("../../../SlashCommands");
var _range = _interopRequireDefault(require("../../../editor/range"));
var _MessageComposerFormatBar = _interopRequireWildcard(require("./MessageComposerFormatBar"));
var _KeyBindingsManager = require("../../../KeyBindingsManager");
var _KeyboardShortcuts = require("../../../accessibility/KeyboardShortcuts");
var _languageHandler = require("../../../languageHandler");
var _linkifyMatrix = require("../../../linkify-matrix");
var _SDKContext = require("../../../contexts/SDKContext");
var _MatrixClientPeg = require("../../../MatrixClientPeg");
var _LandmarkNavigation = require("../../../accessibility/LandmarkNavigation");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
/*
Copyright 2024 New Vector Ltd.
Copyright 2019-2021 The Matrix.org Foundation C.I.C.
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/
// matches emoticons which follow the start of a line or whitespace
const REGEX_EMOTICON_WHITESPACE = new RegExp("(?:^|\\s)(" + _emoticon.default.source + ")\\s|:^$");
const REGEX_EMOTICON = exports.REGEX_EMOTICON = new RegExp("(?:^|\\s)(" + _emoticon.default.source + ")$");
const SURROUND_WITH_CHARACTERS = ['"', "_", "`", "'", "*", "~", "$"];
const SURROUND_WITH_DOUBLE_CHARACTERS = new Map([["(", ")"], ["[", "]"], ["{", "}"], ["<", ">"]]);
function ctrlShortcutLabel(key, needsShift = false, needsAlt = false) {
return (_Keyboard.IS_MAC ? "⌘" : (0, _languageHandler._t)(_KeyboardShortcuts.ALTERNATE_KEY_NAME[_Keyboard.Key.CONTROL])) + (needsShift ? "+" + (0, _languageHandler._t)(_KeyboardShortcuts.ALTERNATE_KEY_NAME[_Keyboard.Key.SHIFT]) : "") + (needsAlt ? "+" + (0, _languageHandler._t)(_KeyboardShortcuts.ALTERNATE_KEY_NAME[_Keyboard.Key.ALT]) : "") + "+" + key;
}
function cloneSelection(selection) {
return {
anchorNode: selection.anchorNode,
anchorOffset: selection.anchorOffset,
focusNode: selection.focusNode,
focusOffset: selection.focusOffset,
isCollapsed: selection.isCollapsed,
rangeCount: selection.rangeCount,
type: selection.type
};
}
function selectionEquals(a, b) {
return a.anchorNode === b.anchorNode && a.anchorOffset === b.anchorOffset && a.focusNode === b.focusNode && a.focusOffset === b.focusOffset && a.isCollapsed === b.isCollapsed && a.rangeCount === b.rangeCount && a.type === b.type;
}
class BasicMessageEditor extends _react.default.Component {
constructor(props) {
super(props);
(0, _defineProperty2.default)(this, "editorRef", /*#__PURE__*/(0, _react.createRef)());
(0, _defineProperty2.default)(this, "autocompleteRef", /*#__PURE__*/(0, _react.createRef)());
(0, _defineProperty2.default)(this, "formatBarRef", /*#__PURE__*/(0, _react.createRef)());
(0, _defineProperty2.default)(this, "modifiedFlag", false);
(0, _defineProperty2.default)(this, "isIMEComposing", false);
(0, _defineProperty2.default)(this, "hasTextSelected", false);
(0, _defineProperty2.default)(this, "isSafari", void 0);
(0, _defineProperty2.default)(this, "_isCaretAtEnd", false);
(0, _defineProperty2.default)(this, "lastCaret", void 0);
(0, _defineProperty2.default)(this, "lastSelection", null);
(0, _defineProperty2.default)(this, "useMarkdownHandle", void 0);
(0, _defineProperty2.default)(this, "emoticonSettingHandle", void 0);
(0, _defineProperty2.default)(this, "shouldShowPillAvatarSettingHandle", void 0);
(0, _defineProperty2.default)(this, "surroundWithHandle", void 0);
(0, _defineProperty2.default)(this, "historyManager", new _history.default());
(0, _defineProperty2.default)(this, "updateEditorState", (selection, inputType, diff) => {
if (!this.editorRef.current) return;
(0, _render.renderModel)(this.editorRef.current, this.props.model);
if (selection) {
// set the caret/selection
try {
(0, _caret.setSelection)(this.editorRef.current, this.props.model, selection);
} catch (err) {
_logger.logger.error(err);
}
// if caret selection is a range, take the end position
const position = selection instanceof _range.default ? selection.end : selection;
this.setLastCaretFromPosition(position);
}
const {
isEmpty
} = this.props.model;
if (this.props.placeholder) {
if (isEmpty) {
this.showPlaceholder();
} else {
this.hidePlaceholder();
}
}
if (isEmpty) {
this.formatBarRef.current?.hide();
}
this.setState({
autoComplete: this.props.model.autoComplete ?? undefined,
// if a change is happening then clear the showVisualBell
showVisualBell: diff ? false : this.state.showVisualBell
});
this.historyManager.tryPush(this.props.model, selection, inputType, diff);
// inputType is falsy during initial mount, don't consider re-loading the draft as typing
let isTyping = !this.props.model.isEmpty && !!inputType;
// If the user is entering a command, only consider them typing if it is one which sends a message into the room
if (isTyping && this.props.model.parts[0].type === "command") {
const {
cmd
} = (0, _SlashCommands.parseCommandString)(this.props.model.parts[0].text);
const command = _SlashCommands.CommandMap.get(cmd);
if (!command?.isEnabled(_MatrixClientPeg.MatrixClientPeg.get()) || command.category !== _SlashCommands.CommandCategories.messages) {
isTyping = false;
}
}
_SDKContext.SdkContextClass.instance.typingStore.setSelfTyping(this.props.room.roomId, this.props.threadId ?? null, isTyping);
this.props.onChange?.(selection, inputType, diff);
});
(0, _defineProperty2.default)(this, "onCompositionStart", () => {
this.isIMEComposing = true;
// even if the model is empty, the composition text shouldn't be mixed with the placeholder
this.hidePlaceholder();
});
(0, _defineProperty2.default)(this, "onCompositionEnd", () => {
this.isIMEComposing = false;
// some browsers (Chrome) don't fire an input event after ending a composition,
// so trigger a model update after the composition is done by calling the input handler.
// however, modifying the DOM (caused by the editor model update) from the compositionend handler seems
// to confuse the IME in Chrome, likely causing https://github.com/vector-im/element-web/issues/10913 ,
// so we do it async
// however, doing this async seems to break things in Safari for some reason, so browser sniff.
if (this.isSafari) {
this.onInput({
inputType: "insertCompositionText"
});
} else {
Promise.resolve().then(() => {
this.onInput({
inputType: "insertCompositionText"
});
});
}
});
(0, _defineProperty2.default)(this, "onCutCopy", (event, type) => {
const selection = document.getSelection();
const text = selection.toString();
if (text && this.editorRef.current) {
const {
model
} = this.props;
const range = (0, _dom.getRangeForSelection)(this.editorRef.current, model, selection);
const selectedParts = range.parts.map(p => p.serialize());
event.clipboardData.setData("application/x-element-composer", JSON.stringify(selectedParts));
event.clipboardData.setData("text/plain", text); // so plain copy/paste works
if (type === "cut") {
// Remove the text, updating the model as appropriate
this.modifiedFlag = true;
(0, _operations.replaceRangeAndMoveCaret)(range, []);
}
event.preventDefault();
}
});
(0, _defineProperty2.default)(this, "onCopy", event => {
this.onCutCopy(event, "copy");
});
(0, _defineProperty2.default)(this, "onCut", event => {
this.onCutCopy(event, "cut");
});
(0, _defineProperty2.default)(this, "onPasteHandler", (event, data) => {
event.preventDefault(); // we always handle the paste ourselves
if (!this.editorRef.current) return;
if (this.props.onPaste?.(event, data, this.props.model)) {
// to prevent double handling, allow props.onPaste to skip internal onPaste
return true;
}
const {
model
} = this.props;
const {
partCreator
} = model;
const plainText = data.getData("text/plain");
const partsText = data.getData("application/x-element-composer");
let parts;
if (partsText) {
const serializedTextParts = JSON.parse(partsText);
parts = serializedTextParts.map(p => partCreator.deserializePart(p));
} else {
parts = (0, _deserialize.parsePlainTextMessage)(plainText, partCreator, {
shouldEscape: false
});
}
this.modifiedFlag = true;
const range = (0, _dom.getRangeForSelection)(this.editorRef.current, model, document.getSelection());
// If the user is pasting a link, and has a range selected which is not a link, wrap the range with the link
if (plainText && range.length > 0 && _linkifyMatrix.linkify.test(plainText) && !_linkifyMatrix.linkify.test(range.text)) {
(0, _operations.formatRangeAsLink)(range, plainText);
} else {
(0, _operations.replaceRangeAndMoveCaret)(range, parts);
}
});
(0, _defineProperty2.default)(this, "onPaste", event => {
return this.onPasteHandler(event, event.clipboardData);
});
(0, _defineProperty2.default)(this, "onBeforeInput", event => {
// ignore any input while doing IME compositions
if (this.isIMEComposing) {
return;
}
if (event.inputType === "insertFromPaste" && event.dataTransfer) {
this.onPasteHandler(event, event.dataTransfer);
}
});
(0, _defineProperty2.default)(this, "onInput", event => {
if (!this.editorRef.current) return;
// ignore any input while doing IME compositions
if (this.isIMEComposing) {
return;
}
this.modifiedFlag = true;
const sel = document.getSelection();
const {
caret,
text
} = (0, _dom.getCaretOffsetAndText)(this.editorRef.current, sel);
this.props.model.update(text, event.inputType, caret);
});
(0, _defineProperty2.default)(this, "onBlur", () => {
document.removeEventListener("selectionchange", this.onSelectionChange);
});
(0, _defineProperty2.default)(this, "onFocus", () => {
document.addEventListener("selectionchange", this.onSelectionChange);
// force to recalculate
this.lastSelection = null;
this.refreshLastCaretIfNeeded();
});
(0, _defineProperty2.default)(this, "onSelectionChange", () => {
if (!this.editorRef.current) return;
const {
isEmpty
} = this.props.model;
this.refreshLastCaretIfNeeded();
const selection = document.getSelection();
if (this.hasTextSelected && selection.isCollapsed) {
this.hasTextSelected = false;
this.formatBarRef.current?.hide();
} else if (!selection.isCollapsed && !isEmpty) {
this.hasTextSelected = true;
const range = (0, _dom.getRangeForSelection)(this.editorRef.current, this.props.model, selection);
if (this.formatBarRef.current && this.state.useMarkdown && !!range.text.trim()) {
const selectionRect = selection.getRangeAt(0).getBoundingClientRect();
this.formatBarRef.current.showAt(selectionRect);
}
}
});
(0, _defineProperty2.default)(this, "onKeyDown", event => {
if (!this.editorRef.current) return;
if (this.isSafari && event.which == 229) {
// Swallow the extra keyDown by Safari
event.stopPropagation();
return;
}
const model = this.props.model;
let handled = false;
if (this.state.surroundWith && document.getSelection().type !== "Caret") {
// This surrounds the selected text with a character. This is
// intentionally left out of the keybinding manager as the keybinds
// here shouldn't be changeable
const selectionRange = (0, _dom.getRangeForSelection)(this.editorRef.current, this.props.model, document.getSelection());
// trim the range as we want it to exclude leading/trailing spaces
selectionRange.trim();
if ([...SURROUND_WITH_DOUBLE_CHARACTERS.keys(), ...SURROUND_WITH_CHARACTERS].includes(event.key)) {
this.historyManager.ensureLastChangesPushed(this.props.model);
this.modifiedFlag = true;
(0, _operations.toggleInlineFormat)(selectionRange, event.key, SURROUND_WITH_DOUBLE_CHARACTERS.get(event.key));
handled = true;
}
}
const navAction = (0, _KeyBindingsManager.getKeyBindingsManager)().getNavigationAction(event);
if (navAction === _KeyboardShortcuts.KeyBindingAction.NextLandmark || navAction === _KeyboardShortcuts.KeyBindingAction.PreviousLandmark) {
_LandmarkNavigation.LandmarkNavigation.findAndFocusNextLandmark(_LandmarkNavigation.Landmark.MESSAGE_COMPOSER_OR_HOME, navAction === _KeyboardShortcuts.KeyBindingAction.PreviousLandmark);
handled = true;
}
const autocompleteAction = (0, _KeyBindingsManager.getKeyBindingsManager)().getAutocompleteAction(event);
const accessibilityAction = (0, _KeyBindingsManager.getKeyBindingsManager)().getAccessibilityAction(event);
if (model.autoComplete?.hasCompletions()) {
const autoComplete = model.autoComplete;
switch (autocompleteAction) {
case _KeyboardShortcuts.KeyBindingAction.ForceCompleteAutocomplete:
case _KeyboardShortcuts.KeyBindingAction.CompleteAutocomplete:
this.historyManager.ensureLastChangesPushed(this.props.model);
this.modifiedFlag = true;
autoComplete.confirmCompletion();
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.PrevSelectionInAutocomplete:
autoComplete.selectPreviousSelection();
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.NextSelectionInAutocomplete:
autoComplete.selectNextSelection();
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.CancelAutocomplete:
autoComplete.onEscape(event);
handled = true;
break;
}
} else if (autocompleteAction === _KeyboardShortcuts.KeyBindingAction.ForceCompleteAutocomplete && !this.state.showVisualBell) {
// there is no current autocomplete window, try to open it
this.tabCompleteName();
handled = true;
} else if ([_KeyboardShortcuts.KeyBindingAction.Delete, _KeyboardShortcuts.KeyBindingAction.Backspace].includes(accessibilityAction)) {
this.formatBarRef.current?.hide();
}
if (handled) {
event.preventDefault();
event.stopPropagation();
return;
}
const action = (0, _KeyBindingsManager.getKeyBindingsManager)().getMessageComposerAction(event);
switch (action) {
case _KeyboardShortcuts.KeyBindingAction.FormatBold:
this.onFormatAction(_MessageComposerFormatBar.Formatting.Bold);
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.FormatItalics:
this.onFormatAction(_MessageComposerFormatBar.Formatting.Italics);
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.FormatCode:
this.onFormatAction(_MessageComposerFormatBar.Formatting.Code);
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.FormatQuote:
this.onFormatAction(_MessageComposerFormatBar.Formatting.Quote);
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.FormatLink:
this.onFormatAction(_MessageComposerFormatBar.Formatting.InsertLink);
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.EditRedo:
{
const history = this.historyManager.redo();
if (history) {
const {
parts,
caret
} = history;
// pass matching inputType so historyManager doesn't push echo
// when invoked from rerender callback.
model.reset(parts, caret, "historyRedo");
}
handled = true;
break;
}
case _KeyboardShortcuts.KeyBindingAction.EditUndo:
{
const history = this.historyManager.undo(this.props.model);
if (history) {
const {
parts,
caret
} = history;
// pass matching inputType so historyManager doesn't push echo
// when invoked from rerender callback.
model.reset(parts, caret, "historyUndo");
}
handled = true;
break;
}
case _KeyboardShortcuts.KeyBindingAction.NewLine:
this.insertText("\n");
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.MoveCursorToStart:
(0, _caret.setSelection)(this.editorRef.current, model, {
index: 0,
offset: 0
});
handled = true;
break;
case _KeyboardShortcuts.KeyBindingAction.MoveCursorToEnd:
(0, _caret.setSelection)(this.editorRef.current, model, {
index: model.parts.length - 1,
offset: model.parts[model.parts.length - 1].text.length
});
handled = true;
break;
}
if (handled) {
event.preventDefault();
event.stopPropagation();
}
});
(0, _defineProperty2.default)(this, "onAutoCompleteConfirm", completion => {
this.modifiedFlag = true;
this.props.model.autoComplete?.onComponentConfirm(completion);
});
(0, _defineProperty2.default)(this, "onAutoCompleteSelectionChange", completionIndex => {
this.modifiedFlag = true;
this.setState({
completionIndex
});
});
(0, _defineProperty2.default)(this, "configureUseMarkdown", () => {
const useMarkdown = _SettingsStore.default.getValue("MessageComposerInput.useMarkdown");
this.setState({
useMarkdown
});
if (!useMarkdown && this.formatBarRef.current) {
this.formatBarRef.current.hide();
}
});
(0, _defineProperty2.default)(this, "configureEmoticonAutoReplace", () => {
this.props.model.setTransformCallback(this.transform);
});
(0, _defineProperty2.default)(this, "configureShouldShowPillAvatar", () => {
const showPillAvatar = _SettingsStore.default.getValue("Pill.shouldShowPillAvatar");
this.setState({
showPillAvatar
});
});
(0, _defineProperty2.default)(this, "surroundWithSettingChanged", () => {
const surroundWith = _SettingsStore.default.getValue("MessageComposerInput.surroundWith");
this.setState({
surroundWith
});
});
(0, _defineProperty2.default)(this, "transform", documentPosition => {
const shouldReplace = _SettingsStore.default.getValue("MessageComposerInput.autoReplaceEmoji");
if (shouldReplace) this.replaceEmoticon(documentPosition, REGEX_EMOTICON_WHITESPACE);
});
(0, _defineProperty2.default)(this, "onFormatAction", action => {
if (!this.state.useMarkdown || !this.editorRef.current) {
return;
}
const range = (0, _dom.getRangeForSelection)(this.editorRef.current, this.props.model, document.getSelection());
this.historyManager.ensureLastChangesPushed(this.props.model);
this.modifiedFlag = true;
(0, _operations.formatRange)(range, action);
});
this.state = {
showPillAvatar: _SettingsStore.default.getValue("Pill.shouldShowPillAvatar"),
useMarkdown: _SettingsStore.default.getValue("MessageComposerInput.useMarkdown"),
surroundWith: _SettingsStore.default.getValue("MessageComposerInput.surroundWith"),
showVisualBell: false
};
const ua = navigator.userAgent.toLowerCase();
this.isSafari = ua.includes("safari/") && !ua.includes("chrome/");
this.useMarkdownHandle = _SettingsStore.default.watchSetting("MessageComposerInput.useMarkdown", null, this.configureUseMarkdown);
this.emoticonSettingHandle = _SettingsStore.default.watchSetting("MessageComposerInput.autoReplaceEmoji", null, this.configureEmoticonAutoReplace);
this.configureEmoticonAutoReplace();
this.shouldShowPillAvatarSettingHandle = _SettingsStore.default.watchSetting("Pill.shouldShowPillAvatar", null, this.configureShouldShowPillAvatar);
this.surroundWithHandle = _SettingsStore.default.watchSetting("MessageComposerInput.surroundWith", null, this.surroundWithSettingChanged);
}
componentDidUpdate(prevProps) {
// We need to re-check the placeholder when the enabled state changes because it causes the
// placeholder element to remount, which gets rid of the `::before` class. Re-evaluating the
// placeholder means we get a proper `::before` with the placeholder.
const enabledChange = this.props.disabled !== prevProps.disabled;
const placeholderChanged = this.props.placeholder !== prevProps.placeholder;
if (this.props.placeholder && (placeholderChanged || enabledChange)) {
const {
isEmpty
} = this.props.model;
if (isEmpty) {
this.showPlaceholder();
} else {
this.hidePlaceholder();
}
}
}
replaceEmoticon(caretPosition, regex) {
const {
model
} = this.props;
const range = model.startRange(caretPosition);
// expand range max 9 characters backwards from caretPosition,
// as a space to look for an emoticon
let n = 9;
range.expandBackwardsWhile((index, offset) => {
const part = model.parts[index];
n -= 1;
return n >= 0 && [_parts.Type.Plain, _parts.Type.PillCandidate, _parts.Type.Newline].includes(part.type);
});
const emoticonMatch = regex.exec(range.text);
// ignore matches at start of proper substrings
// so xd will not match if the string was "mixd 123456"
// and we are lookinh at xd 123456 part of the string
if (emoticonMatch && (n >= 0 || emoticonMatch.index !== 0)) {
const query = emoticonMatch[1];
// variations of plaintext emoitcons(E.g. :P vs :p vs :-P) are handled upstream by the emojibase-bindings library
const data = _emojibaseBindings.EMOTICON_TO_EMOJI.get(query);
if (data) {
const {
partCreator
} = model;
const firstMatch = emoticonMatch[0];
const moveStart = firstMatch[0] === " " ? 1 : 0;
// we need the range to only comprise of the emoticon
// because we'll replace the whole range with an emoji,
// so move the start forward to the start of the emoticon.
// Take + 1 because index is reported without the possible preceding space.
range.moveStartForwards(emoticonMatch.index + moveStart);
// If the end is a trailing space/newline move end backwards, so that we don't replace it
if (["\n", " "].includes(firstMatch[firstMatch.length - 1])) {
range.moveEndBackwards(1);
}
// this returns the amount of added/removed characters during the replace
// so the caret position can be adjusted.
return range.replace([partCreator.emoji(data.unicode)]);
}
}
}
showPlaceholder() {
this.editorRef.current?.style.setProperty("--placeholder", `'${CSS.escape(this.props.placeholder ?? "")}'`);
this.editorRef.current?.classList.add("mx_BasicMessageComposer_inputEmpty");
}
hidePlaceholder() {
this.editorRef.current?.classList.remove("mx_BasicMessageComposer_inputEmpty");
this.editorRef.current?.style.removeProperty("--placeholder");
}
isComposing(event) {
// checking the event.isComposing flag just in case any browser out there
// emits events related to the composition after compositionend
// has been fired
// From https://www.stum.de/2016/06/24/handling-ime-events-in-javascript/
// Safari emits an additional keyDown after compositionend
return !!(this.isIMEComposing || event.nativeEvent && event.nativeEvent.isComposing);
}
insertText(textToInsert, inputType = "insertText") {
if (!this.editorRef.current) return;
const sel = document.getSelection();
const {
caret,
text
} = (0, _dom.getCaretOffsetAndText)(this.editorRef.current, sel);
const newText = text.slice(0, caret.offset) + textToInsert + text.slice(caret.offset);
caret.offset += textToInsert.length;
this.modifiedFlag = true;
this.props.model.update(newText, inputType, caret);
}
// this is used later to see if we need to recalculate the caret
// on selectionchange. If it is just a consequence of typing
// we don't need to. But if the user is navigating the caret without input
// we need to recalculate it, to be able to know where to insert content after
// losing focus
setLastCaretFromPosition(position) {
const {
model
} = this.props;
this._isCaretAtEnd = position.isAtEnd(model);
this.lastCaret = position.asOffset(model);
this.lastSelection = cloneSelection(document.getSelection());
}
refreshLastCaretIfNeeded() {
// XXX: needed when going up and down in editing messages ... not sure why yet
// because the editors should stop doing this when when blurred ...
// maybe it's on focus and the _editorRef isn't available yet or something.
if (!this.editorRef.current) {
return;
}
const selection = document.getSelection();
if (!this.lastSelection || !selectionEquals(this.lastSelection, selection)) {
this.lastSelection = cloneSelection(selection);
const {
caret,
text
} = (0, _dom.getCaretOffsetAndText)(this.editorRef.current, selection);
this.lastCaret = caret;
this._isCaretAtEnd = caret.offset === text.length;
}
return this.lastCaret;
}
clearUndoHistory() {
this.historyManager.clear();
}
getCaret() {
return this.lastCaret;
}
isSelectionCollapsed() {
return !this.lastSelection || !!this.lastSelection.isCollapsed;
}
isCaretAtStart() {
return this.getCaret().offset === 0;
}
isCaretAtEnd() {
return this._isCaretAtEnd;
}
async tabCompleteName() {
try {
await new Promise(resolve => this.setState({
showVisualBell: false
}, resolve));
const {
model
} = this.props;
const caret = this.getCaret();
const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
const range = model.startRange(position);
range.expandBackwardsWhile((index, offset, part) => {
return part.text[offset] !== " " && part.text[offset] !== "+" && (part.type === _parts.Type.Plain || part.type === _parts.Type.PillCandidate || part.type === _parts.Type.Command);
});
const {
partCreator
} = model;
// await for auto-complete to be open
await model.transform(() => {
const addedLen = range.replace([partCreator.pillCandidate(range.text)]);
return model.positionForOffset(caret.offset + addedLen, true);
});
// Don't try to do things with the autocomplete if there is none shown
if (model.autoComplete) {
await model.autoComplete.startSelection();
if (!model.autoComplete.hasSelection()) {
this.setState({
showVisualBell: true
});
model.autoComplete.close();
}
} else {
this.setState({
showVisualBell: true
});
}
} catch (err) {
_logger.logger.error(err);
}
}
isModified() {
return this.modifiedFlag;
}
componentWillUnmount() {
document.removeEventListener("selectionchange", this.onSelectionChange);
this.editorRef.current?.removeEventListener("beforeinput", this.onBeforeInput, true);
this.editorRef.current?.removeEventListener("input", this.onInput, true);
this.editorRef.current?.removeEventListener("compositionstart", this.onCompositionStart, true);
this.editorRef.current?.removeEventListener("compositionend", this.onCompositionEnd, true);
_SettingsStore.default.unwatchSetting(this.useMarkdownHandle);
_SettingsStore.default.unwatchSetting(this.emoticonSettingHandle);
_SettingsStore.default.unwatchSetting(this.shouldShowPillAvatarSettingHandle);
_SettingsStore.default.unwatchSetting(this.surroundWithHandle);
}
componentDidMount() {
const model = this.props.model;
model.setUpdateCallback(this.updateEditorState);
const partCreator = model.partCreator;
// TODO: does this allow us to get rid of EditorStateTransfer?
// not really, but we could not serialize the parts, and just change the autoCompleter
partCreator.setAutoCompleteCreator((0, _parts.getAutoCompleteCreator)(() => this.autocompleteRef.current, query => new Promise(resolve => this.setState({
query
}, resolve))));
// initial render of model
this.updateEditorState(this.getInitialCaretPosition());
// attach input listener by hand so React doesn't proxy the events,
// as the proxied event doesn't support inputType, which we need.
this.editorRef.current?.addEventListener("beforeinput", this.onBeforeInput, true);
this.editorRef.current?.addEventListener("input", this.onInput, true);
this.editorRef.current?.addEventListener("compositionstart", this.onCompositionStart, true);
this.editorRef.current?.addEventListener("compositionend", this.onCompositionEnd, true);
this.editorRef.current?.focus();
}
getInitialCaretPosition() {
let caretPosition;
if (this.props.initialCaret) {
// if restoring state from a previous editor,
// restore caret position from the state
const caret = this.props.initialCaret;
caretPosition = this.props.model.positionForOffset(caret.offset, caret.atNodeEnd);
} else {
// otherwise, set it at the end
caretPosition = this.props.model.getPositionAtEnd();
}
return caretPosition;
}
render() {
let autoComplete;
if (this.state.autoComplete && this.state.query) {
const query = this.state.query;
const queryLen = query.length;
autoComplete = /*#__PURE__*/_react.default.createElement("div", {
className: "mx_BasicMessageComposer_AutoCompleteWrapper"
}, /*#__PURE__*/_react.default.createElement(_Autocomplete.default, {
ref: this.autocompleteRef,
query: query,
onConfirm: this.onAutoCompleteConfirm,
onSelectionChange: this.onAutoCompleteSelectionChange,
selection: {
beginning: true,
end: queryLen,
start: queryLen
},
room: this.props.room
}));
}
const wrapperClasses = (0, _classnames.default)("mx_BasicMessageComposer", {
mx_BasicMessageComposer_input_error: this.state.showVisualBell
});
const classes = (0, _classnames.default)("mx_BasicMessageComposer_input", {
mx_BasicMessageComposer_input_shouldShowPillAvatar: this.state.showPillAvatar,
mx_BasicMessageComposer_input_disabled: this.props.disabled
});
const shortcuts = {
[_MessageComposerFormatBar.Formatting.Bold]: ctrlShortcutLabel("B"),
[_MessageComposerFormatBar.Formatting.Italics]: ctrlShortcutLabel("I"),
[_MessageComposerFormatBar.Formatting.Code]: ctrlShortcutLabel("E"),
[_MessageComposerFormatBar.Formatting.Quote]: ctrlShortcutLabel(">", true),
[_MessageComposerFormatBar.Formatting.InsertLink]: ctrlShortcutLabel("L", true)
};
const {
completionIndex
} = this.state;
const hasAutocomplete = !!this.state.autoComplete;
let activeDescendant;
if (hasAutocomplete && completionIndex >= 0) {
activeDescendant = (0, _Autocomplete.generateCompletionDomId)(completionIndex);
}
return /*#__PURE__*/_react.default.createElement("div", {
className: wrapperClasses
}, autoComplete, /*#__PURE__*/_react.default.createElement(_MessageComposerFormatBar.default, {
ref: this.formatBarRef,
onAction: this.onFormatAction,
shortcuts: shortcuts
}), /*#__PURE__*/_react.default.createElement("div", {
className: classes,
contentEditable: this.props.disabled ? undefined : true,
tabIndex: 0,
onBlur: this.onBlur,
onFocus: this.onFocus,
onCopy: this.onCopy,
onCut: this.onCut,
onPaste: this.onPaste,
onKeyDown: this.onKeyDown,
ref: this.editorRef,
"aria-label": this.props.label,
role: "textbox",
"aria-multiline": "true",
"aria-autocomplete": "list",
"aria-haspopup": "listbox",
"aria-expanded": hasAutocomplete ? !this.autocompleteRef.current?.state.hide : undefined,
"aria-owns": hasAutocomplete ? "mx_Autocomplete" : undefined,
"aria-activedescendant": activeDescendant,
dir: "auto",
"aria-disabled": this.props.disabled,
"data-testid": "basicmessagecomposer",
translate: "no"
}));
}
focus() {
this.editorRef.current?.focus();
}
insertMention(userId) {
this.modifiedFlag = true;
const {
model
} = this.props;
const {
partCreator
} = model;
const member = this.props.room.getMember(userId);
const displayName = member ? member.rawDisplayName : userId;
const caret = this.getCaret();
const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
// Insert suffix only if the caret is at the start of the composer
const parts = partCreator.createMentionParts(caret.offset === 0, displayName, userId);
model.transform(() => {
const addedLen = model.insert(parts, position);
return model.positionForOffset(caret.offset + addedLen, true);
});
// refocus on composer, as we just clicked "Mention"
this.focus();
}
insertQuotedMessage(event) {
this.modifiedFlag = true;
const {
model
} = this.props;
const {
partCreator
} = model;
const quoteParts = (0, _deserialize.parseEvent)(event, partCreator, {
isQuotedMessage: true
});
// add two newlines
quoteParts.push(partCreator.newline());
quoteParts.push(partCreator.newline());
model.transform(() => {
const addedLen = model.insert(quoteParts, model.positionForOffset(0));
return model.positionForOffset(addedLen, true);
});
// refocus on composer, as we just clicked "Quote"
this.focus();
}
insertPlaintext(text) {
this.modifiedFlag = true;
const {
model
} = this.props;
const {
partCreator
} = model;
const caret = this.getCaret();
const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
model.transform(() => {
const addedLen = model.insert(partCreator.plainWithEmoji(text), position);
return model.positionForOffset(caret.offset + addedLen, true);
});
}
}
exports.default = BasicMessageEditor;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfY2xhc3NuYW1lcyIsIl9pbnRlcm9wUmVxdWlyZURlZmF1bHQiLCJyZXF1aXJlIiwiX3JlYWN0IiwiX2ludGVyb3BSZXF1aXJlV2lsZGNhcmQiLCJfZW1vdGljb24iLCJfbG9nZ2VyIiwiX2Vtb2ppYmFzZUJpbmRpbmdzIiwiX2hpc3RvcnkiLCJfY2FyZXQiLCJfb3BlcmF0aW9ucyIsIl9kb20iLCJfQXV0b2NvbXBsZXRlIiwiX3BhcnRzIiwiX2Rlc2VyaWFsaXplIiwiX3JlbmRlciIsIl9TZXR0aW5nc1N0b3JlIiwiX0tleWJvYXJkIiwiX1NsYXNoQ29tbWFuZHMiLCJfcmFuZ2UiLCJfTWVzc2FnZUNvbXBvc2VyRm9ybWF0QmFyIiwiX0tleUJpbmRpbmdzTWFuYWdlciIsIl9LZXlib2FyZFNob3J0Y3V0cyIsIl9sYW5ndWFnZUhhbmRsZXIiLCJfbGlua2lmeU1hdHJpeCIsIl9TREtDb250ZXh0IiwiX01hdHJpeENsaWVudFBlZyIsIl9MYW5kbWFya05hdmlnYXRpb24iLCJfZ2V0UmVxdWlyZVdpbGRjYXJkQ2FjaGUiLCJlIiwiV2Vha01hcCIsInIiLCJ0IiwiX19lc01vZHVsZSIsImRlZmF1bHQiLCJoYXMiLCJnZXQiLCJuIiwiX19wcm90b19fIiwiYSIsIk9iamVjdCIsImRlZmluZVByb3BlcnR5IiwiZ2V0T3duUHJvcGVydHlEZXNjcmlwdG9yIiwidSIsImhhc093blByb3BlcnR5IiwiY2FsbCIsImkiLCJzZXQiLCJSRUdFWF9FTU9USUNPTl9XSElURVNQQUNFIiwiUmVnRXhwIiwiRU1PVElDT05fUkVHRVgiLCJzb3VyY2UiLCJSRUdFWF9FTU9USUNPTiIsImV4cG9ydHMiLCJTVVJST1VORF9XSVRIX0NIQVJBQ1RFUlMiLCJTVVJST1VORF9XSVRIX0RPVUJMRV9DSEFSQUNURVJTIiwiTWFwIiwiY3RybFNob3J0Y3V0TGFiZWwiLCJrZXkiLCJuZWVkc1NoaWZ0IiwibmVlZHNBbHQiLCJJU19NQUMiLCJfdCIsIkFMVEVSTkFURV9LRVlfTkFNRSIsIktleSIsIkNPTlRST0wiLCJTSElGVCIsIkFMVCIsImNsb25lU2VsZWN0aW9uIiwic2VsZWN0aW9uIiwiYW5jaG9yTm9kZSIsImFuY2hvck9mZnNldCIsImZvY3VzTm9kZSIsImZvY3VzT2Zmc2V0IiwiaXNDb2xsYXBzZWQiLCJyYW5nZUNvdW50IiwidHlwZSIsInNlbGVjdGlvbkVxdWFscyIsImIiLCJCYXNpY01lc3NhZ2VFZGl0b3IiLCJSZWFjdCIsIkNvbXBvbmVudCIsImNvbnN0cnVjdG9yIiwicHJvcHMiLCJfZGVmaW5lUHJvcGVydHkyIiwiY3JlYXRlUmVmIiwiSGlzdG9yeU1hbmFnZXIiLCJpbnB1dFR5cGUiLCJkaWZmIiwiZWRpdG9yUmVmIiwiY3VycmVudCIsInJlbmRlck1vZGVsIiwibW9kZWwiLCJzZXRTZWxlY3Rpb24iLCJlcnIiLCJsb2dnZXIiLCJlcnJvciIsInBvc2l0aW9uIiwiUmFuZ2UiLCJlbmQiLCJzZXRMYXN0Q2FyZXRGcm9tUG9zaXRpb24iLCJpc0VtcHR5IiwicGxhY2Vob2xkZXIiLCJzaG93UGxhY2Vob2xkZXIiLCJoaWRlUGxhY2Vob2xkZXIiLCJmb3JtYXRCYXJSZWYiLCJoaWRlIiwic2V0U3RhdGUiLCJhdXRvQ29tcGxldGUiLCJ1bmRlZmluZWQiLCJzaG93VmlzdWFsQmVsbCIsInN0YXRlIiwiaGlzdG9yeU1hbmFnZXIiLCJ0cnlQdXNoIiwiaXNUeXBpbmciLCJwYXJ0cyIsImNtZCIsInBhcnNlQ29tbWFuZFN0cmluZyIsInRleHQiLCJjb21tYW5kIiwiQ29tbWFuZE1hcCIsImlzRW5hYmxlZCIsIk1hdHJpeENsaWVudFBlZyIsImNhdGVnb3J5IiwiQ29tbWFuZENhdGVnb3JpZXMiLCJtZXNzYWdlcyIsIlNka0NvbnRleHRDbGFzcyIsImluc3RhbmNlIiwidHlwaW5nU3RvcmUiLCJzZXRTZWxmVHlwaW5nIiwicm9vbSIsInJvb21JZCIsInRocmVhZElkIiwib25DaGFuZ2UiLCJpc0lNRUNvbXBvc2luZyIsImlzU2FmYXJpIiwib25JbnB1dCIsIlByb21pc2UiLCJyZXNvbHZlIiwidGhlbiIsImV2ZW50IiwiZG9jdW1lbnQiLCJnZXRTZWxlY3Rpb24iLCJ0b1N0cmluZyIsInJhbmdlIiwiZ2V0UmFuZ2VGb3JTZWxlY3Rpb24iLCJzZWxlY3RlZFBhcnRzIiwibWFwIiwicCIsInNlcmlhbGl6ZSIsImNsaXBib2FyZERhdGEiLCJzZXREYXRhIiwiSlNPTiIsInN0cmluZ2lmeSIsIm1vZGlmaWVkRmxhZyIsInJlcGxhY2VSYW5nZUFuZE1vdmVDYXJldCIsInByZXZlbnREZWZhdWx0Iiwib25DdXRDb3B5IiwiZGF0YSIsIm9uUGFzdGUiLCJwYXJ0Q3JlYXRvciIsInBsYWluVGV4dCIsImdldERhdGEiLCJwYXJ0c1RleHQiLCJzZXJpYWxpemVkVGV4dFBhcnRzIiwicGFyc2UiLCJkZXNlcmlhbGl6ZVBhcnQiLCJwYXJzZVBsYWluVGV4dE1lc3NhZ2UiLCJzaG91bGRFc2NhcGUiLCJsZW5ndGgiLCJsaW5raWZ5IiwidGVzdCIsImZvcm1hdFJhbmdlQXNMaW5rIiwib25QYXN0ZUhhbmRsZXIiLCJkYXRhVHJhbnNmZXIiLCJzZWwiLCJjYXJldCIsImdldENhcmV0T2Zmc2V0QW5kVGV4dCIsInVwZGF0ZSIsInJlbW92ZUV2ZW50TGlzdGVuZXIiLCJvblNlbGVjdGlvbkNoYW5nZSIsImFkZEV2ZW50TGlzdGVuZXIiLCJsYXN0U2VsZWN0aW9uIiwicmVmcmVzaExhc3RDYXJldElmTmVlZGVkIiwiaGFzVGV4dFNlbGVjdGVkIiwidXNlTWFya2Rvd24iLCJ0cmltIiwic2VsZWN0aW9uUmVjdCIsImdldFJhbmdlQXQiLCJnZXRCb3VuZGluZ0NsaWVudFJlY3QiLCJzaG93QXQiLCJ3aGljaCIsInN0b3BQcm9wYWdhdGlvbiIsImhhbmRsZWQiLCJzdXJyb3VuZFdpdGgiLCJzZWxlY3Rpb25SYW5nZSIsImtleXMiLCJpbmNsdWRlcyIsImVuc3VyZUxhc3RDaGFuZ2VzUHVzaGVkIiwidG9nZ2xlSW5saW5lRm9ybWF0IiwibmF2QWN0aW9uIiwiZ2V0S2V5QmluZGluZ3NNYW5hZ2VyIiwiZ2V0TmF2aWdhdGlvbkFjdGlvbiIsIktleUJpbmRpbmdBY3Rpb24iLCJOZXh0TGFuZG1hcmsiLCJQcmV2aW91c0xhbmRtYXJrIiwiTGFuZG1hcmtOYXZpZ2F0aW9uIiwiZmluZEFuZEZvY3VzTmV4dExhbmRtYXJrIiwiTGFuZG1hcmsiLCJNRVNTQUdFX0NPTVBPU0VSX09SX0hPTUUiLCJhdXRvY29tcGxldGVBY3Rpb24iLCJnZXRBdXRvY29tcGxldGVBY3Rpb24iLCJhY2Nlc3NpYmlsaXR5QWN0aW9uIiwiZ2V0QWNjZXNzaWJpbGl0eUFjdGlvbiIsImhhc0NvbXBsZXRpb25zIiwiRm9yY2VDb21wbGV0ZUF1dG9jb21wbGV0ZSIsIkNvbXBsZXRlQXV0b2NvbXBsZXRlIiwiY29uZmlybUNvbXBsZXRpb24iLCJQcmV2U2VsZWN0aW9uSW5BdXRvY29tcGxldGUiLCJzZWxlY3RQcmV2aW91c1NlbGVjdGlvbiIsIk5leHRTZWxlY3Rpb25JbkF1dG9jb21wbGV0ZSIsInNlbGVjdE5leHRTZWxlY3Rpb24iLCJDYW5jZWxBdXRvY29tcGxldGUiLCJvbkVzY2FwZSIsInRhYkNvbXBsZXRlTmFtZSIsIkRlbGV0ZSIsIkJhY2tzcGFjZSIsImFjdGlvbiIsImdldE1lc3NhZ2VDb21wb3NlckFjdGlvbiIsIkZvcm1hdEJvbGQiLCJvbkZvcm1hdEFjdGlvbiIsIkZvcm1hdHRpbmciLCJCb2xkIiwiRm9ybWF0SXRhbGljcyIsIkl0YWxpY3MiLCJGb3JtYXRDb2RlIiwiQ29kZSIsIkZvcm1hdFF1b3RlIiwiUXVvdGUiLCJGb3JtYXRMaW5rIiwiSW5zZXJ0TGluayIsIkVkaXRSZWRvIiwiaGlzdG9yeSIsInJlZG8iLCJyZXNldCIsIkVkaXRVbmRvIiwidW5kbyIsIk5ld0xpbmUiLCJpbnNlcnRUZXh0IiwiTW92ZUN1cnNvclRvU3RhcnQiLCJpbmRleCIsIm9mZnNldCIsIk1vdmVDdXJzb3JUb0VuZCIsImNvbXBsZXRpb24iLCJvbkNvbXBvbmVudENvbmZpcm0iLCJjb21wbGV0aW9uSW5kZXgiLCJTZXR0aW5nc1N0b3JlIiwiZ2V0VmFsdWUiLCJzZXRUcmFuc2Zvcm1DYWxsYmFjayIsInRyYW5zZm9ybSIsInNob3dQaWxsQXZhdGFyIiwiZG9jdW1lbnRQb3NpdGlvbiIsInNob3VsZFJlcGxhY2UiLCJyZXBsYWNlRW1vdGljb24iLCJmb3JtYXRSYW5nZSIsInVhIiwibmF2aWdhdG9yIiwidXNlckFnZW50IiwidG9Mb3dlckNhc2UiLCJ1c2VNYXJrZG93bkhhbmRsZSIsIndhdGNoU2V0dGluZyIsImNvbmZpZ3VyZVVzZU1hcmtkb3duIiwiZW1vdGljb25TZXR0aW5nSGFuZGxlIiwiY29uZmlndXJlRW1vdGljb25BdXRvUmVwbGFjZSIsInNob3VsZFNob3dQaWxsQXZhdGFyU2V0dGluZ0hhbmRsZSIsImNvbmZpZ3VyZVNob3VsZFNob3dQaWxsQXZhdGFyIiwic3Vycm91bmRXaXRoSGFuZGxlIiwic3Vycm91bmRXaXRoU2V0dGluZ0NoYW5nZWQiLCJjb21wb25lbnREaWRVcGRhdGUiLCJwcmV2UHJvcHMiLCJlbmFibGVkQ2hhbmdlIiwiZGlzYWJsZWQiLCJwbGFjZWhvbGRlckNoYW5nZWQiLCJjYXJldFBvc2l0aW9uIiwicmVnZXgiLCJzdGFydFJhbmdlIiwiZXhwYW5kQmFja3dhcmRzV2hpbGUiLCJwYXJ0IiwiVHlwZSIsIlBsYWluIiwiUGlsbENhbmRpZGF0ZSIsIk5ld2xpbmUiLCJlbW90aWNvbk1hdGNoIiwiZXhlYyIsInF1ZXJ5IiwiRU1PVElDT05fVE9fRU1PSkkiLCJmaXJzdE1hdGNoIiwibW92ZVN0YXJ0IiwibW92ZVN0YXJ0Rm9yd2FyZHMiLCJtb3ZlRW5kQmFja3dhcmRzIiwicmVwbGFjZSIsImVtb2ppIiwidW5pY29kZSIsInN0eWxlIiwic2V0UHJvcGVydHkiLCJDU1MiLCJlc2NhcGUiLCJjbGFzc0xpc3QiLCJhZGQiLCJyZW1vdmUiLCJyZW1vdmVQcm9wZXJ0eSIsImlzQ29tcG9zaW5nIiwibmF0aXZlRXZlbnQiLCJ0ZXh0VG9JbnNlcnQiLCJuZXdUZXh0Iiwic2xpY2UiLCJfaXNDYXJldEF0RW5kIiwiaXNBdEVuZCIsImxhc3RDYXJldCIsImFzT2Zmc2V0IiwiY2xlYXJVbmRvSGlzdG9yeSIsImNsZWFyIiwiZ2V0Q2FyZXQiLCJpc1NlbGVjdGlvbkNvbGxhcHNlZCIsImlzQ2FyZXRBdFN0YXJ0IiwiaXNDYXJldEF0RW5kIiwicG9zaXRpb25Gb3JPZmZzZXQiLCJhdE5vZGVFbmQiLCJDb21tYW5kIiwiYWRkZWRMZW4iLCJwaWxsQ2FuZGlkYXRlIiwic3RhcnRTZWxlY3Rpb24iLCJoYXNTZWxlY3Rpb24iLCJjbG9zZSIsImlzTW9kaWZpZWQiLCJjb21wb25lbnRXaWxsVW5tb3VudCIsIm9uQmVmb3JlSW5wdXQiLCJvbkNvbXBvc2l0aW9uU3RhcnQiLCJvbkNvbXBvc2l0aW9uRW5kIiwidW53YXRjaFNldHRpbmciLCJjb21wb25lbnREaWRNb3VudCIsInNldFVwZGF0ZUNhbGxiYWNrIiwidXBkYXRlRWRpdG9yU3RhdGUiLCJzZXRBdXRvQ29tcGxldGVDcmVhdG9yIiwiZ2V0QXV0b0NvbXBsZXRlQ3JlYXRvciIsImF1dG9jb21wbGV0ZVJlZiIsImdldEluaXRpYWxDYXJldFBvc2l0aW9uIiwiZm9jdXMiLCJpbml0aWFsQ2FyZXQiLCJnZXRQb3NpdGlvbkF0RW5kIiwicmVuZGVyIiwicXVlcnlMZW4iLCJjcmVhdGVFbGVtZW50IiwiY2xhc3NOYW1lIiwicmVmIiwib25Db25maXJtIiwib25BdXRvQ29tcGxldGVDb25maXJtIiwib25BdXRvQ29tcGxldGVTZWxlY3Rpb25DaGFuZ2UiLCJiZWdpbm5pbmciLCJzdGFydCIsIndyYXBwZXJDbGFzc2VzIiwiY2xhc3NOYW1lcyIsIm14X0Jhc2ljTWVzc2FnZUNvbXBvc2VyX2lucHV0X2Vycm9yIiwiY2xhc3NlcyIsIm14X0Jhc2ljTWVzc2FnZUNvbXBvc2VyX2lucHV0X3Nob3VsZFNob3dQaWxsQXZhdGFyIiwibXhfQmFzaWNNZXNzYWdlQ29tcG9zZXJfaW5wdXRfZGlzYWJsZWQiLCJzaG9ydGN1dHMiLCJoYXNBdXRvY29tcGxldGUiLCJhY3RpdmVEZXNjZW5kYW50IiwiZ2VuZXJhdGVDb21wbGV0aW9uRG9tSWQiLCJvbkFjdGlvbiIsImNvbnRlbnRFZGl0YWJsZSIsInRhYkluZGV4Iiwib25CbHVyIiwib25Gb2N1cyIsIm9uQ29weSIsIm9uQ3V0Iiwib25LZXlEb3duIiwibGFiZWwiLCJyb2xlIiwiZGlyIiwidHJhbnNsYXRlIiwiaW5zZXJ0TWVudGlvbiIsInVzZXJJZCIsIm1lbWJlciIsImdldE1lbWJlciIsImRpc3BsYXlOYW1lIiwicmF3RGlzcGxheU5hbWUiLCJjcmVhdGVNZW50aW9uUGFydHMiLCJpbnNlcnQiLCJpbnNlcnRRdW90ZWRNZXNzYWdlIiwicXVvdGVQYXJ0cyIsInBhcnNlRXZlbnQiLCJpc1F1b3RlZE1lc3NhZ2UiLCJwdXNoIiwibmV3bGluZSIsImluc2VydFBsYWludGV4dCIsInBsYWluV2l0aEVtb2ppIl0sInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdmlld3Mvcm9vbXMvQmFzaWNNZXNzYWdlQ29tcG9zZXIudHN4Il0sInNvdXJjZXNDb250ZW50IjpbIi8qXG5Db3B5cmlnaHQgMjAyNCBOZXcgVmVjdG9yIEx0ZC5cbkNvcHlyaWdodCAyMDE5LTIwMjEgVGhlIE1hdHJpeC5vcmcgRm91bmRhdGlvbiBDLkkuQy5cblxuU1BEWC1MaWNlbnNlLUlkZW50aWZpZXI6IEFHUEwtMy4wLW9ubHkgT1IgR1BMLTMuMC1vbmx5XG5QbGVhc2Ugc2VlIExJQ0VOU0UgZmlsZXMgaW4gdGhlIHJlcG9zaXRvcnkgcm9vdCBmb3IgZnVsbCBkZXRhaWxzLlxuKi9cblxuaW1wb3J0IGNsYXNzTmFtZXMgZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBSZWFjdCwgeyBjcmVhdGVSZWYsIENsaXBib2FyZEV2ZW50LCBTeW50aGV0aWNFdmVudCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgUm9vbSwgTWF0cml4RXZlbnQgfSBmcm9tIFwibWF0cml4LWpzLXNkay9zcmMvbWF0cml4XCI7XG5pbXBvcnQgRU1PVElDT05fUkVHRVggZnJvbSBcImVtb2ppYmFzZS1yZWdleC9lbW90aWNvblwiO1xuaW1wb3J0IHsgbG9nZ2VyIH0gZnJvbSBcIm1hdHJpeC1qcy1zZGsvc3JjL2xvZ2dlclwiO1xuaW1wb3J0IHsgRU1PVElDT05fVE9fRU1PSkkgfSBmcm9tIFwiQG1hdHJpeC1vcmcvZW1vamliYXNlLWJpbmRpbmdzXCI7XG5cbmltcG9ydCBFZGl0b3JNb2RlbCBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL21vZGVsXCI7XG5pbXBvcnQgSGlzdG9yeU1hbmFnZXIgZnJvbSBcIi4uLy4uLy4uL2VkaXRvci9oaXN0b3J5XCI7XG5pbXBvcnQgeyBDYXJldCwgc2V0U2VsZWN0aW9uIH0gZnJvbSBcIi4uLy4uLy4uL2VkaXRvci9jYXJldFwiO1xuaW1wb3J0IHtcbiAgICBmb3JtYXRSYW5nZSxcbiAgICBmb3JtYXRSYW5nZUFzTGluayxcbiAgICByZXBsYWNlUmFuZ2VBbmRNb3ZlQ2FyZXQsXG4gICAgdG9nZ2xlSW5saW5lRm9ybWF0LFxufSBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL29wZXJhdGlvbnNcIjtcbmltcG9ydCB7IGdldENhcmV0T2Zmc2V0QW5kVGV4dCwgZ2V0UmFuZ2VGb3JTZWxlY3Rpb24gfSBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL2RvbVwiO1xuaW1wb3J0IEF1dG9jb21wbGV0ZSwgeyBnZW5lcmF0ZUNvbXBsZXRpb25Eb21JZCB9IGZyb20gXCIuLi9yb29tcy9BdXRvY29tcGxldGVcIjtcbmltcG9ydCB7IGdldEF1dG9Db21wbGV0ZUNyZWF0b3IsIFBhcnQsIFNlcmlhbGl6ZWRQYXJ0LCBUeXBlIH0gZnJvbSBcIi4uLy4uLy4uL2VkaXRvci9wYXJ0c1wiO1xuaW1wb3J0IHsgcGFyc2VFdmVudCwgcGFyc2VQbGFpblRleHRNZXNzYWdlIH0gZnJvbSBcIi4uLy4uLy4uL2VkaXRvci9kZXNlcmlhbGl6ZVwiO1xuaW1wb3J0IHsgcmVuZGVyTW9kZWwgfSBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL3JlbmRlclwiO1xuaW1wb3J0IFNldHRpbmdzU3RvcmUgZnJvbSBcIi4uLy4uLy4uL3NldHRpbmdzL1NldHRpbmdzU3RvcmVcIjtcbmltcG9ydCB7IElTX01BQywgS2V5IH0gZnJvbSBcIi4uLy4uLy4uL0tleWJvYXJkXCI7XG5pbXBvcnQgeyBDb21tYW5kQ2F0ZWdvcmllcywgQ29tbWFuZE1hcCwgcGFyc2VDb21tYW5kU3RyaW5nIH0gZnJvbSBcIi4uLy4uLy4uL1NsYXNoQ29tbWFuZHNcIjtcbmltcG9ydCBSYW5nZSBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL3JhbmdlXCI7XG5pbXBvcnQgTWVzc2FnZUNvbXBvc2VyRm9ybWF0QmFyLCB7IEZvcm1hdHRpbmcgfSBmcm9tIFwiLi9NZXNzYWdlQ29tcG9zZXJGb3JtYXRCYXJcIjtcbmltcG9ydCBEb2N1bWVudE9mZnNldCBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL29mZnNldFwiO1xuaW1wb3J0IHsgSURpZmYgfSBmcm9tIFwiLi4vLi4vLi4vZWRpdG9yL2RpZmZcIjtcbmltcG9ydCBBdXRvY29tcGxldGVXcmFwcGVyTW9kZWwgZnJvbSBcIi4uLy4uLy4uL2VkaXRvci9hdXRvY29tcGxldGVcIjtcbmltcG9ydCBEb2N1bWVudFBvc2l0aW9uIGZyb20gXCIuLi8uLi8uLi9lZGl0b3IvcG9zaXRpb25cIjtcbmltcG9ydCB7IElDb21wbGV0aW9uIH0gZnJvbSBcIi4uLy4uLy4uL2F1dG9jb21wbGV0ZS9BdXRvY29tcGxldGVyXCI7XG5pbXBvcnQgeyBnZXRLZXlCaW5kaW5nc01hbmFnZXIgfSBmcm9tIFwiLi4vLi4vLi4vS2V5QmluZGluZ3NNYW5hZ2VyXCI7XG5pbXBvcnQgeyBBTFRFUk5BVEVfS0VZX05BTUUsIEtleUJpbmRpbmdBY3Rpb24gfSBmcm9tIFwiLi4vLi4vLi4vYWNjZXNzaWJpbGl0eS9LZXlib2FyZFNob3J0Y3V0c1wiO1xuaW1wb3J0IHsgX3QgfSBmcm9tIFwiLi4vLi4vLi4vbGFuZ3VhZ2VIYW5kbGVyXCI7XG5pbXBvcnQgeyBsaW5raWZ5IH0gZnJvbSBcIi4uLy4uLy4uL2xpbmtpZnktbWF0cml4XCI7XG5pbXBvcnQgeyBTZGtDb250ZXh0Q2xhc3MgfSBmcm9tIFwiLi4vLi4vLi4vY29udGV4dHMvU0RLQ29udGV4dFwiO1xuaW1wb3J0IHsgTWF0cml4Q2xpZW50UGVnIH0gZnJvbSBcIi4uLy4uLy4uL01hdHJpeENsaWVudFBlZ1wiO1xuaW1wb3J0IHsgTGFuZG1hcmssIExhbmRtYXJrTmF2aWdhdGlvbiB9IGZyb20gXCIuLi8uLi8uLi9hY2Nlc3NpYmlsaXR5L0xhbmRtYXJrTmF2aWdhdGlvblwiO1xuXG4vLyBtYXRjaGVzIGVtb3RpY29ucyB3aGljaCBmb2xsb3cgdGhlIHN0YXJ0IG9mIGEgbGluZSBvciB3aGl0ZXNwYWNlXG5jb25zdCBSRUdFWF9FTU9USUNPTl9XSElURVNQQUNFID0gbmV3IFJlZ0V4cChcIig/Ol58XFxcXHMpKFwiICsgRU1PVElDT05fUkVHRVguc291cmNlICsgXCIpXFxcXHN8Ol4kXCIpO1xuZXhwb3J0IGNvbnN0IFJFR0VYX0VNT1RJQ09OID0gbmV3IFJlZ0V4cChcIig/Ol58XFxcXHMpKFwiICsgRU1PVElDT05fUkVHRVguc291cmNlICsgXCIpJFwiKTtcblxuY29uc3QgU1VSUk9VTkRfV0lUSF9DSEFSQUNURVJTID0gWydcIicsIFwiX1wiLCBcImBcIiwgXCInXCIsIFwiKlwiLCBcIn5cIiwgXCIkXCJdO1xuY29uc3QgU1VSUk9VTkRfV0lUSF9ET1VCTEVfQ0hBUkFDVEVSUyA9IG5ldyBNYXAoW1xuICAgIFtcIihcIiwgXCIpXCJdLFxuICAgIFtcIltcIiwgXCJdXCJdLFxuICAgIFtcIntcIiwgXCJ9XCJdLFxuICAgIFtcIjxcIiwgXCI+XCJdLFxuXSk7XG5cbmZ1bmN0aW9uIGN0cmxTaG9ydGN1dExhYmVsKGtleTogc3RyaW5nLCBuZWVkc1NoaWZ0ID0gZmFsc2UsIG5lZWRzQWx0ID0gZmFsc2UpOiBzdHJpbmcge1xuICAgIHJldHVybiAoXG4gICAgICAgIChJU19NQUMgPyBcIuKMmFwiIDogX3QoQUxURVJOQVRFX0tFWV9OQU1FW0tleS5DT05UUk9MXSkpICtcbiAgICAgICAgKG5lZWRzU2hpZnQgPyBcIitcIiArIF90KEFMVEVSTkFURV9LRVlfTkFNRVtLZXkuU0hJRlRdKSA6IFwiXCIpICtcbiAgICAgICAgKG5lZWRzQWx0ID8gXCIrXCIgKyBfdChBTFRFUk5BVEVfS0VZX05BTUVbS2V5LkFMVF0pIDogXCJcIikgK1xuICAgICAgICBcIitcIiArXG4gICAgICAgIGtleVxuICAgICk7XG59XG5cbmZ1bmN0aW9uIGNsb25lU2VsZWN0aW9uKHNlbGVjdGlvbjogU2VsZWN0aW9uKTogUGFydGlhbDxTZWxlY3Rpb24+IHtcbiAgICByZXR1cm4ge1xuICAgICAgICBhbmNob3JOb2RlOiBzZWxlY3Rpb24uYW5jaG9yTm9kZSxcbiAgICAgICAgYW5jaG9yT2Zmc2V0OiBzZWxlY3Rpb24uYW5jaG9yT2Zmc2V0LFxuICAgICAgICBmb2N1c05vZGU6IHNlbGVjdGlvbi5mb2N1c05vZGUsXG4gICAgICAgIGZvY3VzT2Zmc2V0OiBzZWxlY3Rpb24uZm9jdXNPZmZzZXQsXG4gICAgICAgIGlzQ29sbGFw