diff --git a/package.json b/package.json index 2dd5bec..dde8489 100644 --- a/package.json +++ b/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", diff --git a/src/index.d.ts b/src/index.d.ts new file mode 100644 index 0000000..f46e217 --- /dev/null +++ b/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) => any; + +export type ClusterReduceFunction = ( + accumulated: Record, + props: Record, +) => void; + +export type ClusterComponent = Component + | React.FC + + +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 { + getCluster(): Supercluster +}