Typescript: Support for Parameterized Components
Previously, the Typescript definition file did not support parameterized
components. The `component()` function did accept additional arguments, but the
`MithrilComponent<T>` interface did not allow components to have any additional
arguments in either their `controller()` or `view()` methods.
Properly supporting flexible variadic parameters in typescript is somewhat
challenging. Tuple types are close, but would only work if the signature of
`controller` and `view` accepted arrays of arguments:
```
interface MithrilStatic {
component<TController extend controller, TRest extends any[]>(
component: ParameterizedMithrilComponent<TController, TRest>,
...args:TRest
) : TController
}
interface ParameterizedMithrilComponent<TController extend controller, TRest
extends any[]> {
// Doesn't match mithril's component interface; we want to unpack the contents
// of TRest
controller: (args: TRest) => TController,
view: (ctrl: TController, args: TRest)
}
```
Therefore, I have gone with a more traditional method of defining several
overloads of m.component(), each with a different number of extra parameters.
Because of this, the first four parameters to m.component() will be correctly
type checked (i.e. if the Component's controller defines the parameter, it must
be supplied to m.component). Additional parameters beyond the first four are
allowed, but are caught via an `...args:any[]` and thus are not type checked.
This commit is contained in:
parent
80f43c260b
commit
1cdb66b20d
1 changed files with 238 additions and 29 deletions
267
mithril.d.ts
vendored
267
mithril.d.ts
vendored
|
|
@ -28,22 +28,6 @@ declare module _mithril {
|
|||
MithrilComponent<T>>
|
||||
): MithrilVirtualElement<T>;
|
||||
|
||||
/**
|
||||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A component.
|
||||
* @param args Arguments to optionally pass to the component.
|
||||
* @return A component.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
<T extends MithrilController>(
|
||||
component: MithrilComponent<T>,
|
||||
...args: any[]
|
||||
): MithrilComponent<T>;
|
||||
|
||||
/**
|
||||
* Creates a virtual element for use with m.render, m.mount, etc.
|
||||
*
|
||||
|
|
@ -67,18 +51,121 @@ declare module _mithril {
|
|||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param selector A component.
|
||||
* @param args Arguments to optionally pass to the component.
|
||||
* @return A component.
|
||||
* @param component A mithril component.
|
||||
* @return A mithril component.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<T extends MithrilController>(
|
||||
component: MithrilComponent<T>,
|
||||
...args: any[]
|
||||
): MithrilComponent<T>;
|
||||
<TController extends MithrilController>(
|
||||
component: MithrilComponent<TController>
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<TController extends MithrilController, T1>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, void, void, void>,
|
||||
arg1: T1
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<TController extends MithrilController, T1, T2>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, void, void>,
|
||||
arg1: T1,
|
||||
arg2: T2
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<TController extends MithrilController, T1, T2, T3>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, void>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @param arg4 Fourth argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<TController extends MithrilController, T1, T2, T3, T4>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, T4>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3,
|
||||
arg4: T4
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
* Shorthand for m.component.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @param arg4 Fourth argument to bind to the component.
|
||||
* @param args Additional optional arguments which are not type checked.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m.component
|
||||
*/
|
||||
<TController extends MithrilController, T1, T2, T3, T4>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, T4>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3,
|
||||
arg4: T4,
|
||||
...args:any[]
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Creates a getter-setter function that wraps a Mithril promise. Useful
|
||||
|
|
@ -149,18 +236,116 @@ declare module _mithril {
|
|||
/**
|
||||
* Initializes a component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param selector A component.
|
||||
* @param args Arguments to optionally pass to the component.
|
||||
* @return A component.
|
||||
* @param component A mithril component.
|
||||
* @return A mithril component.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<T extends MithrilController>(
|
||||
component: MithrilComponent<T>,
|
||||
component<TController extends MithrilController>(
|
||||
component: MithrilComponent<TController>
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<TController extends MithrilController, T1>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, void, void, void>,
|
||||
arg1: T1
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<TController extends MithrilController, T1, T2>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, void, void>,
|
||||
arg1: T1,
|
||||
arg2: T2
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<TController extends MithrilController, T1, T2, T3>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, void>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @param arg4 Fourth argument to bind to the component.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<TController extends MithrilController, T1, T2, T3, T4>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, T4>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3,
|
||||
arg4: T4
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Initializes a parameterized component for use with m.render, m.mount, etc.
|
||||
*
|
||||
* @param component A parameterized component.
|
||||
* @param arg1 First argument to bind to the component.
|
||||
* @param arg2 Second argument to bind to the component.
|
||||
* @param arg3 Third argument to bind to the component.
|
||||
* @param arg4 Fourth argument to bind to the component.
|
||||
* @param args Additional optional arguments which are not type checked.
|
||||
* @return A component bound with the supplied arguments.
|
||||
*
|
||||
* @see m.render
|
||||
* @see m.mount
|
||||
* @see m
|
||||
*/
|
||||
component<TController extends MithrilController, T1, T2, T3, T4>(
|
||||
component: ParameterizedMithrilComponent<TController, T1, T2, T3, T4>,
|
||||
arg1: T1,
|
||||
arg2: T2,
|
||||
arg3: T3,
|
||||
arg4: T4,
|
||||
...args: any[]
|
||||
): MithrilComponent<T>;
|
||||
): MithrilComponent<TController>;
|
||||
|
||||
/**
|
||||
* Trust this string of HTML.
|
||||
|
|
@ -599,6 +784,30 @@ declare module _mithril {
|
|||
view(ctrl: T): MithrilVirtualElement<T>;
|
||||
}
|
||||
|
||||
/**
|
||||
* This represents a parameterized MithrilComponent with up to six parameters,
|
||||
* intended to be instantiated via m.component().
|
||||
*
|
||||
* @see m
|
||||
* @see m.component
|
||||
*/
|
||||
interface ParameterizedMithrilComponent<TController extends MithrilController, T1, T2, T3, T4> {
|
||||
/**
|
||||
* The component's controller.
|
||||
*
|
||||
* @see m.component
|
||||
*/
|
||||
controller: (arg1: T1, arg2: T2, arg3: T3, arg4: T4, ...args: any[]) => TController;
|
||||
|
||||
|
||||
/**
|
||||
* creates a view out of virtual elements.
|
||||
*
|
||||
* @see m.component
|
||||
*/
|
||||
view(ctrl: TController, arg1: T1, arg2: T2, arg3: T3, arg4: T4, ...args:any[]): MithrilVirtualElement<TController>;
|
||||
}
|
||||
|
||||
/**
|
||||
* This is the base interface for property getter-setters
|
||||
*
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue