react-scalable-draggable v0.0.4

react-scalable-draggable

react-scalable-draggable

install

npm i --save react-scalable-draggable

usage

import * as React from 'react';
import ReactScalableDraggable from 'react-scalable-draggable';

interface AppState {
  parentScale: number;
}

class App extends React.Component<{}, AppState> {
  constructor(props: {}) {
    super(props);

    this.refParent = React.createRef();
    this.state = {
      parentScale: 1.5
    };
  }

  refParent: React.RefObject<HTMLDivElement>;

  render() {
    const { parentScale } = this.state;

    return (
      <div
        ref={this.refParent}
        style={{ transform: `scale(${parentScale})` }}
      >
        <ReactScalableDraggable
          parentRef={this.refParent}
          parentScale={parentScale}
        >
          target
        </ReactScalableDraggable>
      </div>
    );
  }
}

export default App;

example

react-scalable-draggable

props

interface ReactScalableDraggableProps {
  children: React.ReactNode;
  className?: string;
  parentRef?: React.RefObject<HTMLElement>;
  parentScale?: number;
}