@atlaskit/editor-core 162.0.2 → 164.0.1

package/dist/cjs/plugins/media/ui/MediaEditor.js

@@ -1,88 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _mediaEditor = require("@atlaskit/media-editor");
-
-var _mediaEditor2 = require("../commands/media-editor");
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
-
-var MediaEditor = /*#__PURE__*/function (_React$PureComponent) {
-  (0, _inherits2.default)(MediaEditor, _React$PureComponent);
-
-  var _super = _createSuper(MediaEditor);
-
-  function MediaEditor() {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, MediaEditor);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onUploadStart", function (newFileIdentifier, dimensions) {
-      var _this$props$view = _this.props.view,
-          state = _this$props$view.state,
-          dispatch = _this$props$view.dispatch;
-      (0, _mediaEditor2.uploadAnnotation)(newFileIdentifier, dimensions)(state, dispatch);
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onClose", function () {
-      var _this$props$view2 = _this.props.view,
-          state = _this$props$view2.state,
-          dispatch = _this$props$view2.dispatch;
-      (0, _mediaEditor2.closeMediaEditor)()(state, dispatch);
-    });
-    return _this;
-  }
-
-  (0, _createClass2.default)(MediaEditor, [{
-    key: "render",
-    value: function render() {
-      var _this$props$mediaEdit = this.props.mediaEditorState,
-          editor = _this$props$mediaEdit.editor,
-          mediaClientConfig = _this$props$mediaEdit.mediaClientConfig;
-
-      if (!editor || !mediaClientConfig) {
-        return null;
-      }
-
-      var identifier = editor.identifier;
-      return /*#__PURE__*/_react.default.createElement(_mediaEditor.SmartMediaEditor, {
-        identifier: identifier,
-        mediaClientConfig: mediaClientConfig,
-        onUploadStart: this.onUploadStart,
-        onClose: this.onClose
-      });
-    }
-  }]);
-  return MediaEditor;
-}(_react.default.PureComponent);
-
-exports.default = MediaEditor;
-(0, _defineProperty2.default)(MediaEditor, "displayName", 'MediaEditor');

package/dist/cjs/ui/Separator/index.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _colors = require("@atlaskit/theme/colors");
-
-var _templateObject;
-
-var Separator = _styledComponents.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  height: 100%;\n  padding-left: 1px;\n  margin: 2px 8px;\n"])), _colors.N30);
-
-var _default = Separator;
-exports.default = _default;

package/dist/cjs/utils/compare.js

@@ -1,136 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.serializeValue = exports.getShallowPropsDifference = exports.getPropsDifference = exports.getKeysAddedRemovedCommon = exports.getKeys = void 0;
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var getKeys = Object.keys;
-exports.getKeys = getKeys;
-
-var getKeysAddedRemovedCommon = function getKeysAddedRemovedCommon(object1, object2) {
-  var oldKeys = object1 !== null ? getKeys(object1) : [];
-  var newKeys = object2 !== null ? getKeys(object2) : [];
-  var removed = oldKeys.filter(function (key) {
-    return !newKeys.includes(key);
-  });
-  var added = newKeys.filter(function (key) {
-    return !oldKeys.includes(key);
-  });
-  var common = oldKeys.filter(function (key) {
-    return newKeys.includes(key);
-  });
-  return {
-    added: added,
-    common: common,
-    removed: removed
-  };
-};
-
-exports.getKeysAddedRemovedCommon = getKeysAddedRemovedCommon;
-
-var serializeValue = function serializeValue(value) {
-  var valueType = (0, _typeof2.default)(value);
-
-  if (value === null) {
-    return 'null';
-  } else if (value === undefined) {
-    return 'undefined';
-  } else if (valueType === 'string' || valueType === 'number') {
-    return value;
-  } else if (valueType === 'symbol') {
-    return value.toString();
-  } // Calling toString of function returns whole function text with body.
-  // So, just return function with name.
-  else if (valueType === 'function') {
-    return "function:".concat(value.name);
-  } else if (valueType === 'object') {
-    return {
-      type: 'object',
-      keys: Object.keys(value)
-    };
-  }
-};
-
-exports.serializeValue = serializeValue;
-
-var getPropsDifference = function getPropsDifference(object1, object2) {
-  var curDepth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  var maxDepth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 2;
-  var keysToIgnore = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : [];
-
-  var _getKeysAddedRemovedC = getKeysAddedRemovedCommon(object1, object2),
-      added = _getKeysAddedRemovedC.added,
-      common = _getKeysAddedRemovedC.common,
-      removed = _getKeysAddedRemovedC.removed;
-
-  var changed = [];
-  common.forEach(function (key) {
-    var value1 = object1[key];
-    var value2 = object2[key];
-    var value1Type = (0, _typeof2.default)(value1);
-    var value2Type = (0, _typeof2.default)(value2); // Do comparision only if values doesn't match (or reference to same object in memory).
-    // Or if key does not exist in keys to ignore.
-
-    if (value1 !== value2 && keysToIgnore.indexOf(key) === -1) {
-      // if both key value are objects and not referencing same object in memory.
-      //  then get recursive difference.
-      if ( /*#__PURE__*/_react.default.isValidElement(value1) || /*#__PURE__*/_react.default.isValidElement(value2)) {
-        changed.push({
-          key: key,
-          reactElementChanged: true
-        });
-      } else if (value1Type === 'object' && value2Type === 'object') {
-        if (curDepth <= maxDepth) {
-          var difference = getPropsDifference(value1, value2, curDepth + 1, maxDepth);
-          changed.push({
-            key: key,
-            difference: difference
-          });
-        } else {
-          changed.push({
-            key: key,
-            maxDepthReached: true
-          });
-        }
-      } else {
-        changed.push({
-          key: key,
-          oldValue: serializeValue(value1),
-          newValue: serializeValue(value2)
-        });
-      }
-    }
-  });
-  return {
-    added: added,
-    changed: changed,
-    removed: removed
-  };
-};
-
-exports.getPropsDifference = getPropsDifference;
-
-var getShallowPropsDifference = function getShallowPropsDifference(object1, object2) {
-  var _getKeysAddedRemovedC2 = getKeysAddedRemovedCommon(object1, object2),
-      added = _getKeysAddedRemovedC2.added,
-      common = _getKeysAddedRemovedC2.common,
-      removed = _getKeysAddedRemovedC2.removed;
-
-  var changed = common.filter(function (key) {
-    return object1[key] !== object2[key];
-  });
-  return {
-    added: added,
-    changed: changed,
-    removed: removed
-  };
-};
-
-exports.getShallowPropsDifference = getShallowPropsDifference;

