@wordpress/block-editor
Version:
93 lines (90 loc) • 2.9 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _components = require("@wordpress/components");
var _blocks = require("@wordpress/blocks");
var _data = require("@wordpress/data");
var _element = require("@wordpress/element");
var _draggableChip = _interopRequireDefault(require("../block-draggable/draggable-chip"));
var _utils = require("../inserter/block-patterns-tab/utils");
var _store = require("../../store");
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const InserterDraggableBlocks = ({
isEnabled,
blocks,
icon,
children,
pattern
}) => {
const blockTypeIcon = (0, _data.useSelect)(select => {
const {
getBlockType
} = select(_blocks.store);
return blocks.length === 1 && getBlockType(blocks[0].name)?.icon;
}, [blocks]);
const {
startDragging,
stopDragging
} = (0, _lockUnlock.unlock)((0, _data.useDispatch)(_store.store));
const patternBlock = (0, _element.useMemo)(() => {
return pattern?.type === _utils.INSERTER_PATTERN_TYPES.user && pattern?.syncStatus !== 'unsynced' ? [(0, _blocks.createBlock)('core/block', {
ref: pattern.id
})] : undefined;
}, [pattern?.type, pattern?.syncStatus, pattern?.id]);
if (!isEnabled) {
return children({
draggable: false,
onDragStart: undefined,
onDragEnd: undefined
});
}
const draggableBlocks = patternBlock !== null && patternBlock !== void 0 ? patternBlock : blocks;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Draggable, {
__experimentalTransferDataType: "wp-blocks",
transferData: {
type: 'inserter',
blocks: draggableBlocks
},
onDragStart: event => {
startDragging();
for (const block of draggableBlocks) {
const type = `wp-block:${block.name}`;
// This will fill in the dataTransfer.types array so that
// the drop zone can check if the draggable is eligible.
// Unfortuantely, on drag start, we don't have access to the
// actual data, only the data keys/types.
event.dataTransfer.items.add('', type);
}
},
onDragEnd: () => {
stopDragging();
},
__experimentalDragComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_draggableChip.default, {
count: blocks.length,
icon: icon || !pattern && blockTypeIcon,
isPattern: !!pattern
}),
children: ({
onDraggableStart,
onDraggableEnd
}) => {
return children({
draggable: true,
onDragStart: onDraggableStart,
onDragEnd: onDraggableEnd
});
}
});
};
var _default = exports.default = InserterDraggableBlocks;
//# sourceMappingURL=index.js.map