@atlaskit/editor-core 185.16.3 → 185.16.6

package/dist/es2019/plugins/card/nodeviews/blockCard.js

@@ -1,130 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { Card as SmartCard } from '@atlaskit/smart-card';
-import { UnsupportedBlock } from '@atlaskit/editor-common/ui';
-import { browser } from '@atlaskit/editor-common/utils';
-import PropTypes from 'prop-types';
-import rafSchedule from 'raf-schd';
-import { Card } from './genericCard';
-import ReactNodeView from '@atlaskit/editor-common/react-node-view';
-import { registerCard } from '../pm-plugins/actions';
-import { findOverflowScrollParent } from '@atlaskit/editor-common/ui';
-export class BlockCardComponent extends React.PureComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "onClick", () => {});
-    _defineProperty(this, "onResolve", data => {
-      const {
-        getPos,
-        view
-      } = this.props;
-      if (!getPos || typeof getPos === 'boolean') {
-        return;
-      }
-      const {
-        title,
-        url
-      } = data;
-
-      // don't dispatch immediately since we might be in the middle of
-      // rendering a nodeview
-      rafSchedule(() => {
-        const pos = getPos();
-        if (typeof pos !== 'number') {
-          return;
-        }
-        view.dispatch(registerCard({
-          title,
-          url,
-          pos
-        })(view.state.tr));
-      })();
-    });
-    _defineProperty(this, "gapCursorSpan", () => {
-      // Don't render in EdgeHTMl version <= 18 (Edge version 44)
-      // as it forces the edit popup to render 24px lower than it should
-      if (browser.ie && browser.ie_version < 79) {
-        return;
-      }
-
-      // render an empty span afterwards to get around Webkit bug
-      // that puts caret in next editable text element
-      return /*#__PURE__*/React.createElement("span", {
-        contentEditable: true
-      });
-    });
-    _defineProperty(this, "onError", ({
-      err
-    }) => {
-      if (err) {
-        throw err;
-      }
-    });
-  }
-  UNSAFE_componentWillMount() {
-    const {
-      view
-    } = this.props;
-    const scrollContainer = findOverflowScrollParent(view.dom);
-    this.scrollContainer = scrollContainer || undefined;
-  }
-  render() {
-    const {
-      node,
-      cardContext,
-      platform,
-      showServerActions
-    } = this.props;
-    const {
-      url,
-      data
-    } = node.attrs;
-    const cardInner = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SmartCard, {
-      key: url,
-      url: url,
-      data: data,
-      container: this.scrollContainer,
-      appearance: "block",
-      onClick: this.onClick,
-      onResolve: this.onResolve,
-      onError: this.onError,
-      showActions: platform === 'web',
-      platform: platform,
-      showServerActions: showServerActions
-    }), this.gapCursorSpan());
-    // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
-    // otherwise if we got data, we can render the card directly since it doesn't need the Provider
-    return /*#__PURE__*/React.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
-      value: cardContext.value
-    }, cardInner) : data ? cardInner : null);
-  }
-}
-_defineProperty(BlockCardComponent, "contextTypes", {
-  contextAdapter: PropTypes.object
-});
-const WrappedBlockCard = Card(BlockCardComponent, UnsupportedBlock);
-export class BlockCard extends ReactNodeView {
-  createDomRef() {
-    const domRef = document.createElement('div');
-    if (this.reactComponentProps.platform !== 'mobile') {
-      // workaround Chrome bug in https://product-fabric.atlassian.net/browse/ED-5379
-      // see also: https://github.com/ProseMirror/prosemirror/issues/884
-      domRef.contentEditable = 'true';
-      domRef.setAttribute('spellcheck', 'false');
-    }
-    return domRef;
-  }
-  render() {
-    const {
-      platform,
-      showServerActions
-    } = this.reactComponentProps;
-    return /*#__PURE__*/React.createElement(WrappedBlockCard, {
-      node: this.node,
-      view: this.view,
-      getPos: this.getPos,
-      platform: platform,
-      showServerActions: showServerActions
-    });
-  }
-}

package/dist/es2019/plugins/card/nodeviews/datasource.js

