Merge pull request #5943 from mweststrate/master

added typings for mobservable and mobservable-react packages

mobservable-react/mobservable-react-tests.ts

@@ -0,0 +1,61 @@
+/// <reference path="./mobservable-react.d.ts"/>
+/// <reference path="../react/react-global.d.ts" />
+
+import {reactiveComponent} from 'mobservable-react';
+
+{
+    let c1 = reactiveComponent(React.createClass({
+        getDefaultProps() {
+            return {
+                test: "hi"
+            };
+        },
+
+        render: function() {
+            return React.createElement("div");
+        }
+    }));
+
+    let c1Factory = React.createFactory(c1);
+    React.render(c1Factory({
+        test: "hello"
+    }), null);
+}
+
+@reactiveComponent
+class TestComponent extends React.Component<{ test: string },{}> {
+    render() {
+        return React.createElement("div");
+    }
+}
+
+{
+    let c2Factory = React.createFactory(TestComponent);
+    React.render(c2Factory({
+        test: "hello" 
+    }) , null);
+}
+
+{
+    var c3 = reactiveComponent((props: { test: string }) => React.createElement("div"));
+    var c3Factory = React.createFactory(c3); //without JSX
+    React.render(c3Factory({
+        test: "hello"
+    }), null);
+}
+
+
+class TestComponent2 extends React.Component<{ test: string },{}> {
+    render() {
+        return React.createElement("div");
+    }
+}
+{
+    // Does not work properly in typescript 1.6.2 without cast :'(
+    // Argument of type 'typeof TestComponent2 | void' is not assignable to parameter of type 'ComponentClass<{ test: string; }>'.
+    // Type 'void' is not assignable to type 'ComponentClass<{ test: string; }>'.
+    let c4Factory = React.createFactory(<React.ClassicComponentClass<{test:string}>><any> reactiveComponent(TestComponent2));
+    React.render(c4Factory({
+        test: "hello" 
+    }) , null);
+}

mobservable-react/mobservable-react-tests.ts.tscparams

@@ -0,0 +1 @@
+--noImplicitAny --module commonjs --target es5 --experimentalDecorators

mobservable-react/mobservable-react.d.ts

@@ -0,0 +1,16 @@
+// Type definitions for mobservable v0.1.8
+// Project: https://github.com/mweststrate/mobservable-react
+// Definitions by: Michel Weststrate <https://github.com/mweststrate/>
+// Definitions: https://github.com/borisyankov/DefinitelyTyped
+
+/// <reference path="../react/react-global.d.ts" />
+
+declare module "mobservable-react" {
+    /**
+     * Turns a React component or stateless render function into a reactive component.
+     */
+    export function reactiveComponent<P>(clazz: React.ClassicComponentClass<P>): React.ClassicComponentClass<P>;
+    export function reactiveComponent<P>(clazz: React.ComponentClass<P>): React.ComponentClass<P>;
+    export function reactiveComponent<TFunction extends React.ComponentClass<any>>(target: TFunction): TFunction | void; // decorator signature
+    export function reactiveComponent<P>(renderFunction: (props: P) => React.ReactElement<any>): React.ClassicComponentClass<P>;
+}

mobservable/mobservable-tests.ts

