more strict typescript

konvajs · Aug 28, 2023 · d33b8e9 · d33b8e9
1 parent cd2e173
commit d33b8e9
Show file tree

Hide file tree

Showing 21 changed files with 345 additions and 747 deletions.
diff --git a/src/Animation.ts b/src/Animation.ts
@@ -61,11 +61,11 @@ export class Animation {
    * @param {Konva.Layer|Array} [layers] layer(s) to be redrawn. Can be a layer, an array of layers, or null.  Not specifying a node will result in no redraw.
    * @return {Konva.Animation} this
    */
-  setLayers(layers:null | Layer | Layer[]) {
+  setLayers(layers: null | Layer | Layer[]) {
     let lays: Layer[] = [];
     // if passing in no layers
     if (layers) {
-      lays = Array.isArray(layers)? layers : [layers]
+      lays = Array.isArray(layers) ? layers : [layers];
     }
     this.layers = lays;
     return this;
@@ -87,8 +87,8 @@ export class Animation {
    * @return {Bool} true if layer is added to animation, otherwise false
    */
   addLayer(layer: Layer) {
-    const layers = this.layers
-    const len = layers.length
+    const layers = this.layers;
+    const len = layers.length;
 
     // don't add the layer if it already exists
     for (let n = 0; n < len; n++) {
@@ -107,9 +107,9 @@ export class Animation {
    * @return {Bool} is animation running?
    */
   isRunning() {
-    const a = Animation
-    const animations = a.animations
-    const len = animations.length
+    const a = Animation;
+    const animations = a.animations;
+    const len = animations.length;
 
     for (let n = 0; n < len; n++) {
       if (animations[n].id === this.id) {
@@ -148,7 +148,7 @@ export class Animation {
     this.frame.frameRate = 1000 / this.frame.timeDiff;
   }
 
-  static animations = [];
+  static animations: Array<Animation> = [];
   static animIdCounter = 0;
   static animRunning = false;
 
@@ -157,9 +157,9 @@ export class Animation {
     this._handleAnimation();
   }
   static _removeAnimation(anim) {
-    const id = anim.id
-    const animations = this.animations
-    const len = animations.length
+    const id = anim.id;
+    const animations = this.animations;
+    const len = animations.length;
 
     for (let n = 0; n < len; n++) {
       if (animations[n].id === id) {
@@ -170,8 +170,8 @@ export class Animation {
   }
 
   static _runFrames() {
-    const layerHash = {}
-    const animations = this.animations
+    const layerHash = {};
+    const animations = this.animations;
     /*
      * loop through all animations and execute animation
      *  function.  if the animation object has specified node,
@@ -193,7 +193,7 @@ export class Animation {
       const layersLen = layers.length;
 
       // if animation object has a function, execute it
-      let needRedraw
+      let needRedraw;
       if (func) {
         // allow anim bypassing drawing
         needRedraw = func.call(anim, anim.frame) !== false;

diff --git a/src/Container.ts b/src/Container.ts
@@ -197,7 +197,7 @@ export abstract class Container<
    *  return node.getType() === 'Node' && node.getAbsoluteOpacity() < 1;
    * });
    */
-  find<ChildNode extends Node = Node>(selector): Array<ChildNode> {
+  find<ChildNode extends Node>(selector): Array<ChildNode> {
     // protecting _generalFind to prevent user from accidentally adding
     // second argument and getting unexpected `findOne` result
     return this._generalFind<ChildNode>(selector, false);
@@ -317,7 +317,7 @@ export abstract class Container<
   getAllIntersections(pos) {
     var arr: Shape[] = [];
 
-    this.find('Shape').forEach(function (shape: Shape) {
+    this.find<Shape>('Shape').forEach((shape) => {
       if (shape.isVisible() && shape.intersects(pos)) {
         arr.push(shape);
       }
@@ -437,13 +437,14 @@ export abstract class Container<
     }
   }
 
-  getClientRect(config?: {
-    skipTransform?: boolean;
-    skipShadow?: boolean;
-    skipStroke?: boolean;
-    relativeTo?: Container<Node>;
-  }): IRect {
-    config = config || {};
+  getClientRect(
+    config: {
+      skipTransform?: boolean;
+      skipShadow?: boolean;
+      skipStroke?: boolean;
+      relativeTo?: Container<Node>;
+    } = {}
+  ): IRect {
     var skipTransform = config.skipTransform;
     var relativeTo = config.relativeTo;
 

diff --git a/src/Context.ts b/src/Context.ts
@@ -6,7 +6,7 @@ import { IRect } from './types';
 import type { Node } from './Node';
 
 function simplifyArray(arr: Array<any>) {
-  var retArr = [],
+  var retArr: Array<any> = [],
     len = arr.length,
     util = Util,
     n,
@@ -441,9 +441,19 @@ export class Context {
     if (a.length === 3) {
       _context.drawImage(a0, a1, a2);
     } else if (a.length === 5) {
-      _context.drawImage(a0, a1, a2, a3, a4);
+      _context.drawImage(a0, a1, a2, a3 as number, a4 as number);
     } else if (a.length === 9) {
-      _context.drawImage(a0, a1, a2, a3, a4, a5, a6, a7, a8);
+      _context.drawImage(
+        a0,
+        a1,
+        a2,
+        a3 as number,
+        a4 as number,
+        a5 as number,
+        a6 as number,
+        a7 as number,
+        a8 as number
+      );
     }
   }
   /**

diff --git a/src/DragAndDrop.ts b/src/DragAndDrop.ts
@@ -1,3 +1,4 @@
+import { Container } from './Container';
 import { Konva } from './Global';
 import { Node } from './Node';
 import { Vector2d } from './types';
@@ -44,7 +45,7 @@ export const DD = {
     DD._dragElements.forEach((elem, key) => {
       const { node } = elem;
       // we need to find pointer relative to that node
-      const stage = node.getStage();
+      const stage = node.getStage()!;
       stage.setPointersPositions(evt);
 
       // it is possible that user call startDrag without any event
@@ -95,11 +96,11 @@ export const DD = {
   // dragBefore and dragAfter allows us to set correct order of events
   // setup all in dragbefore, and stop dragging only after pointerup triggered.
   _endDragBefore(evt?) {
-    const drawNodes = [];
+    const drawNodes: Array<Container> = [];
     DD._dragElements.forEach((elem) => {
       const { node } = elem;
       // we need to find pointer relative to that node
-      const stage = node.getStage();
+      const stage = node.getStage()!;
       if (evt) {
         stage.setPointersPositions(evt);
       }

diff --git a/src/Node.ts b/src/Node.ts
@@ -322,7 +322,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     ) {
       rect = this.getClientRect({
         skipTransform: true,
-        relativeTo: this.getParent(),
+        relativeTo: this.getParent() || undefined,
       });
     }
     var width = Math.ceil(conf.width || rect.width),
@@ -492,14 +492,17 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     // redefine in Container and Shape
     throw new Error('abstract "getClientRect" method call');
   }
-  _transformedRect(rect: IRect, top: Node) {
+  _transformedRect(rect: IRect, top?: Node | null) {
     var points = [
       { x: rect.x, y: rect.y },
       { x: rect.x + rect.width, y: rect.y },
       { x: rect.x + rect.width, y: rect.y + rect.height },
       { x: rect.x, y: rect.y + rect.height },
     ];
-    var minX: number, minY: number, maxX: number, maxY: number;
+    var minX: number = Infinity,
+      minY: number = Infinity,
+      maxX: number = -Infinity,
+      maxY: number = -Infinity;
     var trans = this.getAbsoluteTransform(top);
     points.forEach(function (point) {
       var transformed = trans.point(point);
@@ -1084,8 +1087,9 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
         addChildren(nodes);
       }
     }
-    if (that.nodeType !== UPPER_STAGE) {
-      addChildren(that.getStage().getChildren());
+    const stage = this.getStage();
+    if (that.nodeType !== UPPER_STAGE && stage) {
+      addChildren(stage.getChildren());
     }
 
     return index;
@@ -1150,11 +1154,12 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
    * rect.getRelativePointerPosition();
    */
   getRelativePointerPosition() {
-    if (!this.getStage()) {
+    const stage = this.getStage();
+    if (!stage) {
       return null;
     }
     // get pointer (say mouse or touch) position
-    var pos = this.getStage().getPointerPosition();
+    var pos = stage.getPointerPosition();
     if (!pos) {
       return null;
     }
@@ -1205,13 +1210,11 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     return absoluteTransform.getTranslation();
   }
   setAbsolutePosition(pos: Vector2d) {
-    var origTrans = this._clearTransform();
+    const { x, y, ...origTrans } = this._clearTransform();
 
     // don't clear translation
-    this.attrs.x = origTrans.x;
-    this.attrs.y = origTrans.y;
-    delete origTrans.x;
-    delete origTrans.y;
+    this.attrs.x = x;
+    this.attrs.y = y;
 
     // important, use non cached value
     this._clearCache(TRANSFORM);
@@ -1298,7 +1301,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     return this;
   }
   _eachAncestorReverse(func, top) {
-    var family = [],
+    var family: Array<Node> = [],
       parent = this.getParent(),
       len,
       n;
@@ -1541,7 +1544,11 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
    * // get one of the parent group
    * var parentGroups = node.findAncestors('Group');
    */
-  findAncestors(selector: string, includeSelf?: boolean, stopNode?: Node) {
+  findAncestors(
+    selector: string | Function,
+    includeSelf?: boolean,
+    stopNode?: Node
+  ) {
     var res: Array<Node> = [];
 
     if (includeSelf && this._isMatch(selector)) {
@@ -1574,7 +1581,11 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
    * // get one of the parent group
    * var group = node.findAncestors('.mygroup');
    */
-  findAncestor(selector?: string, includeSelf?: boolean, stopNode?: Container) {
+  findAncestor(
+    selector: string | Function,
+    includeSelf?: boolean,
+    stopNode?: Container
+  ) {
     return this.findAncestors(selector, includeSelf, stopNode)[0];
   }
   // is current node match passed selector?
@@ -1639,12 +1650,12 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     return this._getCache(STAGE, this._getStage);
   }
 
-  _getStage(): Stage | undefined {
+  _getStage() {
     var parent = this.getParent();
     if (parent) {
       return parent.getStage();
     } else {
-      return undefined;
+      return null;
     }
   }
   /**
@@ -1689,7 +1700,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
    * @name Konva.Node#getAbsoluteTransform
    * @returns {Konva.Transform}
    */
-  getAbsoluteTransform(top?: Node) {
+  getAbsoluteTransform(top?: Node | null) {
     // if using an argument, we can't cache the result.
     if (top) {
       return this._getAbsoluteTransform(top);
@@ -1756,7 +1767,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     // do not cache this calculations,
     // because it use cache transform
     // this is special logic for caching with some shapes with shadow
-    var parent: Node = this;
+    var parent: Node | null = this;
     while (parent) {
       if (parent._isUnderCache) {
         top = parent;
@@ -2071,7 +2082,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     pixelRatio?: number;
     mimeType?: string;
     quality?: number;
-    callback?: (blob: Blob) => void;
+    callback?: (blob: Blob | null) => void;
   }) {
     return new Promise((resolve, reject) => {
       try {
@@ -2373,6 +2384,9 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
     var pointerId = evt ? evt.pointerId : undefined;
     var stage = this.getStage();
     var ap = this.getAbsolutePosition();
+    if (!stage) {
+      return;
+    }
     var pos =
       stage._getPointerById(pointerId) ||
       stage._changedPointerPositions[0] ||
@@ -2399,7 +2413,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
       this._createDragElement(evt);
     }
 
-    const elem = DD._dragElements.get(this._id);
+    const elem = DD._dragElements.get(this._id)!;
     elem.dragStatus = 'dragging';
     this.fire(
       'dragstart',
@@ -2415,7 +2429,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
   _setDragPosition(evt, elem) {
     // const pointers = this.getStage().getPointersPositions();
     // const pos = pointers.find(p => p.id === this._dragEventId);
-    const pos = this.getStage()._getPointerById(elem.pointerId);
+    const pos = this.getStage()!._getPointerById(elem.pointerId);
 
     if (!pos) {
       return;