@@ -1,136 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-/** @jsx jsx */
-import React from 'react';
-import PropTypes from 'prop-types';
-import { css, jsx } from '@emotion/react';
-import ReactNodeView from '@atlaskit/editor-common/react-node-view';
-import { DatasourceTableView } from '@atlaskit/link-datasource';
-import { SmartCardSharedCssClassName, DATASOURCE_INNER_CONTAINER_CLASSNAME } from '@atlaskit/editor-common/styles';
-import { calcBreakoutWidthPx } from '@atlaskit/editor-common/utils';
-const containerStyles = css({
-  height: '500px',
-  overflow: 'auto'
-});
-export class DatasourceComponent extends React.PureComponent {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "getPosSafely", () => {
-      const {
-        getPos
-      } = this.props;
-      if (!getPos || typeof getPos === 'boolean') {
-        return;
-      }
-      try {
-        return getPos();
-      } catch (e) {
-        // Can blow up in rare cases, when node has been removed.
-      }
-    });
-    _defineProperty(this, "getDatasource", () => this.props.node.attrs.datasource);
-    _defineProperty(this, "getTableView", datasource => {
-      const views = (datasource || this.getDatasource()).views;
-      return views.find(view => view.type === 'table') || undefined;
-    });
-    _defineProperty(this, "handleColumnChange", columnKeys => {
-      const {
-        state,
-        dispatch
-      } = this.props.view;
-      const pos = this.getPosSafely();
-      if (pos === undefined) {
-        return;
-      }
-      const attrs = this.props.node.attrs;
-      const views = [{
-        type: 'table',
-        properties: {
-          columns: columnKeys.map(key => ({
-            key
-          }))
-        }
-      }];
-      const tr = state.tr.setNodeMarkup(pos, undefined, {
-        ...attrs,
-        datasource: {
-          ...attrs.datasource,
-          views
-        }
-      });
-      tr.setMeta('scrollIntoView', false);
-      dispatch(tr);
-    });
-  }
-  render() {
-    const cardContext = this.context.contextAdapter ? this.context.contextAdapter.card : undefined;
-    const datasource = this.getDatasource();
-    const tableView = this.getTableView();
-    if (tableView) {
-      var _tableView$properties;
-      const visibleColumnKeys = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns.map(({
-        key
-      }) => key);
-
-      // [WS-2307]: we only render card wrapped into a Provider when the value is ready
-      if (cardContext && cardContext.value) {
-        return jsx(cardContext.Provider, {
-          value: cardContext.value
-        }, jsx(DatasourceTableView, {
-          datasourceId: datasource.id,
-          parameters: datasource.parameters,
-          visibleColumnKeys: visibleColumnKeys,
-          onVisibleColumnKeysChange: this.handleColumnChange
-        }));
-      }
-    }
-    return null;
-  }
-}
-_defineProperty(DatasourceComponent, "contextTypes", {
-  contextAdapter: PropTypes.object
-});
-export class Datasource extends ReactNodeView {
-  constructor(props) {
-    var _props$pluginInjectio, _props$pluginInjectio2, _props$pluginInjectio3, _sharedState$currentS;
-    super(props.node, props.view, props.getPos, props.portalProviderAPI, props.eventDispatcher, props, undefined, true, undefined, props.hasIntlContext);
-    _defineProperty(this, "calcTableWidth", (layout, containerWidth) => {
-      if (layout === 'center') {
-        return 'inherit';
-      }
-      return calcBreakoutWidthPx(layout, containerWidth);
-    });
-    const sharedState = props === null || props === void 0 ? void 0 : (_props$pluginInjectio = props.pluginInjectionApi) === null || _props$pluginInjectio === void 0 ? void 0 : (_props$pluginInjectio2 = _props$pluginInjectio.dependencies) === null || _props$pluginInjectio2 === void 0 ? void 0 : (_props$pluginInjectio3 = _props$pluginInjectio2.width) === null || _props$pluginInjectio3 === void 0 ? void 0 : _props$pluginInjectio3.sharedState;
-    this.tableWidth = sharedState === null || sharedState === void 0 ? void 0 : (_sharedState$currentS = sharedState.currentState()) === null || _sharedState$currentS === void 0 ? void 0 : _sharedState$currentS.width;
-    sharedState === null || sharedState === void 0 ? void 0 : sharedState.onChange(({
-      nextSharedState
-    }) => {
-      if (nextSharedState !== null && nextSharedState !== void 0 && nextSharedState.width && this.tableWidth !== (nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.width)) {
-        this.tableWidth = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.width;
-        this.update(this.node, []); // required to update the width when page is resized.
-      }
-    });
-  }
-
-  createDomRef() {
-    const domRef = document.createElement('div');
-    domRef.classList.add(SmartCardSharedCssClassName.DATASOURCE_CONTAINER);
-    return domRef;
-  }
-  render() {
-    const {
-      attrs
-    } = this.node;
-    const calculatedWidth = this.calcTableWidth(attrs.layout, this.tableWidth);
-    return jsx("div", {
-      className: DATASOURCE_INNER_CONTAINER_CLASSNAME,
-      css: containerStyles,
-      style: {
-        minWidth: calculatedWidth
-      }
-    }, jsx(DatasourceComponent, {
-      node: this.node,
-      view: this.view,
-      getPos: this.getPos
-    }));
-  }
-}

