Implement TypeScript types

package.json

@@ -13,7 +13,9 @@
   },
   "main": "dist/react-map-gl-cluster.cjs.js",
   "module": "dist/react-map-gl-cluster.esm.js",
+  "types": "src/index.d.ts",
   "files": [
+    "src/index.d.ts",
     "dist"
   ],
   "scripts": {
@@ -45,6 +47,8 @@
     "@babel/preset-flow": "^7.9.0",
     "@babel/preset-react": "^7.9.4",
     "@turf/random": "^6.0.2",
+    "@types/react": "^16.9.56",
+    "@types/supercluster": "^5.0.3",
     "@urbica/react-map-gl": "^1.13.0",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",

src/index.d.ts

@@ -0,0 +1,74 @@
+/* eslint-disable react/no-unused-prop-types */
+/* eslint-disable flowtype/no-types-missing-file-annotation */
+import { Component, PureComponent } from 'react'
+import Supercluster from 'supercluster'
+
+export type SuperclusterFeature = {
+  type: 'Feature',
+  id: number,
+  properties: {
+    cluster: true,
+    cluster_id: number,
+    point_count: number,
+    point_count_abbreviated: string | number
+  },
+  geometry: {
+    type: 'Point',
+    coordinates: [number, number]
+  }
+};
+
+export type ClusterComponentProps = {
+  longitude: number,
+  latitude: number,
+  clusterId: number,
+  pointCount: number,
+  pointCountAbbreviated: string | number
+};
+
+export type ClusterMapFunction = (props: Record<string, any>) => any;
+
+export type ClusterReduceFunction = (
+  accumulated: Record<string, any>,
+  props: Record<string, any>,
+) => void;
+
+export type ClusterComponent = Component<ClusterComponentProps, any>
+  | React.FC<ClusterComponentProps>
+
+
+type Props = {
+  /** Minimum zoom level at which clusters are generated */
+  minZoom?: number,
+
+  /** Maximum zoom level at which clusters are generated */
+  maxZoom?: number,
+
+  /** Cluster radius, in pixels */
+  radius?: number,
+
+  /** (Tiles) Tile extent. Radius is calculated relative to this value */
+  extent?: number,
+
+  /** Size of the KD-tree leaf node. Affects performance */
+  nodeSize?: number,
+
+  /**
+   * A function that returns cluster properties
+   * corresponding to a single point.
+   *  */
+  // eslint-disable-next-line react/no-unused-prop-types
+  map?: ClusterMapFunction,
+
+  /** A reduce function that merges properties of two clusters into one. */
+  // eslint-disable-next-line react/no-unused-prop-types
+  reduce?: ClusterReduceFunction,
+
+  /** React Component for rendering Cluster */
+  component: ClusterComponent,
+}
+
+
+export default class Cluster extends PureComponent<Props, any> {
+  getCluster(): Supercluster
+}