Merge pull request #1002 from moonrailgun/moonrailgun/export-box

export type box and others type complement

src/Context.ts

@@ -369,7 +369,17 @@ export class Context {
    * @method
    * @name Konva.Context#drawImage
    */
-  drawImage(a0, a1, a2, a3?, a4?, a5?, a6?, a7?, a8?) {
+  drawImage(
+    a0: CanvasImageSource,
+    a1: number,
+    a2: number,
+    a3?: number,
+    a4?: number,
+    a5?: number,
+    a6?: number,
+    a7?: number,
+    a8?: number
+  ) {
     var a = arguments,
       _context = this._context;
 
@@ -386,7 +396,16 @@ export class Context {
    * @method
    * @name Konva.Context#ellipse
    */
-  ellipse(a0, a1, a2, a3, a4, a5, a6, a7) {
+  ellipse(
+    a0: number,
+    a1: number,
+    a2: number,
+    a3: number,
+    a4: number,
+    a5: number,
+    a6: number,
+    a7?: boolean
+  ) {
     this._context.ellipse(a0, a1, a2, a3, a4, a5, a6, a7);
   }
   /**

src/Layer.ts

@@ -326,9 +326,7 @@ export class Layer extends Container<Group | Shape> {
    * // or if you interested in shape parent:
    * var group = layer.getIntersection({x: 50, y: 50}, 'Group');
    */
-  getIntersection(pos: Vector2d, selector?: string) {
-    var obj, i, intersectionOffset, shape;
-
+  getIntersection(pos: Vector2d, selector?: string): Node | null {
     if (!this.isListening() || !this.isVisible()) {
       return null;
     }
@@ -337,13 +335,13 @@ export class Layer extends Container<Group | Shape> {
     var spiralSearchDistance = 1;
     var continueSearch = false;
     while (true) {
-      for (i = 0; i < INTERSECTION_OFFSETS_LEN; i++) {
-        intersectionOffset = INTERSECTION_OFFSETS[i];
-        obj = this._getIntersection({
+      for (let i = 0; i < INTERSECTION_OFFSETS_LEN; i++) {
+        const intersectionOffset = INTERSECTION_OFFSETS[i];
+        const obj = this._getIntersection({
           x: pos.x + intersectionOffset.x * spiralSearchDistance,
           y: pos.y + intersectionOffset.y * spiralSearchDistance,
         });
-        shape = obj.shape;
+        const shape = obj.shape;
         if (shape && selector) {
           return shape.findAncestor(selector, true);
         } else if (shape) {
@@ -365,21 +363,20 @@ export class Layer extends Container<Group | Shape> {
       }
     }
   }
-  _getIntersection(pos) {
-    var ratio = this.hitCanvas.pixelRatio;
-    var p = this.hitCanvas.context.getImageData(
+  _getIntersection(pos: Vector2d): { shape?: Shape; antialiased?: boolean } {
+    const ratio = this.hitCanvas.pixelRatio;
+    const p = this.hitCanvas.context.getImageData(
       Math.round(pos.x * ratio),
       Math.round(pos.y * ratio),
       1,
       1
-      ).data,
-      p3 = p[3],
-      colorKey,
-      shape;
+    ).data;
+    const p3 = p[3];
+
     // fully opaque pixel
     if (p3 === 255) {
-      colorKey = Util._rgbToHex(p[0], p[1], p[2]);
-      shape = shapes[HASH + colorKey];
+      const colorKey = Util._rgbToHex(p[0], p[1], p[2]);
+      const shape = shapes[HASH + colorKey];
       if (shape) {
         return {
           shape: shape,

src/Shape.ts

@@ -21,6 +21,9 @@ export type ShapeConfigHandler<TTarget> = {
   bivarianceHack(ctx: Context, shape: TTarget): void;
 }['bivarianceHack'];
 
+export type LineJoin = 'round' | 'bevel' | 'miter';
+export type LineCap = 'butt' | 'round' | 'square';
+
 export interface ShapeConfig extends NodeConfig {
   fill?: string;
   fillPatternImage?: HTMLImageElement;
@@ -58,8 +61,8 @@ export interface ShapeConfig extends NodeConfig {
   strokeScaleEnabled?: boolean;
   strokeHitEnabled?: boolean;
   strokeEnabled?: boolean;
-  lineJoin?: string;
-  lineCap?: string;
+  lineJoin?: LineJoin;
+  lineCap?: LineCap;
   sceneFunc?: (con: Context, shape: Shape) => void;
   hitFunc?: (con: Context, shape: Shape) => void;
   shadowColor?: string;
@@ -98,7 +101,7 @@ function getDummyContext(): CanvasRenderingContext2D {
   return dummyContext;
 }
 
-export const shapes = {};
+export const shapes: { [key: string]: Shape } = {};
 
 // TODO: idea - use only "remove" (or destroy method)
 // how? on add, check that every inner shape has reference in konva store with color
@@ -179,7 +182,7 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
   constructor(config?: Config) {
     super(config);
     // set colorKey
-    var key;
+    let key: string;
 
     while (true) {
       key = Util.getRandomColor();
@@ -795,8 +798,8 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
   fillPatternY: GetSet<number, this>;
   fillPriority: GetSet<string, this>;
   hitFunc: GetSet<ShapeConfigHandler<this>, this>;
-  lineCap: GetSet<string, this>;
-  lineJoin: GetSet<string, this>;
+  lineCap: GetSet<LineCap, this>;
+  lineJoin: GetSet<LineJoin, this>;
   perfectDrawEnabled: GetSet<boolean, this>;
   sceneFunc: GetSet<ShapeConfigHandler<this>, this>;
   shadowColor: GetSet<string, this>;

src/Stage.ts

@@ -360,7 +360,7 @@ export class Stage extends Container<Layer> {
       layer.draw();
     });
   }
-  add(layer) {
+  add(layer: Layer) {
     if (arguments.length > 1) {
       for (var i = 0; i < arguments.length; i++) {
         this.add(arguments[i]);

src/shapes/Image.ts

@@ -5,6 +5,7 @@ import { getNumberValidator } from '../Validators';
 import { _registerNode } from '../Global';
 
 import { GetSet, IRect } from '../types';
+import { Context } from '../Context';
 
 export interface ImageConfig extends ShapeConfig {
   image: CanvasImageSource | undefined;
@@ -38,17 +39,15 @@ export class Image extends Shape<ImageConfig> {
   _useBufferCanvas() {
     return super._useBufferCanvas(true);
   }
-  _sceneFunc(context) {
-    var width = this.getWidth(),
-      height = this.getHeight(),
-      image = this.attrs.image,
-      cropWidth,
-      cropHeight,
-      params;
+  _sceneFunc(context: Context) {
+    const width = this.getWidth();
+    const height = this.getHeight();
+    const image = this.attrs.image;
+    let params;
 
     if (image) {
-      cropWidth = this.attrs.cropWidth;
-      cropHeight = this.attrs.cropHeight;
+      const cropWidth = this.attrs.cropWidth;
+      const cropHeight = this.attrs.cropHeight;
       if (cropWidth && cropHeight) {
         params = [
           image,

src/shapes/Transformer.ts

@@ -11,7 +11,7 @@ import { _registerNode } from '../Global';
 
 import { GetSet, IRect, Vector2d } from '../types';
 
-interface Box extends IRect {
+export interface Box extends IRect {
   rotation: number;
 }
 
@@ -1208,7 +1208,7 @@ export class Transformer extends Group {
   keepRatio: GetSet<boolean, this>;
   centeredScaling: GetSet<boolean, this>;
   ignoreStroke: GetSet<boolean, this>;
-  boundBoxFunc: GetSet<(oldBox: IRect, newBox: IRect) => IRect, this>;
+  boundBoxFunc: GetSet<(oldBox: Box, newBox: Box) => Box, this>;
   shouldOverdrawWholeArea: GetSet<boolean, this>;
 }
 

src/types.ts

@@ -43,7 +43,7 @@ export enum KonvaNodeEvent {
   dbltap = 'dbltap',
   dragstart = 'dragstart',
   dragmove = 'dragmove',
-  dragend = 'dragend'
+  dragend = 'dragend',
 }
 
 export interface RGB {