@atlaskit/editor-core 185.16.3 → 185.16.6

package/dist/es2019/plugins/card/ui/EditorSmartCardEventsNext.js

@@ -1,198 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { useEffect, useMemo } from 'react';
-import PropTypes from 'prop-types';
-import { useSmartLinkLifecycleAnalytics } from '@atlaskit/link-analytics';
-import { INPUT_METHOD, ACTION } from '@atlaskit/editor-common/analytics';
-import { AnalyticsContext, UIAnalyticsEvent } from '@atlaskit/analytics-next';
-import { registerSmartCardEventsNext } from '../pm-plugins/actions';
-import { getAnalyticsEditorAppearance } from '@atlaskit/editor-common/utils';
-import { getPluginState } from '../pm-plugins/util/state';
-/**
- * If the metadata is for a history event,
- * returns undo/redo instead of instead of what fn(metadata) would have otherwise
- * returned
- */
-const withHistoryMethod = fn => {
-  return metadata => {
-    const {
-      isUndo,
-      isRedo
-    } = metadata;
-    if (isUndo) {
-      return 'undo';
-    }
-    if (isRedo) {
-      return 'redo';
-    }
-    return fn(metadata);
-  };
-};
-const getMethod = withHistoryMethod(({
-  inputMethod
-}) => {
-  switch (inputMethod) {
-    case INPUT_METHOD.CLIPBOARD:
-      return 'editor_paste';
-    case INPUT_METHOD.FLOATING_TB:
-      return 'editor_floatingToolbar';
-    case INPUT_METHOD.AUTO_DETECT:
-    case INPUT_METHOD.FORMATTING:
-      return 'editor_type';
-    default:
-      return 'unknown';
-  }
-});
-const getUpdateType = withHistoryMethod(({
-  action
-}) => {
-  switch (action) {
-    case ACTION.CHANGED_TYPE:
-      return 'display_update';
-    case ACTION.UPDATED:
-      return 'link_update';
-    default:
-      return 'unknown';
-  }
-});
-const getDeleteType = withHistoryMethod(({
-  action
-}) => {
-  if (action === ACTION.UNLINK) {
-    return 'unlink';
-  }
-  return 'delete';
-});
-const getSourceEventFromMetadata = metadata => {
-  return metadata.sourceEvent instanceof UIAnalyticsEvent ? metadata.sourceEvent : null;
-};
-
-/**
- * Set display category as `link` if not displaying the link as a smart card
- */
-const displayCategoryFromDisplay = display => {
-  if (display === 'url') {
-    return 'link';
-  }
-};
-
-/**
- * Binds the @atlaskit/link-analytics callbacks
- * to the editor card plugin state events callbacks interfaces
- */
-export const EventsBinding = ({
-  editorView
-}) => {
-  /**
-   * These callbacks internally use window.requestIdleCallback/requestAnimationFrame
-   * to defer any heavy operations involving network
-   *
-   * The callbacks themselves should not be deferred, they should be called syncronously the moment
-   * the events take place.
-   */
-  const {
-    linkCreated,
-    linkUpdated,
-    linkDeleted
-  } = useSmartLinkLifecycleAnalytics();
-  const events = useMemo(() => {
-    return {
-      created: metadata => {
-        const {
-          url,
-          display,
-          nodeContext
-        } = metadata;
-        const displayCategory = displayCategoryFromDisplay(display);
-        const sourceEvent = getSourceEventFromMetadata(metadata);
-        const creationMethod = getMethod(metadata);
-        linkCreated({
-          url,
-          displayCategory
-        }, sourceEvent, {
-          display,
-          nodeContext,
-          creationMethod
-        });
-      },
-      updated: metadata => {
-        const {
-          url,
-          display,
-          previousDisplay,
-          nodeContext
-        } = metadata;
-        const displayCategory = displayCategoryFromDisplay(display);
-        const sourceEvent = getSourceEventFromMetadata(metadata);
-        const updateMethod = getMethod(metadata);
-        const updateType = getUpdateType(metadata);
-        linkUpdated({
-          url,
-          displayCategory
-        }, sourceEvent, {
-          display,
-          previousDisplay,
-          nodeContext,
-          updateMethod,
-          updateType
-        });
-      },
-      deleted: metadata => {
-        const {
-          url,
-          display,
-          nodeContext
-        } = metadata;
-        const displayCategory = displayCategoryFromDisplay(display);
-        const sourceEvent = getSourceEventFromMetadata(metadata);
-        const deleteMethod = getMethod(metadata);
-        const deleteType = getDeleteType(metadata);
-        linkDeleted({
-          url,
-          displayCategory
-        }, sourceEvent, {
-          display,
-          nodeContext,
-          deleteMethod,
-          deleteType
-        });
-      }
-    };
-  }, [linkCreated, linkUpdated, linkDeleted]);
-  useEffect(() => {
-    editorView.dispatch(registerSmartCardEventsNext(events)(editorView.state.tr));
-  }, [events, editorView]);
-  return null;
-};
-export class EditorSmartCardEventsNext extends React.PureComponent {
-  render() {
-    var _getPluginState;
-    const cardContext = this.context.contextAdapter.card;
-
-    /**
-     * The analytics hook needs to be able to communicate with the card context
-     * If we can't access it, don't mount the event bindings
-     * This effectively entirely disables all tracking behaviour
-     */
-    if (!cardContext) {
-      return null;
-    }
-    const editorAppearance = (_getPluginState = getPluginState(this.props.editorView.state)) === null || _getPluginState === void 0 ? void 0 : _getPluginState.editorAppearance;
-    const analyticsEditorAppearance = getAnalyticsEditorAppearance(editorAppearance);
-    const analyticsData = {
-      attributes: {
-        location: analyticsEditorAppearance
-      },
-      // Below is added for the future implementation of Linking Platform namespaced analytic context
-      location: analyticsEditorAppearance
-    };
-    return /*#__PURE__*/React.createElement(cardContext.Provider, {
-      value: cardContext.value
-    }, /*#__PURE__*/React.createElement(AnalyticsContext, {
-      data: analyticsData
-    }, /*#__PURE__*/React.createElement(EventsBinding, this.props)));
-  }
-}
-_defineProperty(EditorSmartCardEventsNext, "contextTypes", {
-  contextAdapter: PropTypes.object
-});

