@atlaskit/editor-plugin-block-controls
Version:
Block controls plugin for @atlaskit/editor-core
39 lines • 2.16 kB
JavaScript
import React from 'react';
import { BLOCK_CONTROL_UI_CONTEXT } from '@atlaskit/editor-common/block-controls/block-control-ui-context';
import { BLOCK_CONTROLS_LEFT_SURFACE, BLOCK_CONTROLS_RIGHT_SURFACE } from '@atlaskit/editor-common/block-controls/surface-keys';
import { SurfaceRenderer } from '@atlaskit/editor-ui-control-model/surface-renderer';
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
import { BlockControlsVisibilityProvider } from '../ui/block-controls-surface-components';
import { getBlockControlsSurfaceControlSide } from '../ui/block-controls-surface-context';
import { useBlockControlsVisibility } from '../ui/visibility-container';
/** Renders one block-controls surface for either side on the CLS fix path. */
export var BlockControlsSurfaceWithClsFix = function BlockControlsSurfaceWithClsFix(_ref) {
var api = _ref.api,
components = _ref.components,
forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut,
placement = _ref.placement,
side = _ref.side,
source = _ref.source,
surfaceContext = _ref.surfaceContext,
SurfaceWrapper = _ref.SurfaceWrapper;
var controlSide = side === 'left' ? getBlockControlsSurfaceControlSide(surfaceContext.get(BLOCK_CONTROL_UI_CONTEXT), isExperimentEnabled('platform_editor_controls_reliable_anchor')) : 'right';
var _useBlockControlsVisi = useBlockControlsVisibility({
api: api,
controlSide: controlSide,
forceVisibleOnMouseOut: forceVisibleOnMouseOut
}),
shouldHideHoverControls = _useBlockControlsVisi.shouldHide,
useCssStyles = _useBlockControlsVisi.useCssStyles;
return /*#__PURE__*/React.createElement(SurfaceWrapper, {
placement: placement,
source: source,
surfaceContext: surfaceContext
}, /*#__PURE__*/React.createElement(BlockControlsVisibilityProvider, {
shouldHideHoverControls: shouldHideHoverControls,
useCssStyles: useCssStyles
}, /*#__PURE__*/React.createElement(SurfaceRenderer, {
components: components,
surface: side === 'left' ? BLOCK_CONTROLS_LEFT_SURFACE : BLOCK_CONTROLS_RIGHT_SURFACE,
surfaceContext: surfaceContext
})));
};