@wordpress/block-editor 8.6.0 → 9.2.0

package/build/components/block-draggable/dropping-insertion-point.native.js

@@ -0,0 +1,157 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = DroppingInsertionPoint;
+
+var _element = require("@wordpress/element");
+
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+
+var _data = require("@wordpress/data");
+
+var _reactNativeBridge = require("@wordpress/react-native-bridge");
+
+var _store = require("../../store");
+
+var _blockListContext = require("../block-list/block-list-context");
+
+var _droppingInsertionPoint = _interopRequireDefault(require("./dropping-insertion-point.scss"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+/**
+ * Dropping zone indicator component.
+ *
+ * This component shows where a block can be dropped when it's being dragged.
+ *
+ * @param {Object}                                        props                  Component props.
+ * @param {Object}                                        props.scroll           Scroll offset object.
+ * @param {Object}                                        props.currentYPosition Current Y coordinate position when dragging.
+ * @param {import('react-native-reanimated').SharedValue} props.isDragging       Whether or not dragging has started.
+ * @param {import('react-native-reanimated').SharedValue} props.targetBlockIndex Current block target index.
+ *
+ * @return {JSX.Element} The component to be rendered.
+ */
+function DroppingInsertionPoint(_ref) {
+  let {
+    scroll,
+    currentYPosition,
+    isDragging,
+    targetBlockIndex
+  } = _ref;
+  const {
+    getBlockOrder,
+    isBlockBeingDragged,
+    isDraggingBlocks,
+    getPreviousBlockClientId,
+    getNextBlockClientId
+  } = (0, _data.useSelect)(_store.store);
+  const {
+    blocksLayouts,
+    findBlockLayoutByClientId
+  } = (0, _blockListContext.useBlockListContext)();
+  const {
+    top,
+    bottom
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const {
+    height
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
+  const safeAreaOffset = top + bottom;
+  const maxHeight = height - (safeAreaOffset + _droppingInsertionPoint.default['dropping-insertion-point'].height);
+  const blockYPosition = (0, _reactNativeReanimated.useSharedValue)(0);
+  const opacity = (0, _reactNativeReanimated.useSharedValue)(0);
+  (0, _reactNativeReanimated.useAnimatedReaction)(() => isDragging.value, value => {
+    if (!value) {
+      opacity.value = 0;
+      blockYPosition.value = 0;
+    }
+  });
+
+  function getSelectedBlockIndicatorPosition(positions) {
+    const currentYPositionWithScroll = currentYPosition.value + scroll.offsetY.value;
+    const midpoint = (positions.top + positions.bottom) / 2;
+    return midpoint < currentYPositionWithScroll ? positions.bottom : positions.top;
+  }
+
+  function setIndicatorPosition(index) {
+    const insertionPointIndex = index;
+    const order = getBlockOrder();
+    const isDraggingAnyBlocks = isDraggingBlocks();
+
+    if (!isDraggingAnyBlocks || insertionPointIndex === null || !order.length) {
+      return;
+    }
+
+    let previousClientId = order[insertionPointIndex - 1];
+    let nextClientId = order[insertionPointIndex];
+
+    while (isBlockBeingDragged(previousClientId)) {
+      previousClientId = getPreviousBlockClientId(previousClientId);
+    }
+
+    while (isBlockBeingDragged(nextClientId)) {
+      nextClientId = getNextBlockClientId(nextClientId);
+    }
+
+    const previousElement = previousClientId ? findBlockLayoutByClientId(blocksLayouts.current, previousClientId) : null;
+    const nextElement = nextClientId ? findBlockLayoutByClientId(blocksLayouts.current, nextClientId) : null;
+    const previousElementPosition = previousElement ? previousElement.y + previousElement.height : 0;
+    const nextElementPosition = nextElement ? nextElement.y : 0;
+    const elementsPositions = {
+      top: Math.floor(previousElement ? previousElementPosition : nextElementPosition),
+      bottom: Math.floor(nextElement ? nextElementPosition : previousElementPosition)
+    };
+    const nextPosition = elementsPositions.top !== elementsPositions.bottom ? getSelectedBlockIndicatorPosition(elementsPositions) : elementsPositions.top;
+
+    if (nextPosition && blockYPosition.value !== nextPosition) {
+      opacity.value = 0;
+      blockYPosition.value = nextPosition;
+      opacity.value = (0, _reactNativeReanimated.withTiming)(1);
+      (0, _reactNativeBridge.generateHapticFeedback)();
+    }
+  }
+
+  (0, _reactNativeReanimated.useAnimatedReaction)(() => targetBlockIndex.value, (value, previous) => {
+    if (value !== previous) {
+      (0, _reactNativeReanimated.runOnJS)(setIndicatorPosition)(value);
+    }
+  });
+  const animatedStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const translationY = blockYPosition.value - scroll.offsetY.value; // Prevents overflowing behind the header/footer
+
+    const shouldHideIndicator = translationY < 0 || translationY > maxHeight;
+    return {
+      opacity: shouldHideIndicator ? 0 : opacity.value,
+      transform: [{
+        translateY: translationY
+      }]
+    };
+  });
+  const insertionPointStyles = [_droppingInsertionPoint.default['dropping-insertion-point'], animatedStyles];
+  return (0, _element.createElement)(_reactNativeReanimated.default.View, {
+    pointerEvents: "none",
+    style: insertionPointStyles
+  });
+}
+//# sourceMappingURL=dropping-insertion-point.native.js.map

package/build/components/block-draggable/dropping-insertion-point.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/block-draggable/dropping-insertion-point.native.js"],"names":["DroppingInsertionPoint","scroll","currentYPosition","isDragging","targetBlockIndex","getBlockOrder","isBlockBeingDragged","isDraggingBlocks","getPreviousBlockClientId","getNextBlockClientId","blockEditorStore","blocksLayouts","findBlockLayoutByClientId","top","bottom","height","safeAreaOffset","maxHeight","styles","blockYPosition","opacity","value","getSelectedBlockIndicatorPosition","positions","currentYPositionWithScroll","offsetY","midpoint","setIndicatorPosition","index","insertionPointIndex","order","isDraggingAnyBlocks","length","previousClientId","nextClientId","previousElement","current","nextElement","previousElementPosition","y","nextElementPosition","elementsPositions","Math","floor","nextPosition","previous","animatedStyles","translationY","shouldHideIndicator","transform","translateY","insertionPointStyles"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport Animated, {\n\tuseSharedValue,\n\tuseAnimatedStyle,\n\twithTiming,\n\tuseAnimatedReaction,\n\trunOnJS,\n} from 'react-native-reanimated';\nimport {\n\tuseSafeAreaInsets,\n\tuseSafeAreaFrame,\n} from 'react-native-safe-area-context';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { generateHapticFeedback } from '@wordpress/react-native-bridge';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { useBlockListContext } from '../block-list/block-list-context';\nimport styles from './dropping-insertion-point.scss';\n\n/**\n * Dropping zone indicator component.\n *\n * This component shows where a block can be dropped when it's being dragged.\n *\n * @param {Object}                                        props                  Component props.\n * @param {Object}                                        props.scroll           Scroll offset object.\n * @param {Object}                                        props.currentYPosition Current Y coordinate position when dragging.\n * @param {import('react-native-reanimated').SharedValue} props.isDragging       Whether or not dragging has started.\n * @param {import('react-native-reanimated').SharedValue} props.targetBlockIndex Current block target index.\n *\n * @return {JSX.Element} The component to be rendered.\n */\nexport default function DroppingInsertionPoint( {\n\tscroll,\n\tcurrentYPosition,\n\tisDragging,\n\ttargetBlockIndex,\n} ) {\n\tconst {\n\t\tgetBlockOrder,\n\t\tisBlockBeingDragged,\n\t\tisDraggingBlocks,\n\t\tgetPreviousBlockClientId,\n\t\tgetNextBlockClientId,\n\t} = useSelect( blockEditorStore );\n\n\tconst { blocksLayouts, findBlockLayoutByClientId } = useBlockListContext();\n\tconst { top, bottom } = useSafeAreaInsets();\n\tconst { height } = useSafeAreaFrame();\n\tconst safeAreaOffset = top + bottom;\n\tconst maxHeight =\n\t\theight -\n\t\t( safeAreaOffset + styles[ 'dropping-insertion-point' ].height );\n\n\tconst blockYPosition = useSharedValue( 0 );\n\tconst opacity = useSharedValue( 0 );\n\n\tuseAnimatedReaction(\n\t\t() => isDragging.value,\n\t\t( value ) => {\n\t\t\tif ( ! value ) {\n\t\t\t\topacity.value = 0;\n\t\t\t\tblockYPosition.value = 0;\n\t\t\t}\n\t\t}\n\t);\n\n\tfunction getSelectedBlockIndicatorPosition( positions ) {\n\t\tconst currentYPositionWithScroll =\n\t\t\tcurrentYPosition.value + scroll.offsetY.value;\n\t\tconst midpoint = ( positions.top + positions.bottom ) / 2;\n\n\t\treturn midpoint < currentYPositionWithScroll\n\t\t\t? positions.bottom\n\t\t\t: positions.top;\n\t}\n\n\tfunction setIndicatorPosition( index ) {\n\t\tconst insertionPointIndex = index;\n\t\tconst order = getBlockOrder();\n\t\tconst isDraggingAnyBlocks = isDraggingBlocks();\n\n\t\tif (\n\t\t\t! isDraggingAnyBlocks ||\n\t\t\tinsertionPointIndex === null ||\n\t\t\t! order.length\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet previousClientId = order[ insertionPointIndex - 1 ];\n\t\tlet nextClientId = order[ insertionPointIndex ];\n\n\t\twhile ( isBlockBeingDragged( previousClientId ) ) {\n\t\t\tpreviousClientId = getPreviousBlockClientId( previousClientId );\n\t\t}\n\n\t\twhile ( isBlockBeingDragged( nextClientId ) ) {\n\t\t\tnextClientId = getNextBlockClientId( nextClientId );\n\t\t}\n\n\t\tconst previousElement = previousClientId\n\t\t\t? findBlockLayoutByClientId(\n\t\t\t\t\tblocksLayouts.current,\n\t\t\t\t\tpreviousClientId\n\t\t\t  )\n\t\t\t: null;\n\t\tconst nextElement = nextClientId\n\t\t\t? findBlockLayoutByClientId( blocksLayouts.current, nextClientId )\n\t\t\t: null;\n\n\t\tconst previousElementPosition = previousElement\n\t\t\t? previousElement.y + previousElement.height\n\t\t\t: 0;\n\t\tconst nextElementPosition = nextElement ? nextElement.y : 0;\n\n\t\tconst elementsPositions = {\n\t\t\ttop: Math.floor(\n\t\t\t\tpreviousElement ? previousElementPosition : nextElementPosition\n\t\t\t),\n\t\t\tbottom: Math.floor(\n\t\t\t\tnextElement ? nextElementPosition : previousElementPosition\n\t\t\t),\n\t\t};\n\n\t\tconst nextPosition =\n\t\t\telementsPositions.top !== elementsPositions.bottom\n\t\t\t\t? getSelectedBlockIndicatorPosition( elementsPositions )\n\t\t\t\t: elementsPositions.top;\n\n\t\tif ( nextPosition && blockYPosition.value !== nextPosition ) {\n\t\t\topacity.value = 0;\n\t\t\tblockYPosition.value = nextPosition;\n\t\t\topacity.value = withTiming( 1 );\n\t\t\tgenerateHapticFeedback();\n\t\t}\n\t}\n\n\tuseAnimatedReaction(\n\t\t() => targetBlockIndex.value,\n\t\t( value, previous ) => {\n\t\t\tif ( value !== previous ) {\n\t\t\t\trunOnJS( setIndicatorPosition )( value );\n\t\t\t}\n\t\t}\n\t);\n\n\tconst animatedStyles = useAnimatedStyle( () => {\n\t\tconst translationY = blockYPosition.value - scroll.offsetY.value;\n\t\t// Prevents overflowing behind the header/footer\n\t\tconst shouldHideIndicator =\n\t\t\ttranslationY < 0 || translationY > maxHeight;\n\n\t\treturn {\n\t\t\topacity: shouldHideIndicator ? 0 : opacity.value,\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: translationY,\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t} );\n\n\tconst insertionPointStyles = [\n\t\tstyles[ 'dropping-insertion-point' ],\n\t\tanimatedStyles,\n\t];\n\n\treturn (\n\t\t<Animated.View pointerEvents=\"none\" style={ insertionPointStyles } />\n\t);\n}\n"]}