package/dist/cjs/utils/react-hooks/use-component-renderer-tracking/index.js

@@ -1,83 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RenderTracking = RenderTracking;
-exports.useComponentRenderTracking = useComponentRenderTracking;
-
-var _react = require("react");
-
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
-
-var _compare = require("../../compare");
-
-var _analytics = require("../../../plugins/analytics");
-
-function useComponentRenderTracking(_ref) {
-  var onRender = _ref.onRender,
-      propsDiffingOptions = _ref.propsDiffingOptions,
-      _ref$zeroBasedCount = _ref.zeroBasedCount,
-      zeroBasedCount = _ref$zeroBasedCount === void 0 ? true : _ref$zeroBasedCount;
-  var propsRef = (0, _react.useRef)();
-  var renderCountRef = (0, _react.useRef)(zeroBasedCount ? 0 : 1);
-  (0, _react.useEffect)(function () {
-    var lastProps = propsRef.current;
-    var renderCount = renderCountRef.current;
-    var propsDifference;
-
-    if (propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.enabled && lastProps) {
-      propsDifference = propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.useShallow ? (0, _compare.getShallowPropsDifference)(lastProps, propsDiffingOptions.props) : (0, _compare.getPropsDifference)(lastProps, propsDiffingOptions.props, 0, 2, propsDiffingOptions === null || propsDiffingOptions === void 0 ? void 0 : propsDiffingOptions.propsToIgnore);
-    }
-
-    var result = {
-      renderCount: renderCount,
-      propsDifference: propsDifference
-    };
-    onRender(result);
-
-    if (propsDiffingOptions !== null && propsDiffingOptions !== void 0 && propsDiffingOptions.enabled) {
-      propsRef.current = propsDiffingOptions.props;
-    }
-
-    renderCountRef.current = renderCountRef.current + 1;
-  }); // No dependencies run on each render
-}
-
-function RenderTracking(props) {
-  var debouncedHandleAnalyticsEvent = (0, _react.useMemo)(function () {
-    return (0, _debounce.default)(props.handleAnalyticsEvent, 500);
-  }, [props.handleAnalyticsEvent]);
-  useComponentRenderTracking({
-    onRender: function onRender(_ref2) {
-      var renderCount = _ref2.renderCount,
-          propsDifference = _ref2.propsDifference;
-
-      if (!renderCount) {
-        return;
-      }
-
-      debouncedHandleAnalyticsEvent({
-        payload: {
-          action: props.action,
-          actionSubject: props.actionSubject,
-          attributes: {
-            count: renderCount,
-            propsDifference: propsDifference
-          },
-          eventType: _analytics.EVENT_TYPE.OPERATIONAL
-        }
-      });
-    },
-    propsDiffingOptions: {
-      enabled: true,
-      props: props.componentProps,
-      propsToIgnore: props.propsToIgnore,
-      useShallow: props.useShallow
-    },
-    zeroBasedCount: true
-  });
-  return null;
-}

