Expose the Typescript Types 🙏

[majelbstoat]

Do you want to request a feature or report a bug?

request a feature

What is the current behaviour?

Many of the types are not exposed, so if I want to write, for example a strongly typed label function, i believe i have to duplicate the types. e.g.

type DataEntry = {
  title?: string | number
  value: number
  color: string
  percentage?: number
  filterId?: string
}
type Data = DataEntry[]

type LabelProps = {
  data: Data
  dataIndex: number
}

const label = ({ data, dataIndex }: LabelProps) => {
  const percentage = data[dataIndex].percentage
  if (!percentage || percentage < 10) return ''
  return Math.round(data[dataIndex].percentage || 0) + '%'
}

(This example from 7.3.1, but persists in the newest version too)

What is the expected behaviour?

Please export what is now called LabelRenderProps :)

[toomuchdesign]

Hi @majelbstoat,
I'd expect 2 solutions to be currently available.

First, in case label function is inlined (as a jsx prop) the provided function should already receive a full type check.

In case you wanted to declare a standalone function then you might extract components' prop types like:

import React from 'react';
import { PieChart } from 'react-minimal-pie-chart';

type LabelProp = React.ComponentProps<typeof PieChart>['label']
const label: LabelProp = //...

More info about accessing React components' props here.

[toomuchdesign]

Hi @majelbstoat,
what's the current status of this?

[bryanltobing]

any update on this ?

[majelbstoat]

I went and tried that approach, and it didn't immediately work for me, though I don't exactly recall why right now. It really would be very nice if you could just add an export or two ;)

[toomuchdesign]

I'll consider it as soon as I have time to do so 👍 In the meanwhile I confirm the mentioned approach works in a CodeSandbox repro.

[toomuchdesign]

Might be a bit harder than originally thought:
https://react-typescript-cheatsheet.netlify.app/docs/basic/getting-started/default_props/#consuming-props-of-a-component-with-defaultprops

If we can't find a proper TS workaround, we might consider removing component's defaultProps.

[toomuchdesign]

Implemented in v8.4.0. Prop types exposed as:

import type { PieChartProps } from 'react-minimal-pie-chart';