d3-selection and d3-transition:

* Changes to relax BaseType and remove  unnecessary constraints implied by NodeListOf<...> use. Replaced with new ArrayLike<...> interface were appropriate.
This commit is contained in:
Tom Wanzek
2016-07-21 00:15:06 -04:00
parent efcf66eb65
commit 4f2dd7b5e5
4 changed files with 70 additions and 69 deletions
+10 -15
View File
@@ -77,7 +77,7 @@ let body: d3Selection.Selection<HTMLBodyElement, BodyDatum, HTMLElement, any> =
// with Group element of type BaseType and datum of type 'any' The parent element is of type 'null' with datum of type 'undefined'
let baseTypeEl2: d3Selection.Selection<d3Selection.BaseType, any, null, undefined> = d3Selection.select(baseTypeEl.node());
// let body2: d3Selection.Selection<HTMLElement, any, null, undefined> = d3Selection.select(baseTypeEl.node()); // Fails, group element types not of compatible for baseTypeEl
// let body2: d3Selection.Selection<HTMLElement, any, null, undefined> = d3Selection.select(baseTypeEl.node()); // fails as baseTypeEl.node() is of type cannot be assigned to HTMLElement
let body3: d3Selection.Selection<HTMLBodyElement, any, null, undefined> = d3Selection.select(body.node()); // element types match, but datum is of type 'any' as it cannot be inferred from .node()
@@ -91,8 +91,8 @@ let body4: d3Selection.Selection<HTMLBodyElement, BodyDatum, null, undefined> =
// TODO: The below are related to github issue #2 (BaseType choice)
// d3Selection.select(xDoc); // Note: Creates error because BaseType for selection is Element (-> e.g. classList property missing)
// d3Selection.select(xWindow); // Note: Creates error because BaseType for selection is Element (-> e.g. classList property missing)
d3Selection.select(xDoc);
// d3Selection.select(xWindow); // Window cannot does not match type BaseType = Element | EnterElement
// test top-level selectAll() -------------------------------------------------------------
@@ -118,7 +118,7 @@ let divElements: d3Selection.Selection<HTMLDivElement, DivDatum, HTMLElement, an
// with Group element of type BaseType and datum of type 'any' The parent element is of type 'null' with datum of type 'undefined'
let baseTypeElements2: d3Selection.Selection<d3Selection.BaseType, any, null, undefined> = d3Selection.selectAll(baseTypeElements.nodes());
// let divElements2: d3Selection.Selection<HTMLDivElement, any, null, undefined> = d3Selection.selectAll(baseTypeElements.nodes()); // Fails, group elements types not of compatible for baseTypeElements
// let divElements2: d3Selection.Selection<HTMLDivElement, any, null, undefined> = d3Selection.selectAll(baseTypeElements.nodes()); // fails, group elements types not of compatible for baseTypeElements
let divElements3: d3Selection.Selection<HTMLDivElement, any, null, undefined> = d3Selection.selectAll(divElements.nodes()); // element types match, but datum is of type 'any' as it cannot be inferred from .nodes()
@@ -139,10 +139,7 @@ let circleSelection: d3Selection.Selection<SVGCircleElement, any, null, undefine
// selectAll(...) accepts HTMLCollection, HTMLCollectionOf<...> argument
// NB: The below line compiles with target ES5, but not with target ES6!!!
// let documentLinks: d3Selection.Selection<HTMLAnchorElement | HTMLAreaElement, any, null, undefined> = d3Selection.selectAll(document.links); // fails, as HTMLCollectionOf cannot be passed to NodeListOf
let documentLinks: d3Selection.Selection<HTMLAnchorElement | HTMLAreaElement, any, null, undefined> = d3Selection.selectAll(document.links);
@@ -226,7 +223,7 @@ gElementsOldData = svgEl.selectAll<SVGGElement, CircleDatum>(function () {
return this.querySelectorAll('g'); // this of type SVGSVGElement by type inference
});
gElementsOldData = svgEl.selectAll<SVGGElement, CircleDatum>(function (d, i, group) { // fails, because Datum type is not compatible as selectAll defaults to 'any', but gElementsOldData expects CircleDatum
gElementsOldData = svgEl.selectAll<SVGGElement, CircleDatum>(function (d, i, group) {
console.log('Get <svg> Element width using "this": ', this.width.baseVal.value); // 'this' type is SVGSVGElement
console.log('Width in datum:', d.width); // type of d is SVGDatum
if (group.length > 1) {
@@ -236,7 +233,7 @@ gElementsOldData = svgEl.selectAll<SVGGElement, CircleDatum>(function (d, i, gro
});
// gElementsOldData = svgEl.selectAll(function() { // fails, because Datum type is not compatible as selectAll defaults to 'any', but gElementsOldData expects CircleDatum
// return this.querySelectorAll('g');
// return this.querySelectorAll('g');
// });
// gElementsOldData = svgEl.selectAll<SVGGElement, CircleDatum>(function() { // fails, return type HTMLAnchorElement is not compatible with SVGGElement expected by selectAll-typing
@@ -551,9 +548,7 @@ circles2 = circles2 // returned update selection has the same type parameters as
// TODO: Related to BaseType Choice issue
// let enterElements: d3Selection.Selection<d3Selection.EnterElement, CircleDatumAlternative, SVGSVGElement, SVGDatum>; ,fails as current BaseType is Element
let enterElements: d3Selection.Selection<SVGCircleElement, CircleDatumAlternative, SVGSVGElement, SVGDatum>;
let enterElements: d3Selection.Selection<d3Selection.EnterElement, CircleDatumAlternative, SVGSVGElement, SVGDatum>;
enterElements = circles2.enter(); // enter selection
@@ -585,7 +580,7 @@ exitCircles
// exitCircles
// .style('opacity', function (d) {
// console.log('Circle Radius exit node: ', this.r.baseVal.value);
// return d.color === 'green' ? 1 : 0; // fails, as data type is defaulted to {}. If datum access is required, this should trigger the thought to type .exit<...>
// return d.color === 'green' ? 1 : 0; // fails, as data type is defaulted to {}. If datum access is required, this should trigger the thought to type .exit<...>
// });
// MERGE ENTER + UPDATE ------------------------------------------------------------------
@@ -794,7 +789,7 @@ circles = circles.call(enforceMinRadius, 40); // check chaining return type by r
// on(...) -------------------------------------------------------------------------------
let listener: (this: HTMLBodyElement, datum: BodyDatum, index: number, group: Array<HTMLBodyElement> | NodeListOf<HTMLBodyElement>) => void;
let listener: (this: HTMLBodyElement, datum: BodyDatum, index: number, group: Array<HTMLBodyElement> | ArrayLike<HTMLBodyElement>) => void;
// returns 'this' selection
body = body.on('click', listener); // check chaining return type by re-assigning
+42 -37
View File
@@ -12,18 +12,23 @@
* without 'd3-selection' trying to use properties internally which would otherwise not
* be supported.
*/
export type BaseType = Element;
export type BaseType = Element | EnterElement;
// export type BaseType = any; // Alternative, very permissive BaseType specification for edge cases
export interface ArrayLike<T> {
length: number;
item(index: number): T;
[index: number]: T;
}
// TODO: Review Use for enter()
export type EnterElement = {
export interface EnterElement {
ownerDocument: Document;
namespaceURI: string;
appendChild(newChild: Node): Node;
insertBefore(newChild: Node, refChild: Node): Node;
querySelector(selectors: string): Element;
querySelectorAll(selectors: string): NodeListOf<Element>
querySelectorAll(selectors: string): NodeListOf<Element>;
}
/**
@@ -65,9 +70,9 @@ export type CustomEventParameters = {
export interface TransitionLike<GElement extends BaseType, Datum> {
selection(): Selection<GElement, Datum, any, any>;
on(type: string, listener: null): TransitionLike<GElement, Datum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | NodeListOf<GElement>) => any): TransitionLike<GElement, Datum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | ArrayLike<GElement>) => any): TransitionLike<GElement, Datum>;
tween(name: string, tweenFn: null): TransitionLike<GElement, Datum>;
tween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | NodeListOf<GElement>) => ((t: number) => void)): TransitionLike<GElement, Datum>;
tween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | ArrayLike<GElement>) => ((t: number) => void)): TransitionLike<GElement, Datum>;
}
@@ -85,7 +90,7 @@ export function selectAll(): Selection<null, undefined, null, undefined>; // _gr
export function selectAll(selector: null): Selection<null, undefined, null, undefined>; // _groups are set to empty array, first generic type is set to null by convention
export function selectAll<GElement extends BaseType, OldDatum>(selector: string): Selection<GElement, OldDatum, HTMLElement, any>;
export function selectAll<GElement extends BaseType, OldDatum>(nodes: GElement[]): Selection<GElement, OldDatum, null, undefined>;
export function selectAll<GElement extends BaseType, OldDatum>(nodes: NodeListOf<GElement>): Selection<GElement, OldDatum, null, undefined>;
export function selectAll<GElement extends BaseType, OldDatum>(nodes: ArrayLike<GElement>): Selection<GElement, OldDatum, null, undefined>;
@@ -95,50 +100,50 @@ interface Selection<GElement extends BaseType, Datum, PElement extends BaseType,
select<DescElement extends BaseType>(selector: string): Selection<DescElement, Datum, PElement, PDatum>;
select<DescElement extends BaseType>(selector: null): Selection<null, undefined, PElement, PDatum>; // _groups are set to empty array, first generic type is set to null by convention
select<DescElement extends BaseType>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => DescElement): Selection<DescElement, Datum, PElement, PDatum>;
select<DescElement extends BaseType>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => DescElement): Selection<DescElement, Datum, PElement, PDatum>;
selectAll(): Selection<null, undefined, GElement, Datum>; // _groups are set to empty array, first generic type is set to null by convention
selectAll(selector: null): Selection<null, undefined, GElement, Datum>; // _groups are set to empty array, first generic type is set to null by convention
selectAll<DescElement extends BaseType, OldDatum>(selector: string): Selection<DescElement, OldDatum, GElement, Datum>;
selectAll<DescElement extends BaseType, OldDatum>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (Array<DescElement> | NodeListOf<DescElement>)): Selection<DescElement, OldDatum, GElement, Datum>;
selectAll<DescElement extends BaseType, OldDatum>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (Array<DescElement> | ArrayLike<DescElement>)): Selection<DescElement, OldDatum, GElement, Datum>;
// Modifying -------------------------------
attr(name: string): string;
attr(name: string, value: null): Selection<GElement, Datum, PElement, PDatum>;
attr(name: string, value: string | number | boolean): Selection<GElement, Datum, PElement, PDatum>;
attr(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean)): Selection<GElement, Datum, PElement, PDatum>;
attr(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean)): Selection<GElement, Datum, PElement, PDatum>;
classed(name: string): boolean;
classed(name: string, value: boolean): Selection<GElement, Datum, PElement, PDatum>;
classed(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => boolean): Selection<GElement, Datum, PElement, PDatum>;
classed(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => boolean): Selection<GElement, Datum, PElement, PDatum>;
style(name: string): string;
style(name: string, value: null): Selection<GElement, Datum, PElement, PDatum>;
style(name: string, value: string | number | boolean, priority?: null | 'important'): Selection<GElement, Datum, PElement, PDatum>;
style(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean), priority?: null | 'important'): Selection<GElement, Datum, PElement, PDatum>;
style(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean), priority?: null | 'important'): Selection<GElement, Datum, PElement, PDatum>;
property(name: string): any;
property(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => any): Selection<GElement, Datum, PElement, PDatum>;
property(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => any): Selection<GElement, Datum, PElement, PDatum>;
property(name: string, value: null): Selection<GElement, Datum, PElement, PDatum>;
property(name: string, value: any): Selection<GElement, Datum, PElement, PDatum>;
text(): string;
text(value: string | number | boolean): Selection<GElement, Datum, PElement, PDatum>;
text(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean)): Selection<GElement, Datum, PElement, PDatum>;
text(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean)): Selection<GElement, Datum, PElement, PDatum>;
html(): string;
html(value: string): Selection<GElement, Datum, PElement, PDatum>;
html(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => string): Selection<GElement, Datum, PElement, PDatum>;
html(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => string): Selection<GElement, Datum, PElement, PDatum>;
append<ChildElement extends BaseType>(type: string): Selection<ChildElement, Datum, PElement, PDatum>;
append<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => ChildElement): Selection<ChildElement, Datum, PElement, PDatum>;
append<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => ChildElement): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: string, before: string): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => ChildElement, before: string): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: string, before: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => BaseType): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => ChildElement,
before: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => BaseType): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => ChildElement, before: string): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: string, before: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => BaseType): Selection<ChildElement, Datum, PElement, PDatum>;
insert<ChildElement extends BaseType>(type: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => ChildElement,
before: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => BaseType): Selection<ChildElement, Datum, PElement, PDatum>;
/**
* Removes the selected elements from the document.
@@ -149,7 +154,7 @@ interface Selection<GElement extends BaseType, Datum, PElement extends BaseType,
merge(other: Selection<GElement, Datum, PElement, PDatum>): Selection<GElement, Datum, PElement, PDatum>;
filter(selector: string): Selection<GElement, Datum, PElement, PDatum>;
filter(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => boolean): Selection<GElement, Datum, PElement, PDatum>;
filter(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => boolean): Selection<GElement, Datum, PElement, PDatum>;
@@ -166,23 +171,23 @@ interface Selection<GElement extends BaseType, Datum, PElement extends BaseType,
datum(): Datum;
datum(value: null): Selection<GElement, undefined, PElement, PDatum>;
datum<NewDatum>(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => NewDatum): Selection<GElement, NewDatum, PElement, PDatum>;
datum<NewDatum>(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => NewDatum): Selection<GElement, NewDatum, PElement, PDatum>;
datum<NewDatum>(value: NewDatum): Selection<GElement, NewDatum, PElement, PDatum>;
data(): Datum[];
data<NewDatum>(
data: Array<NewDatum>,
key?: (this: GElement | PElement, datum?: Datum | NewDatum, index?: number, group?: Array<GElement | PElement> | NodeListOf<GElement | PElement>) => string
key?: (this: GElement | PElement, datum?: Datum | NewDatum, index?: number, group?: Array<GElement | PElement> | ArrayLike<GElement | PElement>) => string
): Selection<GElement, NewDatum, PElement, PDatum>;
data<NewDatum>(
data: (this: PElement, datum?: PDatum, index?: number, group?: Array<PElement> | NodeListOf<PElement>) => Array<NewDatum>,
key?: (this: GElement | PElement, datum?: Datum | NewDatum, index?: number, group?: Array<GElement | PElement> | NodeListOf<GElement | PElement>) => string
data: (this: PElement, datum?: PDatum, index?: number, group?: Array<PElement> | ArrayLike<PElement>) => Array<NewDatum>,
key?: (this: GElement | PElement, datum?: Datum | NewDatum, index?: number, group?: Array<GElement | PElement> | ArrayLike<GElement | PElement>) => string
): Selection<GElement, NewDatum, PElement, PDatum>;
// TODO: Enter Selection returns GElements of type EnterNode, which do not meet the minimum interface of BaseType = Element
// HACK: Keep enter() selection 'as-if' they are of type GElement, while overly permissive, this may be of little practical relevance,
// given that the normal next step is an .append(...), which would address the matter
enter(): Selection<GElement, Datum, PElement, PDatum>;
enter(): Selection<EnterElement, Datum, PElement, PDatum>;
// TODO: Review this: The type Datum on the exit items is actually of the type prior to calling data(...), as by definition, no new data of type NewDatum exists for these
// elements. Due to the chaining, .data(...).exit(...), however, the definition would imply that the exit group elements have assumed the NewDatum type.
@@ -191,17 +196,17 @@ interface Selection<GElement extends BaseType, Datum, PElement extends BaseType,
// Event Handling -------------------
on(type: string): (this: GElement, datum: Datum, index: number, group: Array<GElement> | NodeListOf<GElement>) => void;
on(type: string): (this: GElement, datum: Datum, index: number, group: Array<GElement> | ArrayLike<GElement>) => void;
on(type: string, listener: null): Selection<GElement, Datum, PElement, PDatum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | NodeListOf<GElement>) => void, capture?: boolean): Selection<GElement, Datum, PElement, PDatum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | ArrayLike<GElement>) => void, capture?: boolean): Selection<GElement, Datum, PElement, PDatum>;
dispatch(type: string, parameters?: CustomEventParameters): Selection<GElement, Datum, PElement, PDatum>;
dispatch(type: string, parameters?: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => CustomEventParameters): Selection<GElement, Datum, PElement, PDatum>;
dispatch(type: string, parameters?: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => CustomEventParameters): Selection<GElement, Datum, PElement, PDatum>;
// Control Flow ----------------------
each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => void): Selection<GElement, Datum, PElement, PDatum>;
each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => void): Selection<GElement, Datum, PElement, PDatum>;
call(func: (selection: Selection<GElement, Datum, PElement, PDatum>, ...args: any[]) => void, ...args: any[]): Selection<GElement, Datum, PElement, PDatum>;
@@ -263,9 +268,9 @@ export function touches(container: ContainerElement, touches?: TouchList): Array
export interface Local {
get(node: BaseType): any;
remove(node: BaseType): boolean;
set(node: BaseType, value: any): BaseType;
get(node: Element): any;
remove(node: Element): boolean;
set(node: Element, value: any): Element;
/**
* Obtain a string with the internally assigned property name for the local
* which is used to store the value on a node
@@ -343,7 +348,7 @@ export function window(DOMNode: Window | Document | Element): Window;
*
* @param elementName Name of the element to be added
*/
export function creator<NewGElement extends BaseType>(elementName: string): (this: BaseType) => NewGElement;
export function creator<NewGElement extends Element>(elementName: string): (this: BaseType) => NewGElement;
/**
* Returns a closure structure which can be invoked in the 'this' context
@@ -351,12 +356,12 @@ export function creator<NewGElement extends BaseType>(elementName: string): (thi
*
* @param selector A valid selector string
*/
export function matcher<GElement extends BaseType>(selector: string): (this: BaseType) => boolean;
export function matcher<GElement extends Element>(selector: string): (this: BaseType) => boolean;
// ----------------------------------------------------------------------------
// selector.js and selectorAll.js related functions
// ----------------------------------------------------------------------------
export function selector<DescElement extends BaseType>(selector: string): (this: BaseType) => DescElement
export function selector<DescElement extends Element>(selector: string): (this: BaseType) => DescElement
export function selectorAll<DescElement extends BaseType>(selector: string): (this: BaseType) => NodeListOf<DescElement>;
export function selectorAll<DescElement extends Element>(selector: string): (this: BaseType) => NodeListOf<DescElement>;
+4 -3
View File
@@ -7,6 +7,7 @@
*/
import {
ArrayLike,
selection,
select,
selectAll,
@@ -250,7 +251,7 @@ exitTransition = exitTransition.styleTween('fill', function (d, i, group) {
return interpolateRgb(c, d.color); // datum type is CircleDatum
});
let tweenFnAccessor: (this: SVGCircleElement, datum?: CircleDatum, i?: number, group?: SVGCircleElement[] | NodeListOf<SVGCircleElement>) => ((t: number) => void);
let tweenFnAccessor: (this: SVGCircleElement, datum?: CircleDatum, i?: number, group?: SVGCircleElement[] | ArrayLike<SVGCircleElement>) => ((t: number) => void);
// chainable
@@ -286,7 +287,7 @@ exitTransition.remove();
// Test Event Handling
// --------------------------------------------------------------------------
let listener: (this: SVGCircleElement, datum: CircleDatum, index: number, group: Array<SVGCircleElement> | NodeListOf<SVGCircleElement>) => void;
let listener: (this: SVGCircleElement, datum: CircleDatum, index: number, group: Array<SVGCircleElement> | ArrayLike<SVGCircleElement>) => void;
// returns 'this' transition
enterTransition = enterTransition.on('end', listener); // check chaining return type by re-assigning
@@ -309,7 +310,7 @@ enterTransition = enterTransition.on('end', null); // check chaining return type
// each() -------------------------------------------------------------------------------
// each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => void): Transition<GElement, Datum, PElement, PDatum>;
// each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => void): Transition<GElement, Datum, PElement, PDatum>;
// returns 'this' transition
enterTransition = enterTransition.each(function (d, i, group) { // check chaining return type by re-assigning
+14 -14
View File
@@ -3,7 +3,7 @@
// Definitions by: Alex Ford <https://github.com/gustavderdrache>, Boris Yankov <https://github.com/borisyankov>, Tom Wanzek <https://github.com/tomwanzek>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
import { BaseType, Selection } from 'd3-selection';
import { ArrayLike, BaseType, Selection } from 'd3-selection';
/**
* Extend interface 'Selection' by declaration merging with 'd3-selection'
@@ -26,14 +26,14 @@ export interface Transition<GElement extends BaseType, Datum, PElement extends B
// Sub-selection -------------------------
select<DescElement extends BaseType>(selector: string): Transition<DescElement, Datum, PElement, PDatum>;
select<DescElement extends BaseType>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => DescElement): Transition<DescElement, Datum, PElement, PDatum>;
select<DescElement extends BaseType>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => DescElement): Transition<DescElement, Datum, PElement, PDatum>;
// NB: while the empty selections (null or undefined selector) are defined on the underlying object, they should not be exposed in the type definition API
// as they are meaningless on transitions.)
// selectAll(): Transition<undefined, undefined, GElement, Datum>; // _groups are set to empty array, first generic type is set to undefined by convention
// selectAll(selector: null): Transition<undefined, undefined, GElement, Datum>; // _groups are set to empty array, first generic type is set to undefined by convention
selectAll<DescElement extends BaseType, OldDatum>(selector: string): Transition<DescElement, OldDatum, GElement, Datum>;
selectAll<DescElement extends BaseType, OldDatum>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (Array<DescElement> | NodeListOf<DescElement>)): Transition<DescElement, OldDatum, GElement, Datum>;
selectAll<DescElement extends BaseType, OldDatum>(selector: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (Array<DescElement> | ArrayLike<DescElement>)): Transition<DescElement, OldDatum, GElement, Datum>;
selection(): Selection<GElement, Datum, PElement, PDatum>;
transition(): Transition<GElement, Datum, PElement, PDatum>;
@@ -42,38 +42,38 @@ export interface Transition<GElement extends BaseType, Datum, PElement extends B
attr(name: string, value: null): Transition<GElement, Datum, PElement, PDatum>;
attr(name: string, value: string | number | boolean): Transition<GElement, Datum, PElement, PDatum>;
attr(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean)): Transition<GElement, Datum, PElement, PDatum>;
attrTween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | NodeListOf<GElement>) => ((t: number) => (string | number | boolean))): Transition<GElement, Datum, PElement, PDatum>;
attr(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean)): Transition<GElement, Datum, PElement, PDatum>;
attrTween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | ArrayLike<GElement>) => ((t: number) => (string | number | boolean))): Transition<GElement, Datum, PElement, PDatum>;
style(name: string, value: null): Transition<GElement, Datum, PElement, PDatum>;
style(name: string, value: string | number | boolean, priority?: null | 'important'): Transition<GElement, Datum, PElement, PDatum>;
style(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean), priority?: null | 'important'): Transition<GElement, Datum, PElement, PDatum>;
styleTween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | NodeListOf<GElement>) => ((t: number) => (string | number | boolean)), priority?: null | 'important'): Transition<GElement, Datum, PElement, PDatum>;
style(name: string, value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean), priority?: null | 'important'): Transition<GElement, Datum, PElement, PDatum>;
styleTween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | ArrayLike<GElement>) => ((t: number) => (string | number | boolean)), priority?: null | 'important'): Transition<GElement, Datum, PElement, PDatum>;
text(value: null): Transition<GElement, Datum, PElement, PDatum>;
text(value: string | number | boolean): Transition<GElement, Datum, PElement, PDatum>;
text(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => (string | number | boolean)): Transition<GElement, Datum, PElement, PDatum>;
text(value: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => (string | number | boolean)): Transition<GElement, Datum, PElement, PDatum>;
tween(name: string): (this: GElement, datum?: Datum, i?: number, group?: GElement[] | NodeListOf<GElement>) => ((t: number) => void);
tween(name: string): (this: GElement, datum?: Datum, i?: number, group?: GElement[] | ArrayLike<GElement>) => ((t: number) => void);
tween(name: string, tweenFn: null): Transition<GElement, Datum, PElement, PDatum>;
tween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | NodeListOf<GElement>) => ((t: number) => void)): Transition<GElement, Datum, PElement, PDatum>;
tween(name: string, tweenFn: (this: GElement, datum?: Datum, i?: number, group?: GElement[] | ArrayLike<GElement>) => ((t: number) => void)): Transition<GElement, Datum, PElement, PDatum>;
remove(): Transition<GElement, Datum, PElement, PDatum>;
merge(other: Transition<GElement, Datum, PElement, PDatum>): Transition<GElement, Datum, PElement, PDatum>;
filter(filter: string): Transition<GElement, Datum, PElement, PDatum>;
filter(filter: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => boolean): Transition<GElement, Datum, PElement, PDatum>;
filter(filter: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => boolean): Transition<GElement, Datum, PElement, PDatum>;
// Event Handling -------------------
on(type: string): (this: GElement, datum: Datum, index: number, group: Array<GElement> | NodeListOf<GElement>) => any;
on(type: string): (this: GElement, datum: Datum, index: number, group: Array<GElement> | ArrayLike<GElement>) => any;
on(type: string, listener: null): Transition<GElement, Datum, PElement, PDatum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | NodeListOf<GElement>) => any): Transition<GElement, Datum, PElement, PDatum>;
on(type: string, listener: (this: GElement, datum: Datum, index: number, group: Array<GElement> | ArrayLike<GElement>) => any): Transition<GElement, Datum, PElement, PDatum>;
// Control Flow ----------------------
each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | NodeListOf<GElement>) => void): Transition<GElement, Datum, PElement, PDatum>;
each(valueFn: (this: GElement, datum?: Datum, index?: number, group?: Array<GElement> | ArrayLike<GElement>) => void): Transition<GElement, Datum, PElement, PDatum>;
call(func: (transition: Transition<GElement, Datum, PElement, PDatum>, ...args: any[]) => any, ...args: any[]): Transition<GElement, Datum, PElement, PDatum>;