Fix Ill-defined Definitions of Class/Interface (#23222)

* Fix Ill-defined Definitions of Class/Interface

+ The Label was ill-defined and didn't reflect the latest implementation
+ NOTE: this will cause breaking changes for any project that consumes the Label.
  + The `Label` is redefined as the concrete class so that *<Label />* can be used in JSX
  + The `LabelProps` is redefined as what old interface `Label` was.

* PR Updates

+ remove undocumented static methods.

* + Update recharts-tests.tsx

* + Remove unused type `parseViewBoxArgs`

types/recharts/index.d.ts

@@ -161,7 +161,7 @@ export interface AreaProps extends EventAttributes, Partial<PresentationAttribut
     connectNulls?: boolean;
     activeDot?: boolean | object | React.ReactElement<any> | ContentRenderer<any>;
     dot?: boolean | object | React.ReactElement<any> | ContentRenderer<DotProps>;
-    label?: boolean | object | React.ReactElement<any> | Label['content'];
+    label?: boolean | object | React.ReactElement<any> | LabelProps['content'];
     hide?: boolean;
     layout?: LayoutType;
     baseLine?: number | any[];
@@ -399,7 +399,7 @@ export interface LineProps extends EventAttributes, Partial<PresentationAttribut
     width?: number;
     height?: number;
     dataKey: string | number; // As the source code states, dataKey will replace valueKey in 1.1.0 and it'll be required (it's already required in current implementation).
-    label?: boolean | object | React.ReactElement<any> | Label['content'];
+    label?: boolean | object | React.ReactElement<any> | LabelProps['content'];
     points?: Point[];
 }
 
@@ -432,7 +432,7 @@ export interface PieProps extends EventAttributes, Partial<PresentationAttribute
     labelLine?: object | ContentRenderer<LineProps & any> | React.ReactElement<any> | boolean;
     label?: {
         offsetRadius: number;
-    } | Label['content'] | React.ReactElement<any> | boolean;
+    } | LabelProps['content'] | React.ReactElement<any> | boolean;
     activeShape?: object |ContentRenderer<any> | React.ReactElement<any>;
     activeIndex?: number | number[];
 }
@@ -547,7 +547,7 @@ export interface RadarProps extends EventAttributes, Partial<PresentationAttribu
     shape?: React.ReactElement<any> | ContentRenderer<RadarProps>;
     activeDot?: object | React.ReactElement<any> | ContentRenderer<any> | boolean;
     dot?: object | React.ReactElement<any> | ContentRenderer<DotProps> | boolean;
-    label?: object | React.ReactElement<any> | Label['content'] | boolean;
+    label?: object | React.ReactElement<any> | LabelProps['content'] | boolean;
     legendType?: LegendType;
     hide?: boolean;
 }
@@ -586,7 +586,7 @@ export interface RadialBarProps extends EventAttributes, Partial<PresentationAtt
     maxBarSize?: number;
     data?: RadialBarData[];
     legendType?: LegendType;
-    label?: boolean | React.ReactElement<any> | Label['content'] | object;
+    label?: boolean | React.ReactElement<any> | LabelProps['content'] | object;
     background?: boolean | React.ReactElement<any> | ContentRenderer<any> | object;
     hide?: boolean;
 }
@@ -821,22 +821,16 @@ export interface TreemapProps extends EventAttributes, Animatable {
 
 export class Treemap extends React.Component<TreemapProps> { }
 
-export interface Label {
-    className?: string;
+export class Label extends React.Component<LabelProps> { }
+
+export interface LabelProps {
     viewBox?: ViewBox | PolarViewBox;
     formatter?: LabelFormatter;
-    value: string | number;
+    value?: number | string;
     offset?: number;
     position?: PositionType;
     children?: React.ReactNode[] | React.ReactNode;
-    content?: React.ReactElement<any> | ContentRenderer<Label>;
-}
-
-export interface LabelProps extends ViewBox {
-    index: number;
-    value: string | number;
-    offset?: number;
-    viewBox: ViewBox;
+    className?: string;
     content?: React.ReactElement<any> | ContentRenderer<Label>;
 }
 

types/recharts/recharts-tests.tsx

@@ -1,7 +1,11 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 
-import { CartesianGrid, Line, LineChart, PieChart, Pie, Sector, XAxis, YAxis, Tooltip, ReferenceLine, ReferenceArea, ResponsiveContainer } from 'recharts';
+import {
+    CartesianGrid, Line, LineChart, PieChart, Pie,
+    Sector, XAxis, YAxis, Tooltip, ReferenceLine,
+    ReferenceArea, ResponsiveContainer, Label
+} from 'recharts';
 
 interface ComponentState {
     activeIndex: number;
@@ -84,8 +88,12 @@ class Component extends React.Component<{}, ComponentState> {
         return (
             <ResponsiveContainer>
                 <LineChart width={500} height={300} data={data}>
-                    <XAxis dataKey="name" />
-                    <YAxis />
+                    <XAxis dataKey="name">
+                        <Label>X axis - name</Label>
+                    </XAxis>
+                    <YAxis>
+                        <Label>Y axis</Label>
+                    </YAxis>
                     <CartesianGrid stroke="#eee" strokeDasharray="5 5" />
                     <Line type="monotone" dataKey="uv" stroke="#8884d8" onClick={ this.clickHandler } />
                     <Line type="monotone" dataKey="pv" stroke="#82ca9d" />
@@ -110,7 +118,9 @@ class Component extends React.Component<{}, ComponentState> {
                         innerRadius={60}
                         outerRadius={80}
                         fill="#8884d8"
-                    />
+                    >
+                        <Label>A Pie Chart</Label>
+                    </Pie>
                 </PieChart>
             </ResponsiveContainer>
         );