@@ -0,0 +1,57 @@
+/// <reference path="./mobservable.d.ts"/>
+import mobservable = require('mobservable');
+import {observable} from "mobservable";
+
+var v = mobservable(3);
+v.observe(() => {});
+
+var a = mobservable([1,2,3]);
+
+class Order {
+    @observable price:number = 3;
+    @observable amount:number = 2;
+    @observable orders:string[] = [];
+
+    @observable get total() {
+        return this.amount * this.price * (1 + this.orders.length);
+    }
+}
+
+export function testObservable() {
+    var a = mobservable(3);
+    var b = mobservable(() => a() * 2);
+}
+
+export function testAnnotations() {
+    var order1totals:number[] = [];
+    var order1 = new Order();
+    var order2 = new Order();
+
+    var disposer = mobservable.observe(() => {
+        order1totals.push(order1.total)
+    });
+
+    order2.price = 4;
+    order1.amount = 1;
+
+    order2.orders.push('bla');
+
+    order1.orders.splice(0,0,'boe', 'hoi');
+
+    disposer();
+    order1.orders.pop();
+};
+
+export function testTyping() {
+    var ar:Mobservable.IObservableArray<number> = mobservable.makeReactive([1,2]);
+    ar.observe((d:Mobservable.IArrayChange<number>|Mobservable.IArraySplice<number>) => {
+        console.log(d.type);
+    });
+
+    var ar2:Mobservable.IObservableArray<number> = mobservable([1,2]);
+    ar2.observe((d:Mobservable.IArrayChange<number>|Mobservable.IArraySplice<number>) => {
+        console.log(d.type);
+    });
+
+    var x:Mobservable.IObservableValue<number> = mobservable(3);
+}

mobservable/mobservable-tests.ts.tscparams

@@ -0,0 +1 @@
+--noImplicitAny --module commonjs --target es5 --experimentalDecorators

mobservable/mobservable.d.ts

