/// <reference path='../path/to/react.d.ts' />
/// <reference path='../path/to/typed-react.d.ts' />
 
import React = require("react");
import TypedReact = require("typed-react");
 
export interface TimerProps {
    tickInterval: number;
}
 
interface TimerState {
    ticksElapsed: number;
}
 
class Timer extends TypedReact.Component<TimerProps, TimerState> {
    private interval: number;
 
    getInitialState() {
        return {
            ticksElapsed: 0
        };
    }
 
    tick() {
        this.setState({
            ticksElapsed: this.state.ticksElapsed + 1
        });
    }
 
    componentDidMount() {
        this.interval = setInterval(this.tick, this.props.tickInterval);
    }
 
    componentWillUnmount() {
        clearInterval(this.interval);
    }
 
    render() {
        return React.DOM.div(null, "Ticks Elapsed: ", this.state.ticksElapsed);
    }
}
 
export var timer = TypedReact.createClass(Timer);

/// <reference path='../path/to/react.d.ts' />
/// <reference path='../path/to/typed-react.d.ts' />
 
import React = require("react/addons");
import TypedReact = require("typed-react");
 
export interface GreeterProps {
    name: string;
}
 
class GreetingMixin extends TypedReact.Mixin<GreeterProps, {}> {
    greet(greeting: string): React.ReactHTMLElement {
        return React.DOM.h1(null, greeting, this.props.name);
    }
}
 
class Greeter extends TypedReact.Component<GreeterProps, {}> implements GreetingMixin {
    greet: (greeting: string) => React.ReactHTMLElement;
 
    render() {
        return this.greet(this.greeting);
    }
}
 
export var greeter = TypedReact.createClass(Greeter, [
    TypedReact.createMixin(GreetingMixin),
    React.addons.PureRenderMixin
]);