fix(props): correcting more props

Adding readonly to props.
Making props optional if they have a default prop.

Author: markmcdowell

packages/charts/src/CanvasContainer.tsx

@@ -3,11 +3,11 @@ import * as React from "react";
 import { isDefined } from "./utils";
 
 interface CanvasContainerProps {
-    readonly width: number;
     readonly height: number;
+    readonly ratio: number;
     readonly type: string;
+    readonly width: number;
     readonly zIndex?: number;
-    readonly ratio: number;
 }
 
 class CanvasContainer extends React.Component<CanvasContainerProps> {

packages/charts/src/GenericChartComponent.tsx

@@ -52,7 +52,7 @@ class GenericChartComponent extends GenericComponent {
         this.preEvaluate = this.preEvaluate.bind(this);
     }
 
-    public preCanvasDraw(ctx, moreProps) {
+    public preCanvasDraw(ctx: CanvasRenderingContext2D, moreProps) {
 
         super.preCanvasDraw(ctx, moreProps);
 
@@ -83,7 +83,7 @@ class GenericChartComponent extends GenericComponent {
         }
     }
 
-    public postCanvasDraw(ctx, moreProps) {
+    public postCanvasDraw(ctx: CanvasRenderingContext2D, moreProps) {
         super.postCanvasDraw(ctx, moreProps);
         ctx.restore();
     }

packages/charts/src/GenericComponent.tsx

@@ -453,11 +453,11 @@ class GenericComponent extends React.Component<GenericComponentProps, GenericCom
         return (morePropsDecorator || identity)(moreProps);
     }
 
-    public preCanvasDraw(ctx, moreProps) {
+    public preCanvasDraw(ctx: CanvasRenderingContext2D, moreProps) {
         // do nothing
     }
 
-    public postCanvasDraw(ctx, moreProps) {
+    public postCanvasDraw(ctx: CanvasRenderingContext2D, moreProps) {
         // empty
     }
 

packages/charts/src/annotation/BackgroundText.tsx

@@ -66,7 +66,7 @@ class BackgroundText extends PureComponent<BackgroundTextProps> {
         );
     }
 
-    private readonly drawOnCanvas = (ctx, props, { interval }, getText) => {
+    private readonly drawOnCanvas = (ctx: CanvasRenderingContext2D, props, { interval }, getText) => {
         ctx.clearRect(-1, -1, ctx.canvas.width + 2, ctx.canvas.height + 2);
         ctx.save();
 

packages/charts/src/annotation/Label.tsx

@@ -54,7 +54,7 @@ export class Label extends React.Component<LabelProps> {
         );
     }
 
-    private readonly drawOnCanvas = (ctx, moreProps) => {
+    private readonly drawOnCanvas = (ctx: CanvasRenderingContext2D, moreProps) => {
         drawOnCanvas2(ctx, this.props, this.context, moreProps);
     }
 
@@ -77,7 +77,7 @@ function getYScale(chartConfig) {
     return Array.isArray(chartConfig) ? undefined : chartConfig.yScale;
 }
 
-function drawOnCanvas2(ctx, props, context, moreProps) {
+function drawOnCanvas2(ctx: CanvasRenderingContext2D, props, context, moreProps) {
     ctx.save();
 
     const { canvasOriginX, canvasOriginY, margin, ratio } = context;
@@ -96,7 +96,7 @@ function drawOnCanvas2(ctx, props, context, moreProps) {
 
 }
 
-function drawOnCanvas(ctx, props, moreProps) {
+function drawOnCanvas(ctx: CanvasRenderingContext2D, props, moreProps) {
     const { textAnchor, fontFamily, fontSize, opacity, rotate } = props;
     const { xScale, chartConfig, xAccessor } = moreProps;
 

packages/charts/src/axes/AxisLine.tsx

@@ -2,16 +2,16 @@ import * as React from "react";
 import { colorToRGBA, first, last } from "../utils";
 
 interface AxisLineProps {
-    className?: string;
-    shapeRendering?: string;
-    orient: string;
-    scale: any; // func
-    outerTickSize?: number;
-    fill?: string;
-    stroke?: string;
-    strokeWidth?: number;
-    opacity?: number;
-    range: number[];
+    readonly className?: string;
+    readonly shapeRendering?: string;
+    readonly orient: string;
+    readonly scale: any; // func
+    readonly outerTickSize?: number;
+    readonly fill?: string;
+    readonly stroke?: string;
+    readonly strokeWidth?: number;
+    readonly opacity?: number;
+    readonly range: number[];
 }
 
 export class AxisLine extends React.Component<AxisLineProps> {

packages/charts/src/axes/AxisTicks.tsx

@@ -26,7 +26,7 @@ interface TickProps {
 
 class Tick extends React.Component<TickProps> {
 
-    public static drawOnCanvasStatic = (tick, ctx, result) => {
+    public static drawOnCanvasStatic = (tick, ctx: CanvasRenderingContext2D, result) => {
         const { scale, tickTransform, canvas_dy, x, y, x2, y2, format } = result;
 
         const origin = tickTransform(scale, tick);
@@ -82,7 +82,7 @@ export class AxisTicks extends React.Component<AxisTicksProps> {
         tickStrokeOpacity: 1,
     };
 
-    public static drawOnCanvasStatic = (props, ctx, xScale, yScale) => {
+    public static drawOnCanvasStatic = (props, ctx: CanvasRenderingContext2D, xScale, yScale) => {
         props = { ...AxisTicks.defaultProps, ...props };
 
         const { orient } = props;

packages/charts/src/axes/AxisZoomCapture.tsx

@@ -19,30 +19,30 @@ import {
 } from "../utils";
 
 interface AxisZoomCaptureProps {
-    innerTickSize?: number;
-    outerTickSize?: number;
-    tickFormat?: any; // func
-    tickPadding?: number;
-    tickSize?: number;
-    ticks?: number;
-    tickValues?: number[];
-    showDomain?: boolean;
-    showTicks?: boolean;
-    className?: string;
-    axisZoomCallback?: any; // func
-    inverted?: boolean;
-    bg: {
+    readonly innerTickSize?: number;
+    readonly outerTickSize?: number;
+    readonly tickFormat?: any; // func
+    readonly tickPadding?: number;
+    readonly tickSize?: number;
+    readonly ticks?: number;
+    readonly tickValues?: number[];
+    readonly showDomain?: boolean;
+    readonly showTicks?: boolean;
+    readonly className?: string;
+    readonly axisZoomCallback?: any; // func
+    readonly inverted?: boolean;
+    readonly bg: {
         h: number;
         x: number;
         w: number;
         y: number;
     };
-    zoomCursorClassName?: string;
-    getMoreProps: any; // func
-    getScale: any; // func
-    getMouseDelta: any; // func
-    onDoubleClick: any; // func
-    onContextMenu: any; // func
+    readonly zoomCursorClassName?: string;
+    readonly getMoreProps: any; // func
+    readonly getScale: any; // func
+    readonly getMouseDelta: any; // func
+    readonly onDoubleClick: any; // func
+    readonly onContextMenu: any; // func
 }
 
 interface AxisZoomCaptureState {

packages/charts/src/coordinates/CrossHairCursor.tsx

@@ -66,7 +66,7 @@ export class CrossHairCursor extends React.Component<CrossHairCursorProps> {
         );
     }
 
-    private readonly drawOnCanvas = (ctx, moreProps) => {
+    private readonly drawOnCanvas = (ctx: CanvasRenderingContext2D, moreProps) => {
         const lines = this.helper(this.props, moreProps);
 
         if (lines !== undefined && isDefined(lines)) {

packages/charts/src/coordinates/CurrentCoordinate.tsx

@@ -29,7 +29,7 @@ export class CurrentCoordinate extends React.Component<CurrentCoordinateProps> {
         );
     }
 
-    private readonly drawOnCanvas = (ctx, moreProps) => {
+    private readonly drawOnCanvas = (ctx: CanvasRenderingContext2D, moreProps) => {
         const circle = this.helper(this.props, moreProps);
         if (!circle) { return null; }