package/dist/es2019/plugins/card/ui/HyperlinkToolbarAppearance.js

@@ -1,86 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { Component } from 'react';
-import { LinkToolbarAppearance } from './LinkToolbarAppearance';
-export class HyperlinkToolbarAppearance extends Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "state", {
-      supportedUrlsMap: new Map()
-    });
-    _defineProperty(this, "getProvider", async () => {
-      if (this.cardProvider) {
-        return this.cardProvider;
-      }
-      return new Promise(resolve => {
-        const {
-          providerFactory
-        } = this.props;
-        providerFactory.subscribe('cardProvider', async (_, cardProvider) => {
-          if (!cardProvider) {
-            return;
-          }
-          this.cardProvider = await cardProvider;
-          resolve(this.cardProvider);
-        });
-      });
-    });
-    _defineProperty(this, "resolveUrl", async url => {
-      const {
-        supportedUrlsMap
-      } = this.state;
-      if (supportedUrlsMap.has(url)) {
-        return;
-      }
-      let isUrlSupported = false;
-      try {
-        const provider = await this.getProvider();
-        isUrlSupported = await provider.findPattern(url);
-      } catch (error) {
-        isUrlSupported = false;
-      }
-      supportedUrlsMap.set(url, isUrlSupported);
-      this.setState({
-        supportedUrlsMap
-      });
-    });
-    _defineProperty(this, "componentDidMount", () => this.resolveUrl(this.props.url));
-  }
-  // needed so we display the right state on the Toolbar while the same Toolbar
-  // instance is visible and we click other link
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    if (nextProps.url !== this.props.url) {
-      this.resolveUrl(nextProps.url);
-    }
-  }
-  render() {
-    const {
-      url,
-      intl,
-      editorView,
-      editorState,
-      cardOptions,
-      platform,
-      editorAnalyticsApi,
-      cardActions
-    } = this.props;
-    const {
-      supportedUrlsMap
-    } = this.state;
-    if (!supportedUrlsMap.get(url)) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement(LinkToolbarAppearance, {
-      key: "link-appearance",
-      url: url,
-      intl: intl,
-      editorView: editorView,
-      editorState: editorState,
-      allowEmbeds: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowEmbeds,
-      allowBlockCards: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowBlockCards,
-      platform: platform,
-      editorAnalyticsApi: editorAnalyticsApi,
-      cardActions: cardActions
-    });
-  }
-}

package/dist/es2019/plugins/card/ui/LayoutButton/index.js

@@ -1,106 +0,0 @@
-/** @jsx jsx */
-import React, { useCallback, useMemo } from 'react';
-import { jsx } from '@emotion/react';
-import { Popup } from '@atlaskit/editor-common/ui';
-import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
-import CollapseIcon from '@atlaskit/icon/glyph/editor/collapse';
-import ExpandIcon from '@atlaskit/icon/glyph/editor/expand';
-import { injectIntl } from 'react-intl-next';
-import { toolbarButtonWrapper } from './styled';
-import { getDatasource } from './utils';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import { setCardLayout } from '../../pm-plugins/actions';
-import { getNextBreakoutMode, getTitle } from '@atlaskit/editor-common/utils';
-export const LayoutButton = ({
-  onLayoutChange,
-  layout = 'center',
-  intl: {
-    formatMessage
-  },
-  mountPoint,
-  boundariesElement,
-  scrollableElement,
-  targetElement,
-  testId = 'datasource-table-layout-button'
-}) => {
-  const handleClick = useCallback(() => {
-    onLayoutChange && onLayoutChange(getNextBreakoutMode(layout));
-  }, [layout, onLayoutChange]);
-  const title = useMemo(() => {
-    return formatMessage(getTitle(layout));
-  }, [formatMessage, layout]);
-  if (!targetElement) {
-    return null;
-  }
-  return jsx(Popup, {
-    mountTo: mountPoint,
-    boundariesElement: boundariesElement,
-    scrollableElement: scrollableElement,
-    target: targetElement,
-    alignY: "start",
-    alignX: "end",
-    forcePlacement: true,
-    stick: true,
-    ariaLabel: title
-  }, jsx(ToolbarButton, {
-    testId: testId,
-    css: toolbarButtonWrapper,
-    title: title,
-    onClick: handleClick,
-    iconBefore: layout === 'full-width' ? jsx(CollapseIcon, {
-      label: title
-    }) : jsx(ExpandIcon, {
-      label: title
-    })
-  }));
-};
-const LayoutButtonWrapper = ({
-  editorView,
-  mountPoint,
-  scrollableElement,
-  boundariesElement,
-  intl,
-  api
-}) => {
-  var _node$attrs, _node$attrs2;
-  const {
-    cardState
-  } = useSharedPluginState(api, ['card']);
-  const {
-    node,
-    pos
-  } = getDatasource(editorView);
-  const {
-    datasourceTableRef,
-    layout = (node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.layout) || 'center'
-  } = cardState !== null && cardState !== void 0 ? cardState : {};
-  const isDatasource = !!(node !== null && node !== void 0 && (_node$attrs2 = node.attrs) !== null && _node$attrs2 !== void 0 && _node$attrs2.datasource);
-  const onLayoutChange = layout => {
-    if (pos === undefined) {
-      return;
-    }
-    const {
-      state,
-      dispatch
-    } = editorView;
-    const tr = state.tr.setNodeMarkup(pos, undefined, {
-      ...(node === null || node === void 0 ? void 0 : node.attrs),
-      layout
-    });
-    tr.setMeta('scrollIntoView', false);
-    dispatch(setCardLayout(layout)(tr));
-  };
-  if (!isDatasource) {
-    return null;
-  }
-  return jsx(LayoutButton, {
-    mountPoint: mountPoint,
-    scrollableElement: scrollableElement,
-    boundariesElement: boundariesElement,
-    targetElement: datasourceTableRef,
-    layout: layout,
-    onLayoutChange: onLayoutChange,
-    intl: intl
-  });
-};
-export default injectIntl(LayoutButtonWrapper);

