renderDebugTargetPlaceholder() {
    if (!this.isDebug) return;
    const { targetLayout } = this.state;
    if (!targetLayout) return;
    const { target } = this.props;
    const style = StyleSheet.flatten([target.props.style]);
    return (
      <Animated.View
        key={`${target.id}.debugTo`}
        style={{
          position: "absolute",
          width: targetLayout.width,
          height: targetLayout.height,
          left: targetLayout.x,
          top: targetLayout.y,
          backgroundColor: "rgba(0, 255, 0, 0.1)",
          borderColor: "green",
          borderWidth: 1,
          borderStyle: "dashed",
          borderTopRightRadius: resolveValue(
            style.borderTopRightRadius,
            style.borderRadius
          ),
          borderTopLeftRadius: resolveValue(
            style.borderTopLeftRadius,
            style.borderRadius
          ),
          borderBottomLeftRadius: resolveValue(
            style.borderBottomLeftRadius,
            style.borderRadius
          ),
          borderBottomRightRadius: resolveValue(
            style.borderBottomRightRadius,
            style.borderRadius
          ),
          opacity: 0.8,
          justifyContent: "center"
        }}
      >
        <Text style={{ color: "green", textAlign: "center" }}>To</Text>
      </Animated.View>
    );
  }
Renders a visual placeholder of the target
component, so it's possible to see what the
start position/shape/size is of the target.