@atlaskit/editor-plugin-table/dist/es2019/ui/FloatingContextualMenu/index.js

Table plugin for the @atlaskit/editor

/**
 * @jsxRuntime classic
 * @jsx jsx
 */
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { jsx } from '@emotion/react';
import { Popup } from '@atlaskit/editor-common/ui';
import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
import { akEditorFloatingDialogZIndex, akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
import { findCellRectClosestToPos, getSelectionRect, isSelectionType } from '@atlaskit/editor-tables/utils';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
import { getPluginState } from '../../pm-plugins/plugin-factory';
import { contextualMenuDropdownWidth, contextualMenuDropdownWidthDnD, contextualMenuTriggerSize, tablePopupMenuFitHeight } from '../consts';

// Ignored via go/ees005
// eslint-disable-next-line import/no-named-as-default
import ContextualMenu from './ContextualMenu';
import { tablePopupStyles } from './styles';
const FloatingContextualMenu = ({
  mountPoint,
  boundariesElement,
  scrollableElement,
  editorView,
  isOpen,
  pluginConfig,
  editorAnalyticsAPI,
  getEditorContainerWidth,
  getEditorFeatureFlags,
  isCellMenuOpenByKeyboard,
  isCommentEditor,
  api,
  isDragMenuOpen
}) => {
  if (expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) && !editorView) {
    return null;
  }

  // TargetCellPosition could be outdated: https://product-fabric.atlassian.net/browse/ED-8129
  // Remove ! during platform_editor_hydratable_ui cleanup
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  const {
    targetCellPosition,
    isDragAndDropEnabled
  } = getPluginState(editorView.state);
  // Remove ! during platform_editor_hydratable_ui cleanup
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  if (!isOpen || !targetCellPosition || editorView.state.doc.nodeSize <= targetCellPosition) {
    return null;
  }

  // Remove ! during platform_editor_hydratable_ui cleanup
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  const {
    selection
  } = editorView.state;
  const selectionRect = isSelectionType(selection, 'cell') ?
  // Ignored via go/ees005
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  getSelectionRect(selection) : findCellRectClosestToPos(selection.$from);
  if (!selectionRect) {
    return null;
  }
  // Remove ! during platform_editor_hydratable_ui cleanup
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  const domAtPos = editorView.domAtPos.bind(editorView);
  const targetCellRef = findDomRefAtPos(targetCellPosition, domAtPos);
  if (!targetCellRef) {
    return null;
  }
  const parentSticky = targetCellRef.parentElement && targetCellRef.parentElement.className.indexOf('sticky') > -1;
  return jsx(Popup, {
    alignX: "right",
    alignY: "top"
    // Ignored via go/ees005
    // eslint-disable-next-line @atlaskit/editor/no-as-casting
    ,
    target: targetCellRef,
    mountTo: mountPoint,
    boundariesElement: boundariesElement,
    scrollableElement: scrollableElement,
    fitHeight: tablePopupMenuFitHeight,
    fitWidth: isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth
    // z-index value below is to ensure that this menu is above other floating menu
    // in table, but below floating dialogs like typeaheads, pickers, etc.
    ,
    zIndex: parentSticky ? akEditorFloatingDialogZIndex : akEditorFloatingOverlapPanelZIndex,
    forcePlacement: true
    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
    ,
    offset: [-7, 0],
    stick: true
  }, jsx("div", {
    css: tablePopupStyles(isDragAndDropEnabled)
  }, jsx(ContextualMenu
  // Remove ! during platform_editor_hydratable_ui cleanup
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
  , {
    editorView: editorView
    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
    ,
    offset: [contextualMenuTriggerSize / 2, -contextualMenuTriggerSize],
    isOpen: isOpen,
    targetCellPosition: targetCellPosition,
    allowColumnSorting: pluginConfig && pluginConfig.allowColumnSorting
    // Ignored via go/ees005
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    ,
    allowMergeCells: pluginConfig.allowMergeCells
    // Ignored via go/ees005
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    ,
    allowBackgroundColor: pluginConfig.allowBackgroundColor,
    selectionRect: selectionRect,
    mountPoint: mountPoint,
    boundariesElement: boundariesElement,
    editorAnalyticsAPI: editorAnalyticsAPI,
    getEditorContainerWidth: getEditorContainerWidth,
    getEditorFeatureFlags: getEditorFeatureFlags,
    isCellMenuOpenByKeyboard: isCellMenuOpenByKeyboard,
    isCommentEditor: isCommentEditor,
    api: api,
    isDragMenuOpen: isDragMenuOpen
  })));
};
FloatingContextualMenu.displayName = 'FloatingContextualMenu';
export default FloatingContextualMenu;