@atlaskit/editor-plugin-block-controls
Version:
Block controls plugin for @atlaskit/editor-core
67 lines (66 loc) • 4.16 kB
JavaScript
/* block-controls-left-surface.tsx generated by @compiled/babel-plugin v3.0.2 */
import "./block-controls-left-surface.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React from 'react';
import { BLOCK_CONTROL_UI_CONTEXT } from '@atlaskit/editor-common/block-controls/block-control-ui-context';
import { BLOCK_CONTROLS_LEFT_SURFACE } from '@atlaskit/editor-common/block-controls/surface-keys';
import { SurfaceRenderer, willSurfaceRender } from '@atlaskit/editor-ui-control-model/surface-renderer';
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
import { getBlockControlsSurfaceControlSide } from './block-controls-surface-context';
import { partitionComponentsByPersistence } from './utils/partition-components-by-persistence';
import { VisibilityContainer } from './visibility-container';
var leftSurfaceOuterStyles = null;
var leftSurfaceRowStyles = null;
// Applied in addition to leftSurfaceRowStyles when the target node is sticky-eligible (e.g. long
// tables): the outer wrapper spans the node's full height (see `placement.height`), so the content
// can stick near the top of the viewport instead of scrolling off with the node's top edge.
// Keep in sync with STICKY_CONTROLS_TOP_MARGIN in ./consts (must be a static literal here).
var leftSurfaceStickyStyles = null;
/** Renders one left block-controls surface at a document position. */
export var BlockControlsLeftSurface = function BlockControlsLeftSurface(_ref) {
var api = _ref.api,
components = _ref.components,
forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut,
placement = _ref.placement,
source = _ref.source,
surfaceContext = _ref.surfaceContext;
if (!placement || !willSurfaceRender(components, BLOCK_CONTROLS_LEFT_SURFACE, surfaceContext)) {
return null;
}
var _partitionComponentsB = partitionComponentsByPersistence(components, BLOCK_CONTROLS_LEFT_SURFACE, surfaceContext),
hoverOnlyComponents = _partitionComponentsB.hoverOnlyComponents,
persistentComponents = _partitionComponentsB.persistentComponents;
var willRenderPersistent = willSurfaceRender(persistentComponents, BLOCK_CONTROLS_LEFT_SURFACE, surfaceContext);
var willRenderHoverOnly = willSurfaceRender(hoverOnlyComponents, BLOCK_CONTROLS_LEFT_SURFACE, surfaceContext);
var isSticky = placement.isSticky;
return /*#__PURE__*/React.createElement("div", {
"data-editor-block-controls-surface": true,
"data-editor-block-controls-side": "left",
"data-testid": source === 'stored' ? 'block-controls-left-surface-stored' : source === 'active' ? 'block-controls-left-surface-active' : 'block-controls-left-surface'
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Placement is resolved per target node, from its runtime DOM geometry or from its CSS anchor.
,
style: placement.style,
className: ax(["_kqswstnw _17c61i8t _1pbyb4wl"])
}, /*#__PURE__*/React.createElement("div", {
className: ax(["_zulpv77o _4cvr1h6o _1e0c1txw", isSticky && "_kqsw1if8 _154iu2gc"])
}, willRenderHoverOnly && /*#__PURE__*/React.createElement(VisibilityContainer, {
api: api,
controlSide: getBlockControlsSurfaceControlSide(surfaceContext.get(BLOCK_CONTROL_UI_CONTEXT), isExperimentEnabled('platform_editor_controls_reliable_anchor')),
forceVisibleOnMouseOut: forceVisibleOnMouseOut,
shouldUseDisplayContents: true
}, /*#__PURE__*/React.createElement(SurfaceRenderer, {
components: hoverOnlyComponents,
surface: BLOCK_CONTROLS_LEFT_SURFACE,
surfaceContext: surfaceContext
})), willRenderPersistent && /*#__PURE__*/React.createElement(VisibilityContainer, {
api: api,
controlSide: getBlockControlsSurfaceControlSide(surfaceContext.get(BLOCK_CONTROL_UI_CONTEXT), isExperimentEnabled('platform_editor_controls_reliable_anchor')),
forceVisibleOnMouseOut: forceVisibleOnMouseOut,
isPersistent: true,
shouldUseDisplayContents: true
}, /*#__PURE__*/React.createElement(SurfaceRenderer, {
components: persistentComponents,
surface: BLOCK_CONTROLS_LEFT_SURFACE,
surfaceContext: surfaceContext
}))));
};