Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Label: `angle` prop is rejected by TypeScript

See original GitHub issue

I have searched the issues of this repository and believe that this is not a duplicate. A fix for https://github.com/recharts/recharts/issues/2128 was already released but does not fix angle on Label

Reproduction link

Steps to reproduce

<YAxis stroke="black">
  <Label
    angle={270}
    position="left"
    style={{
      textAnchor: 'middle',
      fill: "black",
    }}
  >
    Sales ($)
  </Label>
</YAxis>

What is expected?

angle is accepted by TypeScript.

What is actually happening?

“Property angle does not exist on type …”

The rendered label is rotated. This is purely an issue at the type level.

Environment	Info
Recharts	v2.0.3
React	16.14.0
System	Ubuntu 20.04
Browser	Chrome 87

Update: Use real-world example by default since an isolated usage of <Label /> was confusing.

Issue Analytics

State:
Created 3 years ago
Reactions:1
Comments:8 (3 by maintainers)

Top GitHub Comments

3reactions

eps1loncommented, Jan 19, 2021

A standalone label component has no interface to an angle prop though. You’ll instead want to use a Text component if you’re attempting to create some kind of standalone text.

I don’t want to use a Text component since I’m using the Label inside an axis component. The Label inside an Axis does implement the angle prop but TypeScript is rejecting that prop. Does this clarify the issue for you?

2reactions

nicolajkirchhofcommented, Jan 26, 2021

Me too. Currently I’m just ignoring the error with ‘// @ts-ignore’ and are happy that its still works as expected.

Top Results From Across the Web

Reject parameters in a function that have specific type in a prop

The safer option for TS is to disallow using onPressIcon until you check the type property. type TextInput = { type: 'password'; ...

TypeScript errors and how to fix them

A list of common TypeScript errors and how to fix them.

Angular unit testing tutorial with examples - LogRocket Blog

This tutorial demonstrates how to build an Angular app and write a unit test, test an async operator, and automatically generate a unit ......

Media Capture and Streams - W3C

This document defines a set of JavaScript APIs that allow local media, including audio and video, to be requested from a platform.

Node.js v19.3.0 Documentation

profileEnd([label]); console. ... node:crypto module methods and properties ... rawListeners(eventName); emitter[Symbol.for('nodejs.rejection')](err, ...