package/dist/es2019/plugins/card/nodeviews/embedCard.js

@@ -1,368 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import { Card as SmartCard, EmbedResizeMessageListener } from '@atlaskit/smart-card';
-import PropTypes from 'prop-types';
-import rafSchedule from 'raf-schd';
-import { Card } from './genericCard';
-import { UnsupportedBlock, MediaSingle as RichMediaWrapper, findOverflowScrollParent } from '@atlaskit/editor-common/ui';
-import { DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
-import ReactNodeView from '@atlaskit/editor-common/react-node-view';
-import { registerCard } from '../pm-plugins/actions';
-import ResizableEmbedCard from '../ui/ResizableEmbedCard';
-import { floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-common/utils';
-import { SetAttrsStep } from '@atlaskit/adf-schema/steps';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-const CardInner = ({
-  pluginInjectionApi,
-  getPosSafely,
-  getLineLength,
-  view,
-  smartCard,
-  eventDispatcher,
-  updateSize,
-  getPos,
-  aspectRatio,
-  allowResizing,
-  hasPreview,
-  heightAlone,
-  cardProps,
-  dispatchAnalyticsEvent
-}) => {
-  const {
-    widthState
-  } = useSharedPluginState(pluginInjectionApi, ['width']);
-  const widthStateLineLength = (widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || 0;
-  const widthStateWidth = (widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0;
-  const pos = getPosSafely();
-  if (pos === undefined) {
-    return null;
-  }
-  const lineLength = getLineLength(view, pos, widthStateLineLength);
-  const containerWidth = isRichMediaInsideOfBlockNode(view, pos) ? lineLength : widthStateWidth;
-  if (!allowResizing || !hasPreview) {
-    // There are two ways `width` and `height` can be defined here:
-    // 1) Either as `heightAlone` as height value and no width
-    // 2) or as `1` for height and aspectRation (defined or a default one) as a width
-    // See above for how aspectRation is calculated.
-    const defaultAspectRatio = DEFAULT_EMBED_CARD_WIDTH / DEFAULT_EMBED_CARD_HEIGHT;
-    let richMediaWrapperHeight = 1;
-    let richMediaWrapperWidth = aspectRatio || defaultAspectRatio;
-    if (heightAlone) {
-      richMediaWrapperHeight = heightAlone;
-      richMediaWrapperWidth = undefined;
-    }
-    return /*#__PURE__*/React.createElement(RichMediaWrapper, _extends({}, cardProps, {
-      height: richMediaWrapperHeight,
-      width: richMediaWrapperWidth,
-      nodeType: "embedCard",
-      hasFallbackContainer: hasPreview,
-      lineLength: lineLength,
-      containerWidth: containerWidth
-    }), smartCard);
-  }
-  const displayGrid = (visible, gridType, highlight) => {
-    var _pluginInjectionApi$d;
-    return pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies.grid.actions) === null || _pluginInjectionApi$d === void 0 ? void 0 : _pluginInjectionApi$d.displayGrid(view)({
-      visible,
-      gridType,
-      highlight: highlight
-    });
-  };
-  return /*#__PURE__*/React.createElement(ResizableEmbedCard, _extends({}, cardProps, {
-    height: heightAlone,
-    aspectRatio: aspectRatio,
-    view: view,
-    getPos: getPos,
-    lineLength: lineLength,
-    gridSize: 12,
-    containerWidth: containerWidth,
-    displayGrid: displayGrid,
-    updateSize: updateSize,
-    dispatchAnalyticsEvent: dispatchAnalyticsEvent
-  }), smartCard);
-};
-export class EmbedCardComponent extends React.PureComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "embedIframeRef", /*#__PURE__*/React.createRef());
-    _defineProperty(this, "onClick", () => {});
-    _defineProperty(this, "state", {
-      hasPreview: true
-    });
-    _defineProperty(this, "getPosSafely", () => {
-      const {
-        getPos
-      } = this.props;
-      if (!getPos || typeof getPos === 'boolean') {
-        return;
-      }
-      try {
-        return getPos();
-      } catch (e) {
-        // Can blow up in rare cases, when node has been removed.
-      }
-    });
-    _defineProperty(this, "onResolve", data => {
-      const {
-        view
-      } = this.props;
-      const {
-        title,
-        url,
-        aspectRatio
-      } = data;
-      const {
-        originalHeight,
-        originalWidth
-      } = this.props.node.attrs;
-      if (aspectRatio && !originalHeight && !originalWidth) {
-        // Assumption here is if ADF already have both height and width set,
-        // we will going to use that later on in this class as aspectRatio
-        // Most likely we dealing with an embed that received aspectRatio via onResolve previously
-        // and now this information already stored in ADF.
-        this.setState({
-          initialAspectRatio: aspectRatio
-        });
-        this.saveOriginalDimensionsAttributes(DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_HEIGHT * aspectRatio);
-      }
-
-      // don't dispatch immediately since we might be in the middle of
-      // rendering a nodeview
-      rafSchedule(() => {
-        const pos = this.getPosSafely();
-        if (pos === undefined) {
-          return;
-        }
-        return view.dispatch(registerCard({
-          title,
-          url,
-          pos
-        })(view.state.tr));
-      })();
-      try {
-        const cardContext = this.context.contextAdapter ? this.context.contextAdapter.card : undefined;
-        const hasPreview = cardContext && cardContext.value.extractors.getPreview(url, this.props.platform);
-        if (!hasPreview) {
-          this.setState({
-            hasPreview: false
-          });
-        }
-      } catch (e) {}
-    });
-    _defineProperty(this, "updateSize", (pctWidth, layout) => {
-      const {
-        state,
-        dispatch
-      } = this.props.view;
-      const pos = this.getPosSafely();
-      if (pos === undefined) {
-        return;
-      }
-      const tr = state.tr.setNodeMarkup(pos, undefined, {
-        ...this.props.node.attrs,
-        width: pctWidth,
-        layout
-      });
-      tr.setMeta('scrollIntoView', false);
-      dispatch(tr);
-      return true;
-    });
-    _defineProperty(this, "getLineLength", (view, pos, originalLineLength) => {
-      if (typeof pos === 'number' && isRichMediaInsideOfBlockNode(view, pos)) {
-        const $pos = view.state.doc.resolve(pos);
-        const domNode = view.nodeDOM($pos.pos);
-        if ($pos.nodeAfter && floatingLayouts.indexOf($pos.nodeAfter.attrs.layout) > -1 && domNode && domNode.parentElement) {
-          return domNode.parentElement.offsetWidth;
-        }
-        if (domNode instanceof HTMLElement) {
-          return domNode.offsetWidth;
-        }
-      }
-      return originalLineLength;
-    });
-    /**
-     * Even though render is capable of listening and reacting to iframely wrapper iframe sent `resize` events
-     * it's good idea to store latest actual height in ADF, so that when renderer (well, editor as well) is loading
-     * we will show embed window of appropriate size and avoid unnecessary content jumping.
-     */
-    _defineProperty(this, "saveOriginalDimensionsAttributes", (height, width) => {
-      const {
-        view
-      } = this.props;
-
-      // TODO: ED-15663
-      // Please, do not copy or use this kind of code below
-      // @ts-ignore
-      const fakeTableResizePluginKey = {
-        key: 'tableFlexiColumnResizing$',
-        getState: state => {
-          return state['tableFlexiColumnResizing$'];
-        }
-      };
-      const fakeTableResizeState = fakeTableResizePluginKey.getState(view.state);
-
-      // We are not updating ADF when this function fired while table is resizing.
-      // Changing ADF in the middle of resize will break table resize plugin logic
-      // (tables will be considered different at the end of the drag and cell size won't be stored)
-      // But this is not a big problem, editor user will be seeing latest height anyway (via updated state)
-      // And even if page to be saved with slightly outdated height, renderer is capable of reading latest height value
-      // when embed loads, and so it won't be a problem.
-      if (fakeTableResizeState !== null && fakeTableResizeState !== void 0 && fakeTableResizeState.dragging) {
-        return;
-      }
-      rafSchedule(() => {
-        const pos = this.getPosSafely();
-        if (pos === undefined) {
-          return;
-        }
-        view.dispatch(view.state.tr.step(new SetAttrsStep(pos, {
-          originalHeight: height,
-          originalWidth: width
-        })).setMeta('addToHistory', false));
-      })();
-    });
-    _defineProperty(this, "onHeightUpdate", height => {
-      this.setState({
-        liveHeight: height
-      });
-      this.saveOriginalDimensionsAttributes(height, undefined);
-    });
-    _defineProperty(this, "onError", ({
-      err
-    }) => {
-      if (err) {
-        throw err;
-      }
-    });
-  }
-  UNSAFE_componentWillMount() {
-    const {
-      view
-    } = this.props;
-    const scrollContainer = findOverflowScrollParent(view.dom);
-    this.scrollContainer = scrollContainer || undefined;
-  }
-  render() {
-    const {
-      node,
-      cardContext,
-      platform,
-      allowResizing,
-      fullWidthMode,
-      view,
-      dispatchAnalyticsEvent,
-      getPos,
-      pluginInjectionApi
-    } = this.props;
-    let {
-      url,
-      width: pctWidth,
-      layout,
-      originalHeight,
-      originalWidth
-    } = node.attrs;
-    const {
-      hasPreview,
-      liveHeight,
-      initialAspectRatio
-    } = this.state;
-
-    // We don't want to use `originalHeight` when `originalWidth` also present,
-    // since `heightAlone` is defined only when just height is available.
-    let heightAlone = liveHeight !== null && liveHeight !== void 0 ? liveHeight : !originalWidth && originalHeight || undefined;
-    const aspectRatio = !heightAlone && (
-    // No need getting aspectRatio if heightAlone defined already
-    initialAspectRatio ||
-    // If we have initialAspectRatio (coming from iframely) we should go with that
-    originalHeight && originalWidth && originalWidth / originalHeight) ||
-    // If ADF contains both width and height we get ratio from that
-    undefined;
-    const cardProps = {
-      layout,
-      pctWidth,
-      fullWidthMode
-    };
-    const smartCard = /*#__PURE__*/React.createElement(SmartCard, {
-      key: url,
-      url: url,
-      appearance: "embed",
-      onClick: this.onClick,
-      onResolve: this.onResolve,
-      onError: this.onError,
-      showActions: platform === 'web',
-      isFrameVisible: true,
-      inheritDimensions: true,
-      platform: platform,
-      container: this.scrollContainer,
-      embedIframeRef: this.embedIframeRef
-    });
-    const cardInner = /*#__PURE__*/React.createElement(EmbedResizeMessageListener, {
-      embedIframeRef: this.embedIframeRef,
-      onHeightUpdate: this.onHeightUpdate
-    }, /*#__PURE__*/React.createElement(CardInner, {
-      pluginInjectionApi: pluginInjectionApi,
-      smartCard: smartCard,
-      hasPreview: hasPreview,
-      getPosSafely: this.getPosSafely,
-      view: view,
-      getLineLength: this.getLineLength,
-      eventDispatcher: this.props.eventDispatcher,
-      updateSize: this.updateSize,
-      getPos: getPos,
-      aspectRatio: aspectRatio,
-      allowResizing: allowResizing,
-      heightAlone: heightAlone,
-      cardProps: cardProps,
-      dispatchAnalyticsEvent: dispatchAnalyticsEvent
-    }));
-
-    // [WS-2307]: we only render card wrapped into a Provider when the value is ready
-    return /*#__PURE__*/React.createElement(React.Fragment, null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
-      value: cardContext.value
-    }, cardInner) : null);
-  }
-}
-_defineProperty(EmbedCardComponent, "contextTypes", {
-  contextAdapter: PropTypes.object
-});
-const WrappedBlockCard = Card(EmbedCardComponent, UnsupportedBlock);
-export class EmbedCard extends ReactNodeView {
-  viewShouldUpdate(nextNode) {
-    if (this.node.attrs !== nextNode.attrs) {
-      return true;
-    }
-    return super.viewShouldUpdate(nextNode);
-  }
-  createDomRef() {
-    const domRef = document.createElement('div');
-    if (this.reactComponentProps.platform !== 'mobile') {
-      // workaround Chrome bug in https://product-fabric.atlassian.net/browse/ED-5379
-      // see also: https://github.com/ProseMirror/prosemirror/issues/884
-      domRef.contentEditable = 'true';
-      domRef.setAttribute('spellcheck', 'false');
-    }
-    return domRef;
-  }
-  render() {
-    const {
-      eventDispatcher,
-      allowResizing,
-      platform,
-      fullWidthMode,
-      dispatchAnalyticsEvent,
-      pluginInjectionApi
-    } = this.reactComponentProps;
-    return /*#__PURE__*/React.createElement(WrappedBlockCard, {
-      node: this.node,
-      view: this.view,
-      eventDispatcher: eventDispatcher,
-      getPos: this.getPos,
-      allowResizing: allowResizing,
-      platform: platform,
-      fullWidthMode: fullWidthMode,
-      dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-      pluginInjectionApi: pluginInjectionApi
-    });
-  }
-}