canjs_with_react.js

define(function(require) {
	var compute = require("can/observe/compute/compute");

	/**
	 * Simple mixin that allows using CanJS Maps, Models and computes in React components.
	 *
	 * The render method becomes a compute. Any change calls forceUpdate.
	 * React will take the new virtual DOM and efficiently update the real DOM
	 * only if needed.
	 *
	 * Since no strings are being concatented and no DOM is being created,
	 * this is stupidly fast.
	 *
	 * Usage:
		React.createClass({
			mixins: [ComputeMixin],
			render: function() {
				// normal render, using computes
			}
		});
	 * 
	 */
	return {
		componentWillMount: function() {
			this.render = compute(this.render, this);
			this.render.bind("change.force-react-update", (function() {
				this.forceUpdate();
			}).bind(this));
		},
		componentWillUnmount: function() {
			this.render.unbind("change.force-react-update");
		}
	};	
});