iamjoshellis / react-position-transformer

Performantly transform one element's position to an others! 📐

React Position Transformer 📐

Performantly transform one element's position to an others! 🚀

Demo

Usage:

import * as React from 'react';
import Transformer from 'react-position-transformer';

class MyComponent extends React.Component {
  destRef = React.createRef();

  render() {
    return (
      <React.Fragment>
        <div ref={this.destRef}>
          dest
        </div>
        <Transformer
          transition={300}
          transformed={this.props.transformed}
          destRef={this.destRef.current}
        >
          <div>src</div>
        </Transformer>
      </React.Fragment>
    );
  }
}

src will be "moved" (via css transforms) to dest when transformed === true.