package/build/components/block-draggable/index.native.js

@@ -0,0 +1,488 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.BlockDraggableWrapper = void 0;
+
+var _element = require("@wordpress/element");
+
+var _reactNative = require("react-native");
+
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+
+var _components = require("@wordpress/components");
+
+var _data = require("@wordpress/data");
+
+var _blocks = require("@wordpress/blocks");
+
+var _reactNativeBridge = require("@wordpress/react-native-bridge");
+
+var _reactNativeAztec = _interopRequireDefault(require("@wordpress/react-native-aztec"));
+
+var _useScrollWhenDragging = _interopRequireDefault(require("./use-scroll-when-dragging"));
+
+var _draggableChip = _interopRequireDefault(require("./draggable-chip"));
+
+var _store = require("../../store");
+
+var _blockListContext = require("../block-list/block-list-context");
+
+var _droppingInsertionPoint = _interopRequireDefault(require("./dropping-insertion-point"));
+
+var _useBlockDropZone = _interopRequireDefault(require("../use-block-drop-zone"));
+
+var _style = _interopRequireDefault(require("./style.scss"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+const CHIP_OFFSET_TO_TOUCH_POSITION = 32;
+const BLOCK_OPACITY_ANIMATION_CONFIG = {
+  duration: 350
+};
+const BLOCK_OPACITY_ANIMATION_DELAY = 250;
+const DEFAULT_LONG_PRESS_MIN_DURATION = 500;
+const DEFAULT_IOS_LONG_PRESS_MIN_DURATION = DEFAULT_LONG_PRESS_MIN_DURATION - 50;
+/**
+ * Block draggable wrapper component
+ *
+ * This component handles all the interactions for dragging blocks.
+ * It relies on the block list and its context for dragging, hence it
+ * should be rendered between the `BlockListProvider` component and the
+ * block list rendering. It also requires listening to scroll events,
+ * therefore for this purpose, it returns the `onScroll` event handler
+ * that should be attached to the list that renders the blocks.
+ *
+ *
+ * @param {Object}      props          Component props.
+ * @param {JSX.Element} props.children Children to be rendered.
+ * @param {boolean}     props.isRTL    Check if current locale is RTL.
+ *
+ * @return {Function} Render function that passes `onScroll` event handler.
+ */
+
+const BlockDraggableWrapper = _ref => {
+  let {
+    children,
+    isRTL
+  } = _ref;
+  const [draggedBlockIcon, setDraggedBlockIcon] = (0, _element.useState)();
+  const {
+    selectBlock,
+    startDraggingBlocks,
+    stopDraggingBlocks
+  } = (0, _data.useDispatch)(_store.store);
+  const {
+    scrollRef
+  } = (0, _blockListContext.useBlockListContext)();
+  const animatedScrollRef = (0, _reactNativeReanimated.useAnimatedRef)();
+  const {
+    left,
+    right
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const {
+    width
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
+  const safeAreaOffset = left + right;
+  const contentWidth = width - safeAreaOffset;
+  animatedScrollRef(scrollRef);
+  const scroll = {
+    offsetY: (0, _reactNativeReanimated.useSharedValue)(0)
+  };
+  const chip = {
+    x: (0, _reactNativeReanimated.useSharedValue)(0),
+    y: (0, _reactNativeReanimated.useSharedValue)(0),
+    width: (0, _reactNativeReanimated.useSharedValue)(0),
+    height: (0, _reactNativeReanimated.useSharedValue)(0)
+  };
+  const currentYPosition = (0, _reactNativeReanimated.useSharedValue)(0);
+  const isDragging = (0, _reactNativeReanimated.useSharedValue)(false);
+  const [startScrolling, scrollOnDragOver, stopScrolling, draggingScrollHandler] = (0, _useScrollWhenDragging.default)();
+
+  const scrollHandler = event => {
+    'worklet';
+
+    const {
+      contentOffset
+    } = event;
+    scroll.offsetY.value = contentOffset.y;
+    draggingScrollHandler(event);
+  };
+
+  const {
+    onBlockDragOver,
+    onBlockDragEnd,
+    onBlockDrop,
+    targetBlockIndex
+  } = (0, _useBlockDropZone.default)(); // Stop dragging blocks if the block draggable is unmounted.
+
+  (0, _element.useEffect)(() => {
+    return () => {
+      if (isDragging.value) {
+        stopDraggingBlocks();
+      }
+    };
+  }, []);
+
+  const setDraggedBlockIconByClientId = clientId => {
+    var _getBlockType;
+
+    const blockName = (0, _data.select)(_store.store).getBlockName(clientId);
+    const blockIcon = (_getBlockType = (0, _blocks.getBlockType)(blockName)) === null || _getBlockType === void 0 ? void 0 : _getBlockType.icon;
+
+    if (blockIcon) {
+      setDraggedBlockIcon(blockIcon);
+    }
+  };
+
+  const onStartDragging = _ref2 => {
+    let {
+      clientId,
+      position
+    } = _ref2;
+
+    if (clientId) {
+      startDraggingBlocks([clientId]);
+      setDraggedBlockIconByClientId(clientId);
+      (0, _reactNativeReanimated.runOnUI)(startScrolling)(position.y);
+      (0, _reactNativeBridge.generateHapticFeedback)();
+    } else {
+      // We stop dragging if no block is found.
+      (0, _reactNativeReanimated.runOnUI)(stopDragging)();
+    }
+  };
+
+  const onStopDragging = _ref3 => {
+    let {
+      clientId
+    } = _ref3;
+
+    if (clientId) {
+      onBlockDrop({
+        // Dropping is only allowed at root level
+        srcRootClientId: '',
+        srcClientIds: [clientId],
+        type: 'block'
+      });
+      selectBlock(clientId);
+      setDraggedBlockIcon(undefined);
+    }
+
+    onBlockDragEnd();
+    stopDraggingBlocks();
+  };
+
+  const onChipLayout = _ref4 => {
+    let {
+      nativeEvent: {
+        layout
+      }
+    } = _ref4;
+
+    if (layout.width > 0) {
+      chip.width.value = layout.width;
+    }
+
+    if (layout.height > 0) {
+      chip.height.value = layout.height;
+    }
+  };
+
+  const startDragging = _ref5 => {
+    'worklet';
+
+    let {
+      x,
+      y,
+      id
+    } = _ref5;
+    const dragPosition = {
+      x,
+      y
+    };
+    chip.x.value = dragPosition.x;
+    chip.y.value = dragPosition.y;
+    currentYPosition.value = dragPosition.y;
+    isDragging.value = true;
+    (0, _reactNativeReanimated.runOnJS)(onStartDragging)({
+      clientId: id,
+      position: dragPosition
+    });
+  };
+
+  const updateDragging = _ref6 => {
+    'worklet';
+
+    let {
+      x,
+      y
+    } = _ref6;
+    const dragPosition = {
+      x,
+      y
+    };
+    chip.x.value = dragPosition.x;
+    chip.y.value = dragPosition.y;
+    currentYPosition.value = dragPosition.y;
+    (0, _reactNativeReanimated.runOnJS)(onBlockDragOver)({
+      x,
+      y: y + scroll.offsetY.value
+    }); // Update scrolling velocity
+
+    scrollOnDragOver(dragPosition.y);
+  };
+
+  const stopDragging = _ref7 => {
+    'worklet';
+
+    let {
+      id
+    } = _ref7;
+    isDragging.value = false;
+    stopScrolling();
+    (0, _reactNativeReanimated.runOnJS)(onStopDragging)({
+      clientId: id
+    });
+  };
+
+  const chipDynamicStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    const chipOffset = chip.width.value / 2;
+    const translateX = !isRTL ? chip.x.value - chipOffset : -(contentWidth - (chip.x.value + chipOffset));
+    return {
+      transform: [{
+        translateX
+      }, {
+        translateY: chip.y.value - chip.height.value - CHIP_OFFSET_TO_TOUCH_POSITION
+      }]
+    };
+  });
+  const chipStyles = [chipDynamicStyles, _style.default['draggable-chip__wrapper']];
+
+  const exitingAnimation = _ref8 => {
+    'worklet';
+
+    let {
+      currentHeight,
+      currentWidth
+    } = _ref8;
+    const translateX = !isRTL ? 0 : currentWidth * -1;
+    const duration = 150;
+    const animations = {
+      transform: [{
+        translateY: (0, _reactNativeReanimated.withTiming)(currentHeight, {
+          duration
+        })
+      }, {
+        translateX: (0, _reactNativeReanimated.withTiming)(translateX, {
+          duration
+        })
+      }, {
+        scale: (0, _reactNativeReanimated.withTiming)(0, {
+          duration
+        })
+      }]
+    };
+    const initialValues = {
+      transform: [{
+        translateY: 0
+      }, {
+        translateX
+      }, {
+        scale: 1
+      }]
+    };
+    return {
+      initialValues,
+      animations
+    };
+  };
+
+  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_droppingInsertionPoint.default, {
+    scroll: scroll,
+    currentYPosition: currentYPosition,
+    isDragging: isDragging,
+    targetBlockIndex: targetBlockIndex
+  }), (0, _element.createElement)(_components.Draggable, {
+    onDragStart: startDragging,
+    onDragOver: updateDragging,
+    onDragEnd: stopDragging,
+    testID: "block-draggable-wrapper"
+  }, children({
+    onScroll: scrollHandler
+  })), (0, _element.createElement)(_reactNativeReanimated.default.View, {
+    onLayout: onChipLayout,
+    style: chipStyles,
+    pointerEvents: "none"
+  }, draggedBlockIcon && (0, _element.createElement)(_reactNativeReanimated.default.View, {
+    entering: _reactNativeReanimated.ZoomInEasyDown.duration(200),
+    exiting: exitingAnimation
+  }, (0, _element.createElement)(_draggableChip.default, {
+    icon: draggedBlockIcon
+  }))));
+};
+/**
+ * Block draggable component
+ *
+ * This component serves for animating the block when it is being dragged.
+ * Hence, it should be wrapped around the rendering of a block.
+ *
+ * @param {Object}      props                    Component props.
+ * @param {JSX.Element} props.children           Children to be rendered.
+ * @param {string}      props.clientId           Client id of the block.
+ * @param {string}      [props.draggingClientId] Client id to use for dragging. If not defined, the value from `clientId` will be used.
+ * @param {boolean}     [props.enabled]          Enables the draggable trigger.
+ * @param {string}      [props.testID]           Id used for querying the long-press gesture handler in tests.
+ *
+ * @return {Function} Render function which includes the parameter `isDraggable` to determine if the block can be dragged.
+ */
+
+
+exports.BlockDraggableWrapper = BlockDraggableWrapper;
+
+const BlockDraggable = _ref9 => {
+  let {
+    clientId,
+    children,
+    draggingClientId,
+    enabled = true,
+    testID
+  } = _ref9;
+  const wasBeingDragged = (0, _element.useRef)(false);
+  const [isEditingText, setIsEditingText] = (0, _element.useState)(false);
+  const [isScreenReaderEnabled, setIsScreenReaderEnabled] = (0, _element.useState)(false);
+  const draggingAnimation = {
+    opacity: (0, _reactNativeReanimated.useSharedValue)(1)
+  };
+
+  const startDraggingBlock = () => {
+    draggingAnimation.opacity.value = (0, _reactNativeReanimated.withTiming)(0.4, BLOCK_OPACITY_ANIMATION_CONFIG);
+  };
+
+  const stopDraggingBlock = () => {
+    draggingAnimation.opacity.value = (0, _reactNativeReanimated.withDelay)(BLOCK_OPACITY_ANIMATION_DELAY, (0, _reactNativeReanimated.withTiming)(1, BLOCK_OPACITY_ANIMATION_CONFIG));
+  };
+
+  const {
+    isDraggable,
+    isBeingDragged,
+    isBlockSelected
+  } = (0, _data.useSelect)(_select => {
+    const {
+      getBlockRootClientId,
+      getTemplateLock,
+      isBlockBeingDragged,
+      getSelectedBlockClientId
+    } = _select(_store.store);
+
+    const rootClientId = getBlockRootClientId(clientId);
+    const templateLock = rootClientId ? getTemplateLock(rootClientId) : null;
+    const selectedBlockClientId = getSelectedBlockClientId();
+    return {
+      isBeingDragged: isBlockBeingDragged(clientId),
+      isDraggable: 'all' !== templateLock,
+      isBlockSelected: selectedBlockClientId && selectedBlockClientId === clientId
+    };
+  }, [clientId]);
+  (0, _element.useEffect)(() => {
+    if (isBeingDragged !== wasBeingDragged.current) {
+      if (isBeingDragged) {
+        startDraggingBlock();
+      } else {
+        stopDraggingBlock();
+      }
+    }
+
+    wasBeingDragged.current = isBeingDragged;
+  }, [isBeingDragged]);
+  const onFocusChangeAztec = (0, _element.useCallback)(_ref10 => {
+    let {
+      isFocused
+    } = _ref10;
+    setIsEditingText(isFocused);
+  }, []);
+  (0, _element.useEffect)(() => {
+    let mounted = true;
+
+    const isAnyAztecInputFocused = _reactNativeAztec.default.InputState.isFocused();
+
+    if (isAnyAztecInputFocused) {
+      setIsEditingText(isAnyAztecInputFocused);
+    }
+
+    _reactNativeAztec.default.InputState.addFocusChangeListener(onFocusChangeAztec);
+
+    const screenReaderChangedListener = _reactNative.AccessibilityInfo.addEventListener('screenReaderChanged', setIsScreenReaderEnabled);
+
+    _reactNative.AccessibilityInfo.isScreenReaderEnabled().then(screenReaderEnabled => {
+      if (mounted) {
+        setIsScreenReaderEnabled(screenReaderEnabled);
+      }
+    });
+
+    return () => {
+      mounted = false;
+
+      _reactNativeAztec.default.InputState.removeFocusChangeListener(onFocusChangeAztec);
+
+      screenReaderChangedListener.remove();
+    };
+  }, []);
+  const onLongPressDraggable = (0, _element.useCallback)(() => {
+    // Ensure that no text input is focused when starting the dragging gesture in order to prevent conflicts with text editing.
+    _reactNativeAztec.default.InputState.blurCurrentFocusedElement();
+  }, []);
+  const animatedWrapperStyles = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
+    return {
+      opacity: draggingAnimation.opacity.value
+    };
+  });
+  const wrapperStyles = [animatedWrapperStyles, _style.default['draggable-wrapper__container']];
+  const canDragBlock = enabled && !isScreenReaderEnabled && (!isBlockSelected || !isEditingText);
+
+  if (!isDraggable) {
+    return children({
+      isDraggable: false
+    });
+  }
+
+  return (0, _element.createElement)(_components.DraggableTrigger, {
+    id: draggingClientId || clientId,
+    enabled: enabled && canDragBlock,
+    minDuration: _element.Platform.select({
+      // On iOS, using a lower min duration than the default
+      // value prevents the long-press gesture from being
+      // triggered in underneath elements. This is required to
+      // prevent enabling text editing when dragging is available.
+      ios: canDragBlock ? DEFAULT_IOS_LONG_PRESS_MIN_DURATION : DEFAULT_LONG_PRESS_MIN_DURATION,
+      android: DEFAULT_LONG_PRESS_MIN_DURATION
+    }),
+    onLongPress: onLongPressDraggable,
+    testID: testID
+  }, (0, _element.createElement)(_reactNativeReanimated.default.View, {
+    style: wrapperStyles
+  }, children({
+    isDraggable: true
+  })));
+};
+
+var _default = BlockDraggable;
+exports.default = _default;
+//# sourceMappingURL=index.native.js.map