package/dist/es2019/plugins/card/ui/LayoutButton/styled.js

@@ -1,10 +0,0 @@
-import { css } from '@emotion/react';
-import { B300, N300, N20A } from '@atlaskit/theme/colors';
-export const toolbarButtonWrapper = css({
-  background: `${`var(--ds-background-neutral, ${N20A})`}`,
-  color: `${`var(--ds-icon, ${N300})`}`,
-  ':hover': {
-    background: `${`var(--ds-background-neutral-hovered, ${B300})`}`,
-    color: `${"var(--ds-icon, white)"} !important`
-  }
-});

package/dist/es2019/plugins/card/ui/LayoutButton/types.js

@@ -1 +0,0 @@
-export {};

package/dist/es2019/plugins/card/ui/LayoutButton/utils.js

@@ -1,15 +0,0 @@
-import { findSelectedNodeOfType } from 'prosemirror-utils';
-export const getDatasource = editorView => {
-  var _findSelectedNodeOfTy;
-  const {
-    selection,
-    schema
-  } = editorView.state;
-  const {
-    blockCard
-  } = schema.nodes;
-  return (_findSelectedNodeOfTy = findSelectedNodeOfType([blockCard])(selection)) !== null && _findSelectedNodeOfTy !== void 0 ? _findSelectedNodeOfTy : {
-    node: undefined,
-    pos: undefined
-  };
-};

package/dist/es2019/plugins/card/ui/LinkToolbarAppearance.js