package/dist/es2019/plugins/media/commands/media-editor.js

@@ -1,46 +0,0 @@
-import { createCommand, getPluginState } from '../pm-plugins/media-editor-plugin-factory';
-export const openMediaEditor = (pos, identifier) => createCommand({
-  type: 'open',
-  identifier,
-  pos
-});
-export const closeMediaEditor = () => createCommand({
-  type: 'close'
-});
-export const setMediaClientConfig = mediaClientConfig => createCommand({
-  type: 'setMediaClientConfig',
-  mediaClientConfig
-});
-export const uploadAnnotation = (newIdentifier, newDimensions) => createCommand({
-  type: 'upload',
-  newIdentifier
-}, (tr, state) => {
-  const editingMedia = getPluginState(state).editor;
-
-  if (!editingMedia) {
-    return tr;
-  } // remap pos across transactions being applied
-
-
-  const pos = tr.mapping.map(editingMedia.pos); // get the old media node to copy attributes; ensure it's still media
-
-  const oldMediaNode = tr.doc.nodeAt(pos);
-  const {
-    media
-  } = state.schema.nodes;
-
-  if (!oldMediaNode || oldMediaNode.type !== media) {
-    return tr;
-  } // update attributes
-
-
-  const attrs = { ...oldMediaNode.attrs,
-    // @atlaskit/media-editor always gives id as string (better types would be nice...)
-    id: newIdentifier.id,
-    collection: newIdentifier.collectionName || oldMediaNode.attrs.collection,
-    occurrenceKey: newIdentifier.occurrenceKey,
-    width: newDimensions.width,
-    height: newDimensions.height
-  };
-  return tr.setNodeMarkup(pos, undefined, attrs);
-});

package/dist/es2019/plugins/media/pm-plugins/media-editor.js

@@ -1,43 +0,0 @@
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { setMediaClientConfig } from '../commands/media-editor';
-import { createPluginState, pluginKey } from './media-editor-plugin-factory'; // handle mapping changes to providers -> plugin state
-
-const pluginView = providerFactory => view => {
-  const updateMediaProvider = async (name, provider) => {
-    if (name !== 'mediaProvider') {
-      return;
-    }
-
-    const resolvedProvider = await provider;
-
-    if (!resolvedProvider) {
-      return;
-    }
-
-    const resolvedMediaClientConfig = (await resolvedProvider.uploadMediaClientConfig) || (await resolvedProvider.viewMediaClientConfig);
-    const {
-      dispatch,
-      state
-    } = view;
-    setMediaClientConfig(resolvedMediaClientConfig)(state, dispatch, view);
-  };
-
-  providerFactory.subscribe('mediaProvider', updateMediaProvider);
-  return {
-    destroy() {
-      providerFactory.unsubscribe('mediaProvider', updateMediaProvider);
-    }
-
-  };
-};
-
-export const createPlugin = ({
-  dispatch,
-  providerFactory
-}) => {
-  return new SafePlugin({
-    state: createPluginState(dispatch, {}),
-    key: pluginKey,
-    view: pluginView(providerFactory)
-  });
-};

package/dist/es2019/plugins/media/toolbar/annotation.js

