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

Generic block editor.

import { createElement } from "@gechiui/element";

/**
 * GeChiUI dependencies
 */
import { getBlockType } from '@gechiui/blocks';
import { Draggable } from '@gechiui/components';
import { useSelect, useDispatch } from '@gechiui/data';
import { useEffect, useRef } from '@gechiui/element';
/**
 * Internal dependencies
 */

import BlockDraggableChip from './draggable-chip';
import useScrollWhenDragging from './use-scroll-when-dragging';
import { store as blockEditorStore } from '../../store';

const BlockDraggable = _ref => {
  let {
    children,
    clientIds,
    cloneClassname,
    onDragStart,
    onDragEnd
  } = _ref;
  const {
    srcRootClientId,
    isDraggable,
    icon
  } = useSelect(select => {
    var _getBlockType;

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

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

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

  const transferData = {
    type: 'block',
    srcClientIds: clientIds,
    srcRootClientId
  };
  return createElement(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: createElement(BlockDraggableChip, {
      count: clientIds.length,
      icon: icon
    })
  }, _ref2 => {
    let {
      onDraggableStart,
      onDraggableEnd
    } = _ref2;
    return children({
      draggable: true,
      onDragStart: onDraggableStart,
      onDragEnd: onDraggableEnd
    });
  });
};

export default BlockDraggable;
//# sourceMappingURL=index.js.map