UNPKG

@atlaskit/editor-plugin-type-ahead

Version:

Type-ahead plugin for @atlaskit/editor-core

121 lines (119 loc) 4.51 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.createPlugin = createPlugin; var _steps = require("@atlaskit/adf-schema/steps"); var _safePlugin = require("@atlaskit/editor-common/safe-plugin"); var _utils = require("@atlaskit/editor-common/utils"); var _view = require("@atlaskit/editor-prosemirror/view"); var _platformFeatureFlags = require("@atlaskit/platform-feature-flags"); var _actions = require("./actions"); var _constants = require("./constants"); var _decorations = require("./decorations"); var _isInsertionTransaction = require("./isInsertionTransaction"); var _key = require("./key"); var _reducer = require("./reducer"); var hasValidTypeAheadStep = function hasValidTypeAheadStep(tr) { var steps = tr.steps.filter(function (step) { return step instanceof _steps.InsertTypeAheadStep; }); // There are some cases, like collab rebase, where the steps are re-applied // We should not re open the type-ahead for those cases if (steps.length === 1) { return steps[0]; } return null; }; function createPlugin(_ref) { var reactDispatch = _ref.reactDispatch, popupMountRef = _ref.popupMountRef, typeAheadHandlers = _ref.typeAheadHandlers, getIntl = _ref.getIntl, nodeViewPortalProviderAPI = _ref.nodeViewPortalProviderAPI, api = _ref.api; var intl = getIntl(); var _factoryDecorations = (0, _decorations.factoryDecorations)({ intl: intl, nodeViewPortalProviderAPI: nodeViewPortalProviderAPI, popupMountRef: popupMountRef, api: api }), createDecorations = _factoryDecorations.createDecorations, removeDecorations = _factoryDecorations.removeDecorations; var reducer = (0, _reducer.createReducer)({ createDecorations: createDecorations, removeDecorations: removeDecorations, typeAheadHandlers: typeAheadHandlers, popupMountRef: popupMountRef }); return new _safePlugin.SafePlugin({ key: _key.pluginKey, state: { init: function init() { return { typeAheadHandlers: typeAheadHandlers, query: '', decorationSet: _view.DecorationSet.empty, decorationElement: null, items: [], errorInfo: null, selectedIndex: -1, stats: null, inputMethod: null, removePrefixTriggerOnCancel: undefined }; }, apply: function apply(tr, currentPluginState, oldEditorState, state) { var customStep = hasValidTypeAheadStep(tr); var nextPluginState = reducer(tr, currentPluginState, customStep); if (currentPluginState !== nextPluginState) { reactDispatch(_key.pluginKey, nextPluginState); } return nextPluginState; } }, appendTransaction: function appendTransaction(transactions, _oldState, newState) { var insertItemCallback = (0, _isInsertionTransaction.isInsertionTransaction)(transactions, _actions.ACTIONS.INSERT_RAW_QUERY); if (insertItemCallback) { var tr = insertItemCallback(newState); if (tr) { if ((0, _platformFeatureFlags.fg)('platform_editor_ease_of_use_metrics')) { var _api$metrics; api === null || api === void 0 || (_api$metrics = api.metrics) === null || _api$metrics === void 0 || _api$metrics.commands.startActiveSessionTimer()({ tr: tr }); } return tr; } } }, view: function view() { return { update: function update(editorView) {} }; }, props: { decorations: function decorations(state) { var _pluginKey$getState; return (_pluginKey$getState = _key.pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet; }, handleDOMEvents: { compositionend: function compositionend(view, event) { return false; }, click: function click(view, event) { var target = event.target; // ProseMirror view listen to any click event inside of it // When this event is coming from the typeahead // we should tell to ProseMirror to sit down and relax // cuz we know what we are doing (I hope) if (target instanceof HTMLElement && (0, _utils.closest)(target, "[data-type-ahead=".concat(_constants.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE, "]"))) { return true; } return false; } } } }); }