sourceOffset wanky

[didair]

Hi

I've been having problems with the monitor.getClientOffset() over in the custom dragPreview function. It seems to be returning values that isn't at all where it should be. Anyone else experiencing this issue? Using the react-dnd-touch-backend package. If anyone has any idea of how to solve this that would be amazing.

This is my item component (render method)

<div onMouseDown={this.onMouseDown} key={randomKey} style={{ 'opacity': opacity }} className="list-item">
<DragPreview {...this.props}>{ firstname } { lastname }</DragPreview>
	{ firstname } { lastname }
</div>

And the dragPreview.js component is really basic, i think the whole thing is from the react-dnd tutorials. Attaching it below

import React, { Component, PropTypes } from 'react';
import DragLayer from 'react-dnd/lib/DragLayer';

function collect (monitor) {
    return {
        sourceOffset: monitor.getClientOffset(),
		initialOffset: monitor.getInitialClientOffset()
    };
}

class DragPreview extends Component {
    getLayerStyles() {
        const { sourceOffset, initialOffset } = this.props;
		
        return {
            transform: sourceOffset ? `translate( ${sourceOffset.x}px, ${sourceOffset.y}px )` : ''
        };
    }

    render () {
        const { isDragging, children } = this.props;
        if (!isDragging) { return null; };

        return (
            <div className="source-preview" style={this.getLayerStyles()}>
                { children }
            </div>
        );
    }
}

DragPreview.propTypes = {
    isDragging: PropTypes.bool,
    sourceOffset: PropTypes.shape({
        x: PropTypes.number.isRequired,
        y: PropTypes.number.isRequired
    })
};

export default DragLayer(collect)(DragPreview);

[didair]

Seems related to #793

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.