mweststrate

// JSBin: http://jsbin.com/kekoli/edit?js,console
import {observable, observe} from "mobx";

const person = observable({
	firstName: "Maarten",
	lastName: "Luther"
});

const disposer = observe(person, (change) => {
	console.log(`${change.type} '${change.name}' from '${change.oldValue}' to '${change.object[change.name]}'`);

mweststrate

class Person {
  @observable firstName = "Michel";
  @observable lastName = "Weststrate";
  @observable nickName;
  
  @computed get fullName() {
    return this.firstName + " " + this.lastName;
  }
}

mweststrate

transaction(() => {
  michel.firstName = "Mich";
  michel.lastName = "W.";
});

mweststrate

/**
 * Usage:
	typeSwitch(someInstance, defaultvalue)
	   .when(MyClass, i => result)
	   .when(OtherClass, i => otherResult)
	   .get()
	
	In the expressions, the type of the 'i' param should be inferred correctly, see the attribute default value checks
*/
export function typeSwitch<T, R>(instance: T, defaultValue?: R): TypeSwitcher<T, R> {

mweststrate

export class ContactStore {
	@observable contacts = [];
	@observable pendingRequestCount = 0;

	@computed get isLoading() {
		return this.pendingRequestCount > 0;
	}

	@action	createRandomContact() {
		this.pendingRequestCount++;

mweststrate

const theme = observable({
	backgroundColor: "#ffffff"
})

intercept(theme, "backgroundColor", change => {
	if (!change.newValue) {
		// ignore attempts to unset the background color
		return null;   
	}
	if (change.newValue.length === 6) {

mweststrate

class Select extends React.Component {
  constructor(props, context) {
    super(props, context)
    this.state = {
      selection: props.values[0]
    };
  }
  
  render() {
    return (

mweststrate

import {observable} from "mobx"
import {observer} from "mobx-react"

@observer class Select extends React.Component {
  @observable selection = null; /* MobX managed instance state */

  constructor(props, context) {
    super(props, context)
    this.selection = props.values[0]
  }

mweststrate

var document = global.document = createDocument();
export default document;

function createDocument() {
	const NODE_TYPES = {
		ELEMENT_NODE: 1,
		ATTRIBUTE_NODE: 2,
		TEXT_NODE: 3,
		CDATA_SECTION_NODE: 4,
		ENTITY_REFERENCE_NODE: 5,

mweststrate

    @action performLogin(username, password, callback) {
        this.fetch(`/json/${username}-${password}.json`)
            .then(user => {
                this.currentUser = user
                callback(true)
            })
            .catch(err => {
                callback(false)
            })
    }