* Added typings for change-emitter@0.1.2

* Adding recompose@0.20.2 typings
This commit is contained in:
iskandersierra
2016-09-30 14:07:58 +02:00
committed by Masahiro Wakame
parent 67205ae090
commit 96e0dfcf7c
2 changed files with 505 additions and 0 deletions

View File

@@ -0,0 +1,171 @@
///<reference path='recompose.d.ts' />
import * as React from "react";
import {
Component,
// Higher-order components
mapProps, withProps, withPropsOnChange, withHandlers,
defaultProps, renameProp, renameProps, flattenProp,
withState, withReducer, branch, renderComponent,
renderNothing, shouldUpdate, pure, onlyUpdateForKeys,
onlyUpdateForPropTypes, withContext, getContext,
lifecycle, toClass,
// Static property helpers
setStatic, setPropTypes, setDisplayName,
// Utilities
compose, getDisplayName, wrapDisplayName, shallowEqual,
isClassComponent, createEagerElement, createEagerFactory,
createSink, componentFromProp, nest, hoistStatics,
// Observable utilities
componentFromStream, mapPropsStream, createEventHandler,
setObservableConfig,
} from "recompose";
import rxjsconfig from "recompose/rxjsObservableConfig";
import rxjs4config from "recompose/rxjs4ObservableConfig";
import mostConfig from "recompose/mostObservableConfig";
import xstreamConfig from "recompose/xstreamObservableConfig";
import baconConfig from "recompose/baconObservableConfig";
import kefirConfig from "recompose/kefirObservableConfig";
function testMapProps() {
interface InnerProps { inn: number }
interface OutterProps { out: string }
const innerComponent = ({inn}: InnerProps) => <div>{inn}</div>;
const enhancer = mapProps((props: OutterProps) => ({ inn: 123 } as InnerProps));
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testWithProps() {
interface InnerProps { inn: number }
interface OutterProps { out: string }
const innerComponent = ({inn}: InnerProps) => <div>{inn}</div>;
const enhancer = withProps((props: OutterProps) => ({ inn: 123 } as InnerProps));
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
const enhancer2 = withProps<InnerProps, OutterProps>({ inn: 123 } as InnerProps);
const enhanced2: React.ComponentClass<OutterProps> = enhancer2(innerComponent);
}
function testWithPropsOnChange() {
interface InnerProps { inn: number }
interface OutterProps { out: string }
const innerComponent = ({inn}: InnerProps) => <div>{inn}</div>;
const enhancer = withPropsOnChange(
(props: OutterProps, nextProps: OutterProps) => true,
(props: OutterProps) => ({ inn: 123 } as InnerProps));
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
const enhancer2 = withPropsOnChange(
[ "out" ],
(props: OutterProps) => ({ inn: 123 } as InnerProps));
const enhanced2: React.ComponentClass<OutterProps> = enhancer2(innerComponent);
}
function testWithHandlers() {
interface InnerProps { onSubmit: Function; onChange: Function; }
interface OutterProps { out: string }
const innerComponent = ({onChange, onSubmit}: InnerProps) =>
<div onClick={onSubmit}></div>;
const enhancer = withHandlers({
onChange: (props: OutterProps) => (e: any) => {},
onSubmit: (props: OutterProps) => (e: any) => {},
});
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testDefaultProps() {
interface Props { a?: string; b?: number; }
const innerComponent = ({a, b}: Props) => <div>{a}, {b}</div>;
const enhancer = defaultProps({ a: "answer", b: 42 });
const enhanced: React.StatelessComponent<Props> = enhancer(innerComponent);
}
function testRenameProp() {
interface InnerProps { c: string; b: number; }
interface OutterProps { a: string; b: number; }
const innerComponent: React.StatelessComponent<InnerProps> = ({c, b}: InnerProps) => <div>{c}, {b}</div>;
const enhancer = renameProp("a", "c");
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testRenameProps() {
interface InnerProps { c: string; d: number; }
interface OutterProps { a: string; b: number; }
const innerComponent: React.StatelessComponent<InnerProps> = ({c, d}: InnerProps) => <div>{c}, {d}</div>;
const enhancer = renameProps({ a:"c", b: "d" });
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testFlattenProp() {
interface InnerProps { a: string; b: string; y: {c: string; d: number;} }
interface OutterProps { x: {a: string; b: number;}; y: {c: string; d: number;} }
const innerComponent: React.StatelessComponent<InnerProps> = (props: InnerProps) => <div></div>;
const enhancer = flattenProp("x");
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testWithState() {
interface InnerProps { count: number; setCount: (count: number) => void }
interface OutterProps { title: string }
const innerComponent: React.StatelessComponent<OutterProps & InnerProps> = (props) =>
<div onClick={() => props.setCount(0)}></div>;
const enhancer = withState<OutterProps>("count", "setCount", 0);
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
const enhancer2 = withState<OutterProps>("count", "setCount",
(p: OutterProps) => p.title.length);
const enhanced2: React.ComponentClass<OutterProps> = enhancer2(innerComponent);
}
function testWithReducer() {
interface State { count: number }
interface Action { type: string }
interface InnerProps { title: string; count: number; dispatch: (a: Action) => void; }
interface OutterProps { title: string; }
const innerComponent: React.StatelessComponent<InnerProps> = (props: InnerProps) =>
<div onClick={() => props.dispatch({type: "INCREMENT"})}></div>;
const enhancer = withReducer("count", "dispatch",
(s: number, a: Action) => s + 1, 0);
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
const enhancer2 = withReducer("count", "dispatch",
(s: number, a: Action) => s + 1,
(props: OutterProps) => props.title.length);
const enhanced2: React.ComponentClass<OutterProps> = enhancer2(innerComponent);
}
function testBranch() {
interface InnerProps { count: number; update: () => void; }
interface OutterProps { toggled: boolean }
const innerComponent: React.StatelessComponent<InnerProps> = (props: InnerProps) =>
<div onClick={() => props.update()}>{props.count}</div>;
const enhancer = branch(
(props: OutterProps) => props.toggled,
withState("count", "update", 0),
withState("count", "update", 100)
);
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}
function testRenderComponent() {
interface InnerProps { count: number; update: () => void; }
interface OutterProps { toggled: boolean }
const innerComponent = () => <div>Hello</div>;
const enhancer = renderComponent(() => <span>Nop!</span>);
const enhanced: React.ComponentClass<OutterProps> = enhancer(innerComponent);
}

334
recompose/recompose.d.ts vendored Normal file
View File

@@ -0,0 +1,334 @@
// Type definitions for Recompose v0.20.2
// Project: https://github.com/acdlite/recompose
// Definitions by: Iskander Sierra <https://github.com/iskandersierra>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
///<reference path='../react/react.d.ts' />
declare module 'recompose' {
import * as React from 'react';
import { ComponentClass, StatelessComponent, ValidationMap } from 'react';
type Component<P> = ComponentClass<P> | StatelessComponent<P>;
type mapper<TInner, TOutter> = (input: TInner) => TOutter;
type predicate<T> = mapper<T, boolean>;
type predicateDiff<T> = (current: T, next: T) => boolean
interface Subscribable<T> {
subscribe: Function;
}
interface ComponentEnhancer<TInner, TOutter> {
(component: Component<TInner>): ComponentClass<TOutter>;
}
interface InferableComponentEnhancer {
<P, TComp extends (Component<P>)>(component: TComp): TComp;
}
// Higher-order components: https://github.com/acdlite/recompose/blob/master/docs/API.md#higher-order-components
// mapProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#mapprops
export function mapProps<TInner, TOutter>(
propsMapper: mapper<TOutter, TInner>
): ComponentEnhancer<TInner, TOutter>;
// withProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#withprops
export function withProps<TInner, TOutter>(
createProps: TInner | mapper<TOutter, TInner>
): ComponentEnhancer<TInner & TOutter, TOutter>;
// withPropsOnChange: https://github.com/acdlite/recompose/blob/master/docs/API.md#withpropsonchange
export function withPropsOnChange<TInner, TOutter>(
shouldMapOrKeys: string[] | predicateDiff<TOutter>,
createProps: mapper<TOutter, TInner>
): ComponentEnhancer<TInner & TOutter, TOutter>;
// withHandlers: https://github.com/acdlite/recompose/blob/master/docs/API.md#withhandlers
type EventHandler = Function;
type HandleCreators<TOutter> = {
[handlerName: string]: mapper<TOutter, EventHandler>;
};
export function withHandlers<TInner, TOutter>(
handlerCreators: HandleCreators<TOutter>
): ComponentEnhancer<TInner, TOutter>;
// defaultProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#defaultprops
export function defaultProps(
props: Object
): InferableComponentEnhancer;
// renameProp: https://github.com/acdlite/recompose/blob/master/docs/API.md#renameProp
export function renameProp(
outterName: string, innerName: string
): ComponentEnhancer<any, any>;
// renameProps: https://github.com/acdlite/recompose/blob/master/docs/API.md#renameProps
type NameMap = {
[outterName: string]: string;
};
export function renameProps(
nameMap: NameMap
): ComponentEnhancer<any, any>;
// flattenProp: https://github.com/acdlite/recompose/blob/master/docs/API.md#flattenProp
export function flattenProp(
propName: string
): ComponentEnhancer<any, any>;
// withState: https://github.com/acdlite/recompose/blob/master/docs/API.md#withState
export function withState<TOutter>(
stateName: string,
stateUpdaterName: string,
initialState: any | mapper<TOutter, any>
): ComponentEnhancer<TOutter /*& { [stateName]: any; [stateUpdaterName]: (s: any) => void }*/, TOutter>;
// withReducer: https://github.com/acdlite/recompose/blob/master/docs/API.md#withReducer
type reducer<TState, TAction> = (s: TState, a: TAction) => TState;
export function withReducer<TState, TAction>(
stateName: string,
dispatchName: string,
reducer: reducer<TState, TAction>,
initialState: TState
): ComponentEnhancer<any, any>;
export function withReducer<TOutter, TState, TAction>(
stateName: string,
dispatchName: string,
reducer: reducer<TState, TAction>,
initialState: (props: TOutter) => TState
): ComponentEnhancer<any, TOutter>;
// branch: https://github.com/acdlite/recompose/blob/master/docs/API.md#branch
export function branch<TOutter>(
test: predicate<TOutter>,
trueEnhancer: InferableComponentEnhancer,
falseEnhancer: InferableComponentEnhancer
): ComponentEnhancer<any, TOutter>;
// renderComponent: https://github.com/acdlite/recompose/blob/master/docs/API.md#renderComponent
export function renderComponent(
component: string | Component<any>
): ComponentEnhancer<any, any>;
// renderNothing: https://github.com/acdlite/recompose/blob/master/docs/API.md#renderNothing
export const renderNothing: InferableComponentEnhancer;
// shouldUpdate: https://github.com/acdlite/recompose/blob/master/docs/API.md#shouldUpdate
export function shouldUpdate<TProps>(
test: predicateDiff<TProps>
): InferableComponentEnhancer;
// pure: https://github.com/acdlite/recompose/blob/master/docs/API.md#pure
export function pure<TProps, TComp extends (Component<TProps>)>
(component: TComp): TComp;
// onlyUpdateForKeys: https://github.com/acdlite/recompose/blob/master/docs/API.md#onlyUpdateForKeys
export function onlyUpdateForKeys(
propKeys: Array<string>
) : InferableComponentEnhancer;
// onlyUpdateForPropTypes: https://github.com/acdlite/recompose/blob/master/docs/API.md#onlyUpdateForPropTypes
export const onlyUpdateForPropTypes: InferableComponentEnhancer;
// withContext: https://github.com/acdlite/recompose/blob/master/docs/API.md#withContext
export function withContext<TContext, TProps>(
childContextTypes: ValidationMap<TContext>,
getChildContext: mapper<TProps, any>
) : InferableComponentEnhancer;
// getContext: https://github.com/acdlite/recompose/blob/master/docs/API.md#getContext
export function getContext<TContext, TProps>(
contextTypes: ValidationMap<TContext>
) : InferableComponentEnhancer;
// lifecycle: https://github.com/acdlite/recompose/blob/master/docs/API.md#lifecycle
interface ReactLifeCycleFunctions {
componentWillMount?: Function;
componentDidMount?: Function;
componentWillReceiveProps?: Function;
shouldComponentUpdate?: Function;
componentWillUpdate?: Function;
componentDidUpdate?: Function;
componentWillUnmount?: Function;
}
export function lifecycle(
spec: ReactLifeCycleFunctions
): InferableComponentEnhancer;
// toClass: https://github.com/acdlite/recompose/blob/master/docs/API.md#toClass
export const toClass: InferableComponentEnhancer;
// Static property helpers: https://github.com/acdlite/recompose/blob/master/docs/API.md#static-property-helpers
// setStatic: https://github.com/acdlite/recompose/blob/master/docs/API.md#setStatic
export function setStatic<TOutter>(
key: string, value: any
): ComponentEnhancer<TOutter, TOutter>;
// setPropTypes: https://github.com/acdlite/recompose/blob/master/docs/API.md#setPropTypes
export function setPropTypes<TOutter>(
propTypes: ValidationMap<TOutter>
): ComponentEnhancer<any, TOutter>;
// setDisplayName: https://github.com/acdlite/recompose/blob/master/docs/API.md#setDisplayName
export function setDisplayName<TOutter>(
displayName: string
): ComponentEnhancer<TOutter, TOutter>;
// Utilities: https://github.com/acdlite/recompose/blob/master/docs/API.md#utilities
// compose: https://github.com/acdlite/recompose/blob/master/docs/API.md#compose
export function compose<TInner, TOutter>(
...functions: Function[]
): ComponentEnhancer<TInner, TOutter>;
// export function compose<TOutter>(
// ...functions: Array<Function>
// ): ComponentEnhancer<any, TOutter>;
// export function compose(
// ...functions: Array<Function>
// ): ComponentEnhancer<any, any>;
// getDisplayName: https://github.com/acdlite/recompose/blob/master/docs/API.md#getDisplayName
export function getDisplayName(
component: Component<any>
): string;
// wrapDisplayName: https://github.com/acdlite/recompose/blob/master/docs/API.md#wrapDisplayName
export function wrapDisplayName(
component: Component<any>,
wrapperName: string
): string;
// shallowEqual: https://github.com/acdlite/recompose/blob/master/docs/API.md#shallowEqual
export function shallowEqual(
a: Object, b: Object
): boolean;
// isClassComponent: https://github.com/acdlite/recompose/blob/master/docs/API.md#isClassComponent
export function isClassComponent(
value: any
): boolean;
// createEagerElement: https://github.com/acdlite/recompose/blob/master/docs/API.md#createEagerElement
export function createEagerElement(
type: Component<any> | string,
props?: Object,
children?: React.ReactNode
): React.ReactElement<any>;
// createEagerFactory: https://github.com/acdlite/recompose/blob/master/docs/API.md#createEagerFactory
type componentFactory = (props?: Object, children?: React.ReactNode) => React.ReactElement<any>;
export function createEagerFactory(
type: Component<any> | string
): componentFactory;
// createSink: https://github.com/acdlite/recompose/blob/master/docs/API.md#createSink
export function createSink(
callback: (props: Object) => void
): React.ComponentClass<any>; // ???
// componentFromProp: https://github.com/acdlite/recompose/blob/master/docs/API.md#componentFromProp
export function componentFromProp(
propName: string
): StatelessComponent<any>;
// nest: https://github.com/acdlite/recompose/blob/master/docs/API.md#nest
export function nest(
...Components: (string | Component<any>)[]
): React.ComponentClass<any>; // ???
// hoistStatics: https://github.com/acdlite/recompose/blob/master/docs/API.md#hoistStatics
export function hoistStatics(
hoc: InferableComponentEnhancer
): InferableComponentEnhancer;
// Observable utilities: https://github.com/acdlite/recompose/blob/master/docs/API.md#observable-utilities
// componentFromStream: https://github.com/acdlite/recompose/blob/master/docs/API.md#componentFromStream
export function componentFromStream<TProps>(
propsToReactNode: mapper<Subscribable<TProps>, Subscribable<React.ReactNode>>
): Component<TProps>; // ???
// mapPropsStream: https://github.com/acdlite/recompose/blob/master/docs/API.md#mapPropsStream
export function mapPropsStream<TInner, TOutter>(
transform: mapper<Subscribable<TOutter>, Subscribable<TInner>>
): ComponentEnhancer<TInner, TOutter>;
// createEventHandler: https://github.com/acdlite/recompose/blob/master/docs/API.md#createEventHandler
type EventHandlerOf<T, TSubs extends Subscribable<T>> = {
handler: (value: T) => void;
stream: TSubs;
};
export function createEventHandler<T, TSubs extends Subscribable<T>>(): EventHandlerOf<T, TSubs>;
// setObservableConfig: https://github.com/acdlite/recompose/blob/master/docs/API.md#setObservableConfig
type ObservableConfig = {
fromESObservable?: <T>(observable: Subscribable<T>) => any;
toESObservable?: <T>(stream: any) => Subscribable<T>;
};
export function setObservableConfig(config: ObservableConfig): void;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#rxjs
declare module 'recompose/rxjsObservableConfig' {
import { ObservableConfig } from 'recompose';
const rxjsconfig: ObservableConfig;
export default rxjsconfig;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#rxjs-4-legacy
declare module 'recompose/rxjs4ObservableConfig' {
import { ObservableConfig } from 'recompose';
const rxjs4config: ObservableConfig;
export default rxjs4config;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#most
declare module 'recompose/mostObservableConfig' {
import { ObservableConfig } from 'recompose';
const mostConfig: ObservableConfig;
export default mostConfig;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#xstream
declare module 'recompose/xstreamObservableConfig' {
import { ObservableConfig } from 'recompose';
const xstreamConfig: ObservableConfig;
export default xstreamConfig;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#bacon
declare module 'recompose/baconObservableConfig' {
import { ObservableConfig } from 'recompose';
const baconConfig: ObservableConfig;
export default baconConfig;
}
// https://github.com/acdlite/recompose/blob/master/docs/API.md#kefir
declare module 'recompose/kefirObservableConfig' {
import { ObservableConfig } from 'recompose';
const kefirConfig: ObservableConfig;
export default kefirConfig;
}