react-annotator/dist/js/Annotation.js

A React mixin to allow for user annotations directly on images.

'use strict';

var React = require('react/addons');

var Annotation = React.createClass({displayName: "Annotation",

  propTypes: {
    xPos: React.PropTypes.oneOfType([
      React.PropTypes.number,
      React.PropTypes.string
    ]).isRequired,
    yPos: React.PropTypes.oneOfType([
      React.PropTypes.number,
      React.PropTypes.string
    ]).isRequired,
    position: React.PropTypes.string.isRequired,
    annotation: React.PropTypes.object.isRequired
  },

  getDefaultProps: function() {
    return {
      xPos: -1000,
      yPos: -1000,
      position: 'bottom',
      annotation: {}
    };
  },

  render: function() {
    var classes = 'annotator-tooltip ' + this.props.position;
    var styles = {
      'position': 'absolute',
      'top': this.props.yPos,
      'left': this.props.xPos
    };

    void 0;

    return (
      React.createElement("div", {className: classes, style: styles}, 
        React.createElement("p", null, this.props.annotation.text || '')
      )
    );
  }

});

module.exports = Annotation;