@@ -1,117 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Fragment } from 'prosemirror-model';
-import { ACTION, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import nodeNames, { cardMessages as messages } from '@atlaskit/editor-common/messages';
-import { isSupportedInParent } from '@atlaskit/editor-common/utils';
-import { getButtonGroupOption, LinkToolbarButtonGroup, commandWithMetadata } from '@atlaskit/editor-common/card';
-export class LinkToolbarAppearance extends React.Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "renderDropdown", (view, cardContext) => {
-      var _cardActions$setSelec, _cardActions$setSelec2, _cardActions$changeSe, _cardActions$setSelec3;
-      const {
-        url,
-        intl,
-        currentAppearance,
-        editorState,
-        allowEmbeds,
-        allowBlockCards = true,
-        platform,
-        editorAnalyticsApi,
-        cardActions
-      } = this.props;
-      const preview = allowEmbeds && cardContext && url && cardContext.extractors.getPreview(url, platform);
-      const defaultCommand = () => false;
-      if (url) {
-        var _cardContext$store, _urlState$error;
-        const urlState = cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$store = cardContext.store) === null || _cardContext$store === void 0 ? void 0 : _cardContext$store.getState()[url];
-        if ((urlState === null || urlState === void 0 ? void 0 : (_urlState$error = urlState.error) === null || _urlState$error === void 0 ? void 0 : _urlState$error.kind) === 'fatal') {
-          return null;
-        }
-      }
-      const isBlockCardLinkSupportedInParent = allowBlockCards ? isSupportedInParent(editorState, Fragment.from(editorState.schema.nodes.blockCard.createChecked({})), currentAppearance) : false;
-      const isEmbedCardLinkSupportedInParent = allowEmbeds ? isSupportedInParent(editorState, Fragment.from(editorState.schema.nodes.embedCard.createChecked({})), currentAppearance) : false;
-      const embedOption = allowEmbeds && preview && {
-        appearance: 'embed',
-        title: intl.formatMessage(messages.embed),
-        onClick: (_cardActions$setSelec = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('embed', editorAnalyticsApi)) !== null && _cardActions$setSelec !== void 0 ? _cardActions$setSelec : defaultCommand,
-        selected: currentAppearance === 'embed',
-        hidden: false,
-        testId: 'embed-appearance',
-        disabled: !isEmbedCardLinkSupportedInParent,
-        tooltip: isEmbedCardLinkSupportedInParent ? undefined : getUnavailableMessage(editorState, intl)
-      };
-      const blockCardOption = allowBlockCards && {
-        appearance: 'block',
-        title: intl.formatMessage(messages.block),
-        onClick: (_cardActions$setSelec2 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('block', editorAnalyticsApi)) !== null && _cardActions$setSelec2 !== void 0 ? _cardActions$setSelec2 : defaultCommand,
-        selected: currentAppearance === 'block',
-        testId: 'block-appearance',
-        disabled: !isBlockCardLinkSupportedInParent,
-        tooltip: isBlockCardLinkSupportedInParent ? undefined : getUnavailableMessage(editorState, intl)
-      };
-      const options = [{
-        title: intl.formatMessage(messages.url),
-        onClick: commandWithMetadata((_cardActions$changeSe = cardActions === null || cardActions === void 0 ? void 0 : cardActions.changeSelectedCardToLink(url, url, true, undefined, undefined, editorAnalyticsApi)) !== null && _cardActions$changeSe !== void 0 ? _cardActions$changeSe : defaultCommand, {
-          action: ACTION.CHANGED_TYPE
-        }),
-        selected: !currentAppearance,
-        testId: 'url-appearance'
-      }, {
-        appearance: 'inline',
-        title: intl.formatMessage(messages.inline),
-        onClick: (_cardActions$setSelec3 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('inline', editorAnalyticsApi)) !== null && _cardActions$setSelec3 !== void 0 ? _cardActions$setSelec3 : defaultCommand,
-        selected: currentAppearance === 'inline',
-        testId: 'inline-appearance'
-      }];
-      const dispatchCommand = fn => {
-        fn && fn(editorState, view && view.dispatch);
-        // Refocus the view to ensure the editor has focus
-        if (view && !view.hasFocus()) {
-          view.focus();
-        }
-      };
-      if (blockCardOption) {
-        options.push(blockCardOption);
-      }
-      if (embedOption) {
-        options.push(embedOption);
-      }
-      return /*#__PURE__*/React.createElement(LinkToolbarButtonGroup, {
-        key: "link-toolbar-button-group",
-        options: options.map(option => getButtonGroupOption(intl, dispatchCommand, {
-          ...option,
-          onClick: commandWithMetadata(option.onClick, {
-            inputMethod: INPUT_METHOD.FLOATING_TB
-          })
-        }))
-      });
-    });
-  }
-  render() {
-    const cardContext = this.context.contextAdapter ? this.context.contextAdapter.card : undefined;
-    const {
-      editorView
-    } = this.props;
-    return this.renderDropdown(editorView, cardContext && cardContext.value);
-  }
-}
-_defineProperty(LinkToolbarAppearance, "contextTypes", {
-  contextAdapter: PropTypes.object
-});
-const getUnavailableMessage = (state, intl) => {
-  try {
-    const parentNode = state.selection.$from.node(1);
-    const parentName = intl.formatMessage(nodeNames[parentNode.type.name]);
-    const tooltip = intl.formatMessage(messages.displayOptionUnavailableInParentNode, {
-      node: parentName
-    });
-    return tooltip;
-  } catch (e) {
-    return intl.formatMessage(messages.displayOptionUnavailableInParentNode, {
-      node: intl.formatMessage(nodeNames.defaultBlockNode)
-    });
-  }
-};