@atlaskit/editor-plugin-block-controls/dist/esm/ui/block-controls-surface-components.js

Block controls plugin for @atlaskit/editor-core

import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["isHidden"];
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import React, { createContext, useContext, useMemo } from 'react';
import { BLOCK_CONTROL_UI_CONTEXT } from '@atlaskit/editor-common/block-controls/block-control-ui-context';
import { BLOCK_CONTROLS_LEFT_GROUP, BLOCK_CONTROLS_LEFT_SECTION, BLOCK_CONTROLS_LEFT_SURFACE, BLOCK_CONTROLS_RIGHT_GROUP, BLOCK_CONTROLS_RIGHT_SECTION, BLOCK_CONTROLS_RIGHT_SURFACE } from '@atlaskit/editor-common/block-controls/surface-keys';
import { createSurfaceContext } from '@atlaskit/editor-ui-control-model/create-surface-context';
import { getComponentIdentity, resolveSurface } from '@atlaskit/editor-ui-control-model/surface-renderer';
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
import { partitionComponentsByPersistence } from './utils/partition-components-by-persistence';
import { VisibilityWrapper } from './visibility-container';
var BlockControlsVisibilityContext = /*#__PURE__*/createContext({
  shouldHideHoverControls: false,
  useCssStyles: false
});
var BlockControlItem = function BlockControlItem(_ref) {
  var children = _ref.children;
  return /*#__PURE__*/React.createElement("div", {
    "data-editor-block-control-item": true
  }, children);
};
var HoverBlockControlItem = function HoverBlockControlItem(_ref2) {
  var children = _ref2.children;
  var _useContext = useContext(BlockControlsVisibilityContext),
    shouldHideHoverControls = _useContext.shouldHideHoverControls,
    useCssStyles = _useContext.useCssStyles;
  return /*#__PURE__*/React.createElement(BlockControlItem, null, /*#__PURE__*/React.createElement(VisibilityWrapper, {
    shouldHide: shouldHideHoverControls,
    useCssStyles: useCssStyles
  }, children));
};
var PersistentBlockControlItem = function PersistentBlockControlItem(_ref3) {
  var children = _ref3.children;
  var _useContext2 = useContext(BlockControlsVisibilityContext),
    useCssStyles = _useContext2.useCssStyles;
  return /*#__PURE__*/React.createElement(BlockControlItem, null, /*#__PURE__*/React.createElement(VisibilityWrapper, {
    shouldHide: false,
    useCssStyles: useCssStyles
  }, children));
};
export var BlockControlsVisibilityProvider = function BlockControlsVisibilityProvider(_ref4) {
  var children = _ref4.children,
    shouldHideHoverControls = _ref4.shouldHideHoverControls,
    useCssStyles = _ref4.useCssStyles;
  var value = useMemo(function () {
    return {
      shouldHideHoverControls: shouldHideHoverControls,
      useCssStyles: useCssStyles
    };
  }, [shouldHideHoverControls, useCssStyles]);
  return /*#__PURE__*/React.createElement(BlockControlsVisibilityContext.Provider, {
    value: value
  }, children);
};
var withoutVisibilityPredicate = function withoutVisibilityPredicate(component) {
  var _isHidden = component.isHidden,
    visibleComponent = _objectWithoutProperties(component, _excluded);
  return visibleComponent;
};
var withControlVisibility = function withControlVisibility(surfaceContext, controlVisibility) {
  var context = surfaceContext.get(BLOCK_CONTROL_UI_CONTEXT);
  if (!context) {
    return surfaceContext;
  }
  var controlContext = createSurfaceContext(BLOCK_CONTROL_UI_CONTEXT, _objectSpread(_objectSpread({}, context), {}, {
    controlVisibility: new Map(controlVisibility)
  }));
  return {
    get: function get(token) {
      var _controlContext$get;
      return (_controlContext$get = controlContext.get(token)) !== null && _controlContext$get !== void 0 ? _controlContext$get : surfaceContext.get(token);
    }
  };
};

/**
 * Replaces the shared surface group with one stable wrapper group per visible control. The wrappers
 * inherit each control's rank, so SurfaceRenderer keeps the registry order without re-evaluating
 * the controls' visibility predicates.
 */