@@ -0,0 +1,189 @@
+// Type definitions for mobservable v0.6.10
+// Project: https://mweststrate.github.io/mobservable
+// Definitions by: Michel Weststrate <https://github.com/mweststrate/>
+// Definitions: https://github.com/borisyankov/DefinitelyTyped
+
+
+interface _IMobservableStatic {
+    /**
+     * Turns an object, array or function into a reactive structure.
+     * @param value the value which should become observable.
+     */
+    makeReactive: IMakeReactive;
+
+    /**
+     * Extends an object with reactive capabilities.
+     * @param target the object to which reactive properties should be added
+     * @param properties the properties that should be added and made reactive
+     * @returns targer
+     */
+    extendReactive(target: Object, properties: Object):Object;
+
+    /**
+     * Returns true if the provided value is reactive.
+     * @param value object, function or array
+     * @param propertyName if propertyName is specified, checkes whether value.propertyName is reactive.
+     */
+    isReactive(value: any, propertyName?:string): boolean;
+
+    /**
+     * Can be used in combination with makeReactive / extendReactive.
+     * Enforces that a reference to 'value' is stored as property,
+     * but that 'value' itself is not turned into something reactive.
+     * Future assignments to the same property will inherit this behavior.
+     * @param value initial value of the reactive property that is being defined.
+     */
+    asReference<T>(value: any):{value:T};
+
+    /**
+     * ES6 / Typescript decorator which can to make class properties and getter functions reactive.
+     */
+    observable(target: Object, key: string):any; // decorator / annotation
+
+    /**
+     * Creates a reactive view and keeps it alive, so that the view is always
+     * updated if one of the dependencies changes, even when the view is not further used by something else.
+     * @param func The reactive view
+     * @param scope (optional)
+     * @returns disposer function, which can be used to stop the view from being updated in the future.
+     */
+    observe(func: Mobservable.Lambda, scope?: any): Mobservable.Lambda;
+    
+    /**
+     * Deprecated, use mobservable.observe instead.
+     */
+    sideEffect(func: Mobservable.Lambda, scope?: any): Mobservable.Lambda;
+
+    /**
+     * Similar to 'observer', observes the given predicate until it returns true.
+     * Once it returns true, the 'effect' function is invoked an the observation is cancelled.
+     * @param predicate
+     * @param effect
+     * @param scope (optional)
+     * @returns disposer function to prematurely end the observer.
+     */
+    observeUntil(predicate: ()=>boolean, effect: Mobservable.Lambda, scope?: any): Mobservable.Lambda;
+
+    /**
+     * During a transaction no views are updated until the end of the transaction.
+     * The transaction will be run synchronously nonetheless.
+     * @param action a function that updates some reactive state
+     * @returns any value that was returned by the 'action' parameter.
+     */
+    transaction<T>(action: ()=>T): T;
+
+    /**
+     * Converts a reactive structure into a non-reactive structure.
+     * Basically a deep-clone.
+     */
+    toJSON<T>(value: T): T;
+
+    /**
+     * Sets the reporting level Defaults to 1. Use 0 for production or 2 for increased verbosity.
+     */
+    logLevel:  number;  // 0 = production, 1 = development, 2 = debugging
+
+    extras: {
+        getDependencyTree(thing:any, property?:string): Mobservable.IDependencyTree;
+
+        getObserverTree(thing:any, property?:string): Mobservable.IObserverTree;
+
+        trackTransitions(extensive?:boolean, onReport?:(lines:Mobservable.ITransitionEvent) => void) : Mobservable.Lambda;
+    }
+}
+
+interface IMakeReactive {
+    <T>(value: T[], opts?: Mobservable.IMakeReactiveOptions): Mobservable.IObservableArray<T>;
+    <T>(value: ()=>T, opts?: Mobservable.IMakeReactiveOptions): Mobservable.IObservableValue<T>;
+    <T extends string|number|boolean|Date|RegExp|Function|void>(value: T, opts?: Mobservable.IMakeReactiveOptions): Mobservable.IObservableValue<T>;
+    <T extends Object>(value: Object, opts?: Mobservable.IMakeReactiveOptions): T;
+}
+
+interface IMobservableStatic extends _IMobservableStatic, IMakeReactive {
+}
+
+declare module Mobservable {
+    interface IMakeReactiveOptions {
+        as?:  string /* "auto" | "reference" | TODO:  see #8 "structure" */
+        scope?:  Object,
+        context?: Object,
+        recurse?:  boolean;
+        name?: string;
+        // protected:  boolean TODO:  see #9
+    }
+
+    export interface IContextInfoStruct {
+        object: Object;
+        name: string;
+    }
+
+    export type IContextInfo = IContextInfoStruct | string;
+
+    interface Lambda {
+        (): void;
+        name?: string;
+    }
+
+    interface IObservable {
+        observe(callback: (...args: any[])=>void, fireImmediately?: boolean): Lambda;
+    }
+
+    interface IObservableValue<T> extends IObservable {
+        (): T;
+        (value: T):void;
+        observe(callback: (newValue: T, oldValue: T)=>void, fireImmediately?: boolean): Lambda;
+    }
+
+    interface IObservableArray<T> extends IObservable, Array<T> {
+        spliceWithArray(index: number, deleteCount?: number, newItems?: T[]): T[];
+        observe(listener: (changeData: IArrayChange<T>|IArraySplice<T>)=>void, fireImmediately?: boolean): Lambda;
+        clear(): T[];
+        replace(newItems: T[]): T[];
+        find(predicate: (item: T,index: number,array: IObservableArray<T>)=>boolean,thisArg?: any,fromIndex?: number): T;
+        remove(value: T): boolean;
+    }
+
+    interface IArrayChange<T> {
+        type:  string; // Always:  'update'
+        object:  IObservableArray<T>;
+        index:  number;
+        oldValue:  T;
+    }
+
+    interface IArraySplice<T> {
+        type:  string; // Always:  'splice'
+        object:  IObservableArray<T>;
+        index:  number;
+        removed:  T[];
+        addedCount:  number;
+    }
+
+    interface IDependencyTree {
+        id: number;
+        name: string;
+        context: any;
+        dependencies?: IDependencyTree[];
+    }
+
+    interface IObserverTree {
+        id: number;
+        name: string;
+        context: any;
+        observers?: IObserverTree[];
+        listeners?: number; // amount of functions manually attached using an .observe method
+    }
+
+    interface ITransitionEvent {
+        id: number;
+        name: string;
+        context: Object;
+        state: string;
+        changed: boolean;
+        newValue: string;
+    }
+}
+
+declare module "mobservable" {
+	var m : IMobservableStatic;
+	export = m;
+}