TS: migrate victory-brush-container and victory-brush-line

packages/victory-brush-container/package.json

@@ -28,6 +28,9 @@
   "peerDependencies": {
     "react": ">=16.6.0"
   },
+  "devDependencies": {
+    "victory-brush-container": "*"
+  },
   "scripts": {
     "###            THESE SCRIPTS ARE GENERATED           ###": "true",
     "###            DO NOT MODIFY THESE MANUALLY          ###": "true",

packages/victory-brush-container/src/brush-helpers.test.js → packages/victory-brush-container/src/brush-helpers.test.tsx

@@ -1,7 +1,8 @@
-import Helpers from "victory-brush-container/lib/brush-helpers";
+import { BrushHelpers } from "victory-brush-container";
 
 describe("containers/brush-helpers", () => {
-  const { withinBounds, constrainBox } = Helpers;
+  // eslint-disable-next-line @typescript-eslint/unbound-method
+  const { withinBounds, constrainBox } = BrushHelpers;
   describe("withinBounds", () => {
     it("returns true when within bounds", () => {
       const point = { x: 1, y: 1 };

packages/victory-brush-container/src/brush-helpers.js → packages/victory-brush-container/src/brush-helpers.ts

@@ -1,8 +1,26 @@
 import { Selection } from "victory-core";
 import { assign, throttle, isFunction, defaults, mapValues } from "lodash";
 import isEqual from "react-fast-compare";
+export interface BrushHelpers {
+  getDimension(props): any;
+  withinBounds(point, bounds, padding?): any;
+  getDomainBox(props, fullDomain, selectedDomain?): any;
+  getHandles(props, domainBox): any;
+  getActiveHandles(point, props, domainBox): any;
+  getResizeMutation(box, handles): any;
+  getMinimumDomain(): any;
+  getDefaultBrushArea(targetProps, cachedDomain, evt): any;
+  getSelectionMutation(point, box, brushDimension): any;
+  panBox(props, point): any;
+  constrainBox(box, fullDomainBox): any;
+  constrainPoint(point, fullDomainBox): any;
+  hasMoved(props): any;
+  onMouseDown(evt, targetProps): any;
+  onGlobalMouseMove(evt, targetProps): any;
+  onGlobalMouseUp(evt, targetProps): any;
+}
 
-const Helpers = {
+const Helpers: BrushHelpers = {
   getDimension(props) {
     const { horizontal, brushDimension } = props;
     if (!horizontal || !brushDimension) {
@@ -99,7 +117,7 @@ const Helpers = {
             : memo;
         return memo;
       },
-      [],
+      [] as string[],
     );
     return activeHandles.length && activeHandles;
   },
@@ -405,7 +423,6 @@ const Helpers = {
         x1: targetProps.x1,
         y1: targetProps.y1,
         scale,
-        horizontal,
       });
 
       const mutatedProps = { x2, y2, currentDomain, parentSVG };
@@ -452,7 +469,11 @@ const Helpers = {
         : targetProps.defaultBrushArea;
     const defaultBrushHasArea =
       defaultBrushArea !== undefined && defaultBrushArea !== "none";
-    const mutatedProps = { isPanning: false, isSelecting: false };
+    const mutatedProps: {
+      isPanning: boolean;
+      isSelecting: boolean;
+      currentDomain?: any;
+    } = { isPanning: false, isSelecting: false };
 
     // if the mouse hasn't moved since a mouseDown event, select the default brush area
     if ((allowResize || defaultBrushHasArea) && (x1 === x2 || y1 === y2)) {
@@ -496,7 +517,7 @@ const Helpers = {
   },
 };
 
-export default {
+export const BrushHelpers = {
   ...Helpers,
   onMouseDown: Helpers.onMouseDown.bind(Helpers),
   onGlobalMouseUp: Helpers.onGlobalMouseUp.bind(Helpers),

packages/victory-brush-container/src/index.ts

@@ -0,0 +1,2 @@
+export * from "./victory-brush-container";
+export * from "./brush-helpers";

packages/victory-brush-container/src/victory-brush-container.js → packages/victory-brush-container/src/victory-brush-container.tsx

@@ -1,11 +1,45 @@
 import PropTypes from "prop-types";
 import React from "react";
-import { VictoryContainer, Selection, Rect } from "victory-core";
-import BrushHelpers from "./brush-helpers";
+import {
+  VictoryContainer,
+  Selection,
+  Rect,
+  DomainTuple,
+  VictoryContainerProps,
+} from "victory-core";
+import { BrushHelpers } from "./brush-helpers";
 import { assign, defaults } from "lodash";
 import isEqual from "react-fast-compare";
+export interface VictoryBrushContainerProps extends VictoryContainerProps {
+  allowDrag?: boolean;
+  allowDraw?: boolean;
+  allowResize?: boolean;
+  brushComponent?: React.ReactElement;
+  brushDimension?: "x" | "y";
+  brushDomain?: { x?: DomainTuple; y?: DomainTuple };
+  brushStyle?: React.CSSProperties;
+  defaultBrushArea?: "all" | "none" | "disable" | "move";
+  disable?: boolean;
+  handleComponent?: React.ReactElement;
+  handleStyle?: React.CSSProperties;
+  handleWidth?: number;
+  onBrushCleared?: (
+    domain: { x: DomainTuple; y: DomainTuple },
+    props: VictoryBrushContainerProps,
+  ) => void;
+  onBrushDomainChange?: (
+    domain: { x: DomainTuple; y: DomainTuple },
+    props: VictoryBrushContainerProps,
+  ) => void;
+  onBrushDomainChangeEnd?: (
+    domain: { x: DomainTuple; y: DomainTuple },
+    props: VictoryBrushContainerProps,
+  ) => void;
+}
 
-export const brushContainerMixin = (base) =>
+type Constructor = new (...ars: any[]) => React.Component;
+
+export const brushContainerMixin = <TBase extends Constructor>(base: TBase) =>
   class VictoryBrushContainer extends base {
     static displayName = "VictoryBrushContainer";
     static propTypes = {
@@ -176,7 +210,7 @@ export const brushContainerMixin = (base) =>
             : memo;
           return memo;
         },
-        [],
+        [] as React.ReactElement[],
       );
       return handles.length ? handles : null;
     }
@@ -201,4 +235,4 @@ export const brushContainerMixin = (base) =>
     }
   };
 
-export default brushContainerMixin(VictoryContainer);
+export const VictoryBrushContainer = brushContainerMixin(VictoryContainer);

packages/victory-core/src/victory-util/selection.ts

@@ -1,6 +1,7 @@
 import React from "react";
 import { Collection, VictoryCommonProps } from "./index";
 import type { DomainPropType, ScaleXYPropType } from "../types/prop-types";
+import { Tuple } from "../../lib";
 
 // Private Functions
 
@@ -83,7 +84,7 @@ export function getSVGEventCoordinates(
 export function getDomainCoordinates(
   props: Pick<VictoryCommonProps, "scale" | "horizontal">,
   domain?: DomainPropType,
-): DomainPropType {
+): { x: Tuple<number>; y: Tuple<number> } {
   const { horizontal } = props;
   const scale = props.scale as ScaleXYPropType;
   // FIXME: add support for DomainTuple: [number, number]