var getBlockControlsSurfaceComponents = function getBlockControlsSurfaceComponents(components, _ref5, surfaceContext) {
  var _resolvedSurface$chil;
  var group = _ref5.group,
    section = _ref5.section,
    surface = _ref5.surface;
  var resolvedSurface = resolveSurface(components, surface);
  var groupIdentity = getComponentIdentity(group);
  var controls = (_resolvedSurface$chil = resolvedSurface.childrenMap.get(groupIdentity)) !== null && _resolvedSurface$chil !== void 0 ? _resolvedSurface$chil : [];
  var visibleControls = [];
  var controlVisibility = isExperimentEnabled('platform_editor_remix_control_priority') ? new Map() : undefined;
  var _iterator = _createForOfIteratorHelper(controls),
    _step;
  try {
    for (_iterator.s(); !(_step = _iterator.n()).done;) {
      var _control$isHidden, _control$isHidden2;
      var control = _step.value;
      var isHidden = (_control$isHidden = (_control$isHidden2 = control.isHidden) === null || _control$isHidden2 === void 0 ? void 0 : _control$isHidden2.call(control, {
        surfaceContext: controlVisibility ? withControlVisibility(surfaceContext, controlVisibility) : surfaceContext
      })) !== null && _control$isHidden !== void 0 ? _control$isHidden : false;
      controlVisibility === null || controlVisibility === void 0 || controlVisibility.set(control.key, isHidden);
      if (!isHidden) {
        visibleControls.push(control);
      }
    }
  } catch (err) {
    _iterator.e(err);
  } finally {
    _iterator.f();
  }
  if (!resolvedSurface.root || visibleControls.length === 0) {
    return undefined;
  }
  var controlIdentities = new Set(controls.map(getComponentIdentity));
  var visibleControlIdentities = new Set(visibleControls.map(getComponentIdentity));
  var _partitionComponentsB = partitionComponentsByPersistence(resolvedSurface.components.filter(function (component) {
      var identity = getComponentIdentity(component);
      return !controlIdentities.has(identity) || visibleControlIdentities.has(identity);
    }), surface, surfaceContext),
    persistentComponents = _partitionComponentsB.persistentComponents;
  var persistentIdentities = new Set(persistentComponents.map(getComponentIdentity));
  var structuralComponents = resolvedSurface.components.filter(function (component) {
    var identity = getComponentIdentity(component);
    return identity !== groupIdentity && !controlIdentities.has(identity);
  }).map(withoutVisibilityPredicate);
  var wrappedControls = visibleControls.flatMap(function (control) {
    var _control$parents$find, _control$parents;
    var identity = getComponentIdentity(control);
    var rank = (_control$parents$find = (_control$parents = control.parents) === null || _control$parents === void 0 || (_control$parents = _control$parents.find(function (parent) {
      return getComponentIdentity(parent) === groupIdentity;
    })) === null || _control$parents === void 0 ? void 0 : _control$parents.rank) !== null && _control$parents$find !== void 0 ? _control$parents$find : 0;
    var wrapper = {
      component: persistentIdentities.has(identity) ? PersistentBlockControlItem : HoverBlockControlItem,
      key: "block-control-item:".concat(identity),
      parents: [_objectSpread(_objectSpread({}, section), {}, {
        rank: rank
      })],
      type: 'group'
    };
    var visibleControl = _objectSpread(_objectSpread({}, withoutVisibilityPredicate(control)), {}, {
      parents: [{
        key: wrapper.key,
        rank: 0,
        type: wrapper.type
      }]
    });
    return [wrapper, visibleControl];
  });
  return [].concat(_toConsumableArray(structuralComponents), _toConsumableArray(wrappedControls));
};
export var getBlockControlsLeftSurfaceComponents = function getBlockControlsLeftSurfaceComponents(components, surfaceContext) {
  return getBlockControlsSurfaceComponents(components, {
    group: BLOCK_CONTROLS_LEFT_GROUP,
    section: BLOCK_CONTROLS_LEFT_SECTION,
    surface: BLOCK_CONTROLS_LEFT_SURFACE
  }, surfaceContext);
};
export var getBlockControlsRightSurfaceComponents = function getBlockControlsRightSurfaceComponents(components, surfaceContext) {
  return getBlockControlsSurfaceComponents(components, {
    group: BLOCK_CONTROLS_RIGHT_GROUP,
    section: BLOCK_CONTROLS_RIGHT_SECTION,
    surface: BLOCK_CONTROLS_RIGHT_SURFACE
  }, surfaceContext);
};