@atlaskit/editor-core 188.8.0 → 188.9.2

package/dist/esm/plugins/status/ui/statusPicker.js

@@ -1,308 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
-
-import React from 'react';
-import { css, jsx } from '@emotion/react';
-import { withAnalyticsEvents } from '@atlaskit/analytics-next';
-import { Popup } from '@atlaskit/editor-common/ui';
-import { akEditorFloatingDialogZIndex } from '@atlaskit/editor-shared-styles';
-import { StatusPicker as AkStatusPicker } from '@atlaskit/status/picker';
-import { borderRadius } from '@atlaskit/theme/constants';
-import { N0 } from '@atlaskit/theme/colors';
-import { withReactEditorViewOuterListeners as withOuterListeners } from '@atlaskit/editor-common/ui-react';
-import { DEFAULT_STATUS } from '../actions';
-import { analyticsState, createStatusAnalyticsAndFire } from '../analytics';
-var PopupWithListeners = withOuterListeners(Popup);
-export var InputMethod = /*#__PURE__*/function (InputMethod) {
-  InputMethod["blur"] = "blur";
-  InputMethod["escKey"] = "escKey";
-  InputMethod["enterKey"] = "enterKey";
-  return InputMethod;
-}({});
-export var closingMethods = /*#__PURE__*/function (closingMethods) {
-  closingMethods["ArrowLeft"] = "arrowLeft";
-  closingMethods["ArrowRight"] = "arrowRight";
-  return closingMethods;
-}({});
-var pickerContainer = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  padding: ", " 0;\n  border-radius: ", "px;\n  box-shadow: ", ";\n  :focus {\n    outline: none;\n  }\n  input {\n    text-transform: uppercase;\n  }\n"])), "var(--ds-surface-overlay, ".concat(N0, ")"), "var(--ds-space-100, 8px)", borderRadius(), "var(--ds-shadow-overlay, 0 0 1px rgba(9, 30, 66, 0.31), 0 4px 8px -2px rgba(9, 30, 66, 0.25))");
-export var StatusPickerWithoutAnalytcs = /*#__PURE__*/function (_React$Component) {
-  _inherits(StatusPickerWithoutAnalytcs, _React$Component);
-  var _super = _createSuper(StatusPickerWithoutAnalytcs);
-  function StatusPickerWithoutAnalytcs(props) {
-    var _this;
-    _classCallCheck(this, StatusPickerWithoutAnalytcs);
-    _this = _super.call(this, props);
-    _defineProperty(_assertThisInitialized(_this), "handleClickOutside", function (event) {
-      event.preventDefault();
-      _this.inputMethod = InputMethod.blur;
-      var selectedText = window.getSelection();
-      if (!selectedText) {
-        _this.props.closeStatusPicker();
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleEscapeKeydown", function (event) {
-      event.preventDefault();
-      _this.inputMethod = InputMethod.escKey;
-      _this.props.onEnter(_this.state);
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleTabPress", function (event) {
-      var colorButtons = event.currentTarget.querySelectorAll('button');
-      var inputField = event.currentTarget.querySelector('input');
-      var isInputFocussed = document.activeElement === inputField;
-      var isButtonFocussed = Array.from(colorButtons).some(function (buttonElement) {
-        var _document;
-        return ((_document = document) === null || _document === void 0 ? void 0 : _document.activeElement) === buttonElement;
-      });
-      if (event !== null && event !== void 0 && event.shiftKey) {
-        /* shift + tab */
-        if (isInputFocussed) {
-          colorButtons[0].focus();
-          event.preventDefault();
-        }
-        /* After the user presses shift + tab the color-palette component updates tab index for the first color to be 0.
-            To correctly set focus to the input field instead of the first color button we need to set focus manually
-            */
-        if (isButtonFocussed) {
-          inputField === null || inputField === void 0 || inputField.focus();
-          event.preventDefault();
-        }
-      } else {
-        /* tab */
-        if (isButtonFocussed) {
-          inputField === null || inputField === void 0 || inputField.focus();
-          event.preventDefault();
-        }
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleArrow", function (event, closingMethod) {
-      var _document2;
-      if (((_document2 = document) === null || _document2 === void 0 ? void 0 : _document2.activeElement) === _this.popupBodyWrapper.current) {
-        var _this$popupBodyWrappe;
-        event.preventDefault();
-        (_this$popupBodyWrappe = _this.popupBodyWrapper) === null || _this$popupBodyWrappe === void 0 || (_this$popupBodyWrappe = _this$popupBodyWrappe.current) === null || _this$popupBodyWrappe === void 0 || _this$popupBodyWrappe.blur();
-        _this.props.closeStatusPicker({
-          closingMethod: closingMethod
-        });
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "onKeyDown", function (event) {
-      var isTabPressed = event.key === 'Tab';
-      if (isTabPressed) {
-        return _this.handleTabPress(event);
-      }
-      if (event.key in closingMethods) {
-        return _this.handleArrow(event, closingMethods[event.key]);
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "onColorHover", function (color) {
-      _this.createStatusAnalyticsAndFireFunc({
-        action: 'hovered',
-        actionSubject: 'statusColorPicker',
-        attributes: {
-          color: color,
-          localId: _this.state.localId,
-          state: analyticsState(_this.props.isNew)
-        }
-      });
-    });
-    _defineProperty(_assertThisInitialized(_this), "onColorClick", function (color) {
-      var _this$state = _this.state,
-        text = _this$state.text,
-        localId = _this$state.localId;
-      if (color === _this.state.color) {
-        _this.createStatusAnalyticsAndFireFunc({
-          action: 'clicked',
-          actionSubject: 'statusColorPicker',
-          attributes: {
-            color: color,
-            localId: localId,
-            state: analyticsState(_this.props.isNew)
-          }
-        });
-        // closes status box and commits colour
-        _this.onEnter();
-      } else {
-        _this.setState({
-          color: color
-        });
-        _this.props.onSelect({
-          text: text,
-          color: color,
-          localId: localId
-        });
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "onTextChanged", function (text) {
-      var _this$state2 = _this.state,
-        color = _this$state2.color,
-        localId = _this$state2.localId;
-      _this.setState({
-        text: text
-      });
-      _this.props.onTextChanged({
-        text: text,
-        color: color,
-        localId: localId
-      }, !!_this.props.isNew);
-    });
-    _defineProperty(_assertThisInitialized(_this), "onEnter", function () {
-      _this.inputMethod = InputMethod.enterKey;
-      _this.props.onEnter(_this.state);
-    });
-    // cancel bubbling to fix clickOutside logic:
-    // popup re-renders its content before the click event bubbles up to the document
-    // therefore click target element would be different from the popup content
-    _defineProperty(_assertThisInitialized(_this), "handlePopupClick", function (event) {
-      return event.nativeEvent.stopImmediatePropagation();
-    });
-    _this.state = _this.extractStateFromProps(props);
-    _this.createStatusAnalyticsAndFireFunc = createStatusAnalyticsAndFire(props.createAnalyticsEvent);
-    _this.popupBodyWrapper = /*#__PURE__*/React.createRef();
-    return _this;
-  }
-  _createClass(StatusPickerWithoutAnalytcs, [{
-    key: "fireStatusPopupOpenedAnalytics",
-    value: function fireStatusPopupOpenedAnalytics(state) {
-      var color = state.color,
-        text = state.text,
-        localId = state.localId,
-        isNew = state.isNew;
-      this.startTime = Date.now();
-      this.createStatusAnalyticsAndFireFunc({
-        action: 'opened',
-        actionSubject: 'statusPopup',
-        attributes: {
-          textLength: text ? text.length : 0,
-          selectedColor: color,
-          localId: localId,
-          state: analyticsState(isNew)
-        }
-      });
-    }
-  }, {
-    key: "fireStatusPopupClosedAnalytics",
-    value: function fireStatusPopupClosedAnalytics(state) {
-      var color = state.color,
-        text = state.text,
-        localId = state.localId,
-        isNew = state.isNew;
-      this.createStatusAnalyticsAndFireFunc({
-        action: 'closed',
-        actionSubject: 'statusPopup',
-        attributes: {
-          inputMethod: this.inputMethod,
-          duration: Date.now() - this.startTime,
-          textLength: text ? text.length : 0,
-          selectedColor: color,
-          localId: localId,
-          state: analyticsState(isNew)
-        }
-      });
-    }
-  }, {
-    key: "reset",
-    value: function reset() {
-      this.startTime = Date.now();
-      this.inputMethod = InputMethod.blur;
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var _this2 = this;
-      this.reset();
-      this.fireStatusPopupOpenedAnalytics(this.state);
-      if (typeof this.props.isNew === 'boolean' && this.props.isNew === false) {
-        // Wrapper should be focused only if status already exists otherwise input field will receive focus
-        this.focusTimeout = requestAnimationFrame(function () {
-          var _this2$popupBodyWrapp;
-          // Defer to prevent editor scrolling to top. See https://product-fabric.atlassian.net/browse/DTR-1952
-          (_this2$popupBodyWrapp = _this2.popupBodyWrapper) === null || _this2$popupBodyWrapp === void 0 || (_this2$popupBodyWrapp = _this2$popupBodyWrapp.current) === null || _this2$popupBodyWrapp === void 0 || _this2$popupBodyWrapp.focus();
-        });
-      }
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.focusTimeout && cancelAnimationFrame(this.focusTimeout);
-      this.fireStatusPopupClosedAnalytics(this.state);
-      this.startTime = 0;
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps, prevState, _snapshot) {
-      var element = this.props.target;
-      if (prevProps.target !== element) {
-        var newState = this.extractStateFromProps(this.props);
-        this.setState(newState);
-        this.fireStatusPopupClosedAnalytics(prevState);
-        this.reset();
-        this.fireStatusPopupOpenedAnalytics(newState);
-      }
-    }
-  }, {
-    key: "extractStateFromProps",
-    value: function extractStateFromProps(props) {
-      var defaultColor = props.defaultColor,
-        defaultText = props.defaultText,
-        defaultLocalId = props.defaultLocalId,
-        isNew = props.isNew;
-      return {
-        color: defaultColor || DEFAULT_STATUS.color,
-        text: defaultText || DEFAULT_STATUS.text,
-        localId: defaultLocalId,
-        isNew: isNew
-      };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        isNew = _this$props.isNew,
-        target = _this$props.target,
-        mountTo = _this$props.mountTo,
-        boundariesElement = _this$props.boundariesElement,
-        scrollableElement = _this$props.scrollableElement;
-      var _this$state3 = this.state,
-        color = _this$state3.color,
-        text = _this$state3.text;
-      return target && jsx(PopupWithListeners, {
-        target: target,
-        offset: [0, 8],
-        handleClickOutside: this.handleClickOutside,
-        handleEscapeKeydown: this.handleEscapeKeydown,
-        zIndex: akEditorFloatingDialogZIndex,
-        fitHeight: 40,
-        mountTo: mountTo,
-        boundariesElement: boundariesElement,
-        scrollableElement: scrollableElement,
-        closeOnTab: false
-      }, jsx("div", {
-        css: pickerContainer,
-        tabIndex: -1,
-        ref: this.popupBodyWrapper,
-        onClick: this.handlePopupClick,
-        onKeyDown: this.onKeyDown
-      }, jsx(AkStatusPicker, {
-        autoFocus: isNew,
-        selectedColor: color,
-        text: text,
-        onColorClick: this.onColorClick,
-        onColorHover: this.onColorHover,
-        onTextChanged: this.onTextChanged,
-        onEnter: this.onEnter
-      })));
-    }
-  }]);
-  return StatusPickerWithoutAnalytcs;
-}(React.Component);
-export default withAnalyticsEvents()(StatusPickerWithoutAnalytcs);

package/dist/esm/plugins/status/utils.js

@@ -1,16 +0,0 @@
-import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
-export var mayGetStatusAtSelection = function mayGetStatusAtSelection(selection) {
-  if (selection && selection instanceof NodeSelection) {
-    var nodeSelection = selection;
-    if (nodeSelection.node.type.name === 'status') {
-      return selection.node.attrs || null;
-    }
-  }
-  return null;
-};
-export var isEmptyStatus = function isEmptyStatus(node) {
-  return node && (node.text && node.text.trim().length === 0 || node.text === '');
-};
-export var setNodeSelectionNearPos = function setNodeSelectionNearPos(tr, pos) {
-  return tr.setSelection(NodeSelection.create(tr.doc, tr.mapping.map(pos)));
-};

package/dist/esm/plugins/type-ahead/api.js

@@ -1,209 +0,0 @@
-import { TypeAheadAvailableNodes, SelectItemMode } from '@atlaskit/editor-common/type-ahead';
-import { findHandler, isTypeAheadOpen, getTypeAheadHandler, getTypeAheadQuery } from './utils';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { openTypeAheadAtCursor } from './transforms/open-typeahead-at-cursor';
-import { closeTypeAhead } from './transforms/close-type-ahead';
-import { updateQuery } from './commands/update-query';
-import { insertTypeAheadItem } from './commands/insert-type-ahead-item';
-var open = function open(_ref) {
-  var editorView = _ref.editorView;
-  return function (itemType) {
-    return function (inputMethod) {
-      var state = editorView.state;
-      var handler = findHandler(itemType, state);
-      if (!handler) {
-        return false;
-      }
-      var tr = state.tr;
-      openTypeAheadAtCursor({
-        triggerHandler: handler,
-        inputMethod: inputMethod
-      })({
-        tr: tr
-      });
-      editorView.dispatch(tr);
-      return true;
-    };
-  };
-};
-var defaultCloseOptions = {
-  insertCurrentQueryAsRawText: false
-};
-var close = function close(_ref2) {
-  var editorView = _ref2.editorView;
-  return function () {
-    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultCloseOptions;
-    var state = editorView.state;
-    var currentQuery = getTypeAheadQuery(editorView.state);
-    var tr = state.tr;
-    if (options.attachCommand) {
-      var fakeDispatch = function fakeDispatch(customTr) {
-        tr = customTr;
-      };
-      options.attachCommand(state, fakeDispatch);
-    }
-    closeTypeAhead(tr);
-    if (options.insertCurrentQueryAsRawText && currentQuery && currentQuery.length > 0) {
-      var handler = getTypeAheadHandler(state);
-      var text = handler.trigger.concat(currentQuery);
-      tr.replaceSelectionWith(state.schema.text(text));
-    }
-    editorView.dispatch(tr);
-    if (!editorView.hasFocus()) {
-      editorView.focus();
-    }
-    return true;
-  };
-};
-var search = function search(_ref3) {
-  var editorView = _ref3.editorView;
-  return function (itemType) {
-    return function () {
-      var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-      var state = editorView.state;
-      var handler = findHandler(itemType, state);
-      if (!handler) {
-        throw new Error("Handler not found, did you load the ".concat(itemType, " plugin properly"));
-      }
-      open({
-        editorView: editorView
-      })(itemType)(INPUT_METHOD.KEYBOARD);
-      updateQuery(query)(editorView.state, editorView.dispatch);
-      var lastQuery = {
-        current: query
-      };
-      var last = handler.getItems({
-        query: query,
-        editorState: state
-      }).then(function (items) {
-        if (!handler.forceSelect) {
-          return items;
-        }
-        var forceSelectedItem = handler.forceSelect({
-          items: items,
-          query: query,
-          editorState: state
-        });
-        if (!forceSelectedItem) {
-          return items;
-        }
-        insertTypeAheadItem(editorView)({
-          handler: handler,
-          item: forceSelectedItem,
-          query: query,
-          mode: SelectItemMode.SELECTED,
-          sourceListItem: items
-        });
-      });
-      var results = {
-        last: last
-      };
-      return {
-        type: function type(appendValue) {
-          if (!appendValue) {
-            return;
-          }
-          lastQuery.current += appendValue;
-          updateQuery(lastQuery.current)(editorView.state, editorView.dispatch);
-          var promise = handler.getItems({
-            query: lastQuery.current,
-            editorState: state
-          });
-          results.last = promise;
-          return promise;
-        },
-        result: function result() {
-          return results.last;
-        },
-        close: close({
-          editorView: editorView
-        }),
-        insert: function insert(_ref4) {
-          var index = _ref4.index,
-            mode = _ref4.mode;
-          return results.last.then(function (result) {
-            var item = result ? result[index] : null;
-            if (result && item) {
-              insertTypeAheadItem(editorView)({
-                handler: handler,
-                item: item,
-                query: query,
-                mode: mode || SelectItemMode.SELECTED,
-                sourceListItem: result
-              });
-            }
-          });
-        }
-      };
-    };
-  };
-};
-var insertItem = function insertItem(_ref5) {
-  var editorView = _ref5.editorView;
-  return function (itemType) {
-    return function (_ref6) {
-      var contentItem = _ref6.contentItem,
-        query = _ref6.query,
-        sourceListItem = _ref6.sourceListItem;
-      var state = editorView.state;
-      var handler = findHandler(itemType, state);
-      if (!handler) {
-        return false;
-      }
-      insertTypeAheadItem(editorView)({
-        handler: handler,
-        item: contentItem,
-        mode: SelectItemMode.SELECTED,
-        query: query,
-        sourceListItem: sourceListItem
-      });
-      return true;
-    };
-  };
-};
-var isOpen = function isOpen(_ref7) {
-  var editorView = _ref7.editorView;
-  return function () {
-    if (!isTypeAheadOpen(editorView.state)) {
-      return false;
-    }
-    var handler = getTypeAheadHandler(editorView.state);
-    if (!handler) {
-      return false;
-    }
-    return handler;
-  };
-};
-var currentQuery = function currentQuery(_ref8) {
-  var editorView = _ref8.editorView;
-  return function () {
-    return getTypeAheadQuery(editorView.state);
-  };
-};
-
-/**
- * Please do not use it. Ping #help-editor and talk to the Lego team before use it.
- *
- * @private
- * @deprecated
- *
- */
-export var createTypeAheadTools = function createTypeAheadTools(editorView) {
-  var props = {
-    editorView: editorView
-  };
-  return {
-    isOpen: isOpen(props),
-    currentQuery: currentQuery(props),
-    close: close(props),
-    openMention: open(props)(TypeAheadAvailableNodes.MENTION),
-    searchMention: search(props)(TypeAheadAvailableNodes.MENTION),
-    openQuickInsert: open(props)(TypeAheadAvailableNodes.QUICK_INSERT),
-    searchQuickInsert: search(props)(TypeAheadAvailableNodes.QUICK_INSERT),
-    openEmoji: open(props)(TypeAheadAvailableNodes.EMOJI),
-    searchEmoji: search(props)(TypeAheadAvailableNodes.EMOJI),
-    insertItemMention: insertItem(props)(TypeAheadAvailableNodes.MENTION),
-    insertItemEmoji: insertItem(props)(TypeAheadAvailableNodes.EMOJI),
-    insertItemQuickInsert: insertItem(props)(TypeAheadAvailableNodes.QUICK_INSERT)
-  };
-};