Typescript Support

[BlackFenix2]

I converted the ReactCardFlip component from javascript to typescript. i also had to modify the jest config to handle .ts and .tsx files.

i also bumped the entire package.json to the latest dependencies.

let me know if you have any questions.

[BlackFenix2]

i also removed the need to provide a 'key' attribute to the children of the ReactCardFlip Component. I refactored the getComponent function to find the front and back element by children's array index rather than an attribute.

const getComponent = (key: 0 | 1) => {
    if (props.children.length !== 2) {
      throw new Error(
        'Component ReactCardFlip requires 2 children to function'
      );
    }
    return props.children[key];
  };

so now you don't need to specify 'key' anymore.

<ReactCardFlip isFlipped={this.state.isFlipped}>
        <div style={this.props.styles.card}>
          <img
            style={this.props.styles.image}
            src="//static.pexels.com/photos/59523/pexels-photo-59523.jpeg"
          />

          <button onClick={this.handleClick}>Flip Card</button>
        </div>

        <div style={this.props.styles.card}>
          <img
            style={this.props.styles.image}
            src="//img.buzzfeed.com/buzzfeed-static/static/2014-04/enhanced/webdr06/4/16/enhanced-11136-1396643149-13.jpg?no-auto"
          />

          <button onClick={this.handleClick}>Flip Card</button>
        </div>
      </ReactCardFlip>

[AaronCCWong]

Thanks for working on this! I will review asap.

[BlackFenix2]

I reverted the changes to package.json to use npm. all of the tests run fine locally. Let me know if you need anything else.

[AaronCCWong]

I reviewed the changes

Can you fix the files that have merge conflicts? Thanks!

[BlackFenix2]

oops, still kinds newb-ish in my Git commands. i fixed all of the merge conflicts.