@gechiui/block-editor/build/components/block-draggable/index.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _element = require("@gechiui/element");

var _blocks = require("@gechiui/blocks");

var _components = require("@gechiui/components");

var _data = require("@gechiui/data");

var _draggableChip = _interopRequireDefault(require("./draggable-chip"));

var _useScrollWhenDragging = _interopRequireDefault(require("./use-scroll-when-dragging"));

var _store = require("../../store");

/**
 * GeChiUI dependencies
 */

/**
 * Internal dependencies
 */
const BlockDraggable = _ref => {
  let {
    children,
    clientIds,
    cloneClassname,
    onDragStart,
    onDragEnd
  } = _ref;
  const {
    srcRootClientId,
    isDraggable,
    icon
  } = (0, _data.useSelect)(select => {
    var _getBlockType;

    const {
      getBlockRootClientId,
      getTemplateLock,
      getBlockName
    } = select(_store.store);
    const rootClientId = getBlockRootClientId(clientIds[0]);
    const templateLock = rootClientId ? getTemplateLock(rootClientId) : null;
    const blockName = getBlockName(clientIds[0]);
    return {
      srcRootClientId: rootClientId,
      isDraggable: 'all' !== templateLock,
      icon: (_getBlockType = (0, _blocks.getBlockType)(blockName)) === null || _getBlockType === void 0 ? void 0 : _getBlockType.icon
    };
  }, [clientIds]);
  const isDragging = (0, _element.useRef)(false);
  const [startScrolling, scrollOnDragOver, stopScrolling] = (0, _useScrollWhenDragging.default)();
  const {
    startDraggingBlocks,
    stopDraggingBlocks
  } = (0, _data.useDispatch)(_store.store); // Stop dragging blocks if the block draggable is unmounted

  (0, _element.useEffect)(() => {
    return () => {
      if (isDragging.current) {
        stopDraggingBlocks();
      }
    };
  }, []);

  if (!isDraggable) {
    return children({
      isDraggable: false
    });
  }

  const transferData = {
    type: 'block',
    srcClientIds: clientIds,
    srcRootClientId
  };
  return (0, _element.createElement)(_components.Draggable, {
    cloneClassname: cloneClassname,
    __experimentalTransferDataType: "gc-blocks",
    transferData: transferData,
    onDragStart: event => {
      startDraggingBlocks(clientIds);
      isDragging.current = true;
      startScrolling(event);

      if (onDragStart) {
        onDragStart();
      }
    },
    onDragOver: scrollOnDragOver,
    onDragEnd: () => {
      stopDraggingBlocks();
      isDragging.current = false;
      stopScrolling();

      if (onDragEnd) {
        onDragEnd();
      }
    },
    __experimentalDragComponent: (0, _element.createElement)(_draggableChip.default, {
      count: clientIds.length,
      icon: icon
    })
  }, _ref2 => {
    let {
      onDraggableStart,
      onDraggableEnd
    } = _ref2;
    return children({
      draggable: true,
      onDragStart: onDraggableStart,
      onDragEnd: onDraggableEnd
    });
  });
};

var _default = BlockDraggable;
exports.default = _default;
//# sourceMappingURL=index.js.map