@@ -1,136 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import AnnotateIcon from '@atlaskit/icon/glyph/media-services/annotate';
-import { getMediaClient } from '@atlaskit/media-client';
-import Button from '../../floating-toolbar/ui/Button';
-import Separator from '../../floating-toolbar/ui/Separator';
-import { stateKey } from '../pm-plugins/plugin-key';
-import { openMediaEditor } from '../commands/media-editor';
-import { withAnalytics, ACTION_SUBJECT_ID, ACTION_SUBJECT, ACTION, EVENT_TYPE } from '../../../plugins/analytics';
-import { toolbarMessages } from './toolbar-messages';
-
-const annotate = (state, dispatch) => {
-  const pluginState = stateKey.getState(state);
-
-  if (!pluginState) {
-    return false;
-  }
-
-  const {
-    mediaSingle
-  } = state.schema.nodes;
-  const selected = pluginState.selectedMediaContainerNode();
-
-  if (!selected || selected.type !== mediaSingle) {
-    return false;
-  }
-
-  const {
-    id,
-    collection: collectionName,
-    occurrenceKey
-  } = selected.firstChild.attrs;
-  return withAnalytics({
-    action: ACTION.CLICKED,
-    actionSubject: ACTION_SUBJECT.MEDIA,
-    actionSubjectId: ACTION_SUBJECT_ID.ANNOTATE_BUTTON,
-    eventType: EVENT_TYPE.UI
-  })(openMediaEditor(state.selection.from + 1, {
-    id,
-    collectionName,
-    mediaItemType: 'file',
-    occurrenceKey
-  }))(state, dispatch);
-};
-
-export class AnnotationToolbar extends React.Component {
-  constructor(...args) {
-    super(...args);
-
-    _defineProperty(this, "state", {
-      isImage: false
-    });
-
-    _defineProperty(this, "onClickAnnotation", () => {
-      const {
-        view
-      } = this.props;
-
-      if (view) {
-        annotate(view.state, view.dispatch);
-      }
-    });
-  }
-
-  async componentDidMount() {
-    await this.checkIsImage();
-  }
-
-  async checkIsImage() {
-    const mediaClient = getMediaClient(this.props.viewMediaClientConfig);
-
-    if (!this.props.id) {
-      return;
-    }
-
-    try {
-      const state = await mediaClient.file.getCurrentState(this.props.id, {
-        collectionName: this.props.collection
-      });
-
-      if (state && state.status !== 'error' && state.mediaType === 'image') {
-        this.setState({
-          isImage: true
-        });
-      }
-    } catch (err) {// do nothing in case of media-client error
-    }
-  }
-
-  componentDidUpdate(prevProps) {
-    if (prevProps.id !== this.props.id) {
-      this.setState({
-        isImage: false
-      }, () => {
-        this.checkIsImage();
-      });
-    }
-  }
-
-  render() {
-    if (!this.state.isImage) {
-      return null;
-    }
-
-    const {
-      intl
-    } = this.props;
-    const title = intl.formatMessage(toolbarMessages.annotate);
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Separator, null), /*#__PURE__*/React.createElement(Button, {
-      title: title,
-      icon: /*#__PURE__*/React.createElement(AnnotateIcon, {
-        label: title
-      }),
-      onClick: this.onClickAnnotation
-    }));
-  }
-
-}
-export const renderAnnotationButton = (pluginState, intl) => {
-  return (view, idx) => {
-    const selectedContainer = pluginState.selectedMediaContainerNode();
-
-    if (!selectedContainer || !pluginState.mediaClientConfig) {
-      return null;
-    }
-
-    return /*#__PURE__*/React.createElement(AnnotationToolbar, {
-      key: idx,
-      viewMediaClientConfig: pluginState.mediaClientConfig,
-      id: selectedContainer.firstChild.attrs.id,
-      collection: selectedContainer.firstChild.attrs.collection,
-      view: view,
-      intl: intl
-    });
-  };
-};

package/dist/es2019/plugins/media/ui/MediaEditor.js

@@ -1,51 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { SmartMediaEditor } from '@atlaskit/media-editor';
-import { uploadAnnotation, closeMediaEditor } from '../commands/media-editor';
-export default class MediaEditor extends React.PureComponent {
-  constructor(...args) {
-    super(...args);
-
-    _defineProperty(this, "onUploadStart", (newFileIdentifier, dimensions) => {
-      const {
-        state,
-        dispatch
-      } = this.props.view;
-      uploadAnnotation(newFileIdentifier, dimensions)(state, dispatch);
-    });
-
-    _defineProperty(this, "onClose", () => {
-      const {
-        state,
-        dispatch
-      } = this.props.view;
-      closeMediaEditor()(state, dispatch);
-    });
-  }
-
-  render() {
-    const {
-      mediaEditorState: {
-        editor,
-        mediaClientConfig
-      }
-    } = this.props;
-
-    if (!editor || !mediaClientConfig) {
-      return null;
-    }
-
-    const {
-      identifier
-    } = editor;
-    return /*#__PURE__*/React.createElement(SmartMediaEditor, {
-      identifier: identifier,
-      mediaClientConfig: mediaClientConfig,
-      onUploadStart: this.onUploadStart,
-      onClose: this.onClose
-    });
-  }
-
-}
-
-_defineProperty(MediaEditor, "displayName", 'MediaEditor');

package/dist/es2019/ui/Separator/index.js

@@ -1,9 +0,0 @@
-import styled from 'styled-components';
-import { N30 } from '@atlaskit/theme/colors';
-const Separator = styled.span`
-  background: ${N30};
-  height: 100%;
-  padding-left: 1px;
-  margin: 2px 8px;
-`;
-export default Separator;