react-spectrum: Missing attributes inside Button distribution

šŸ› Bug Report

Iā€™m working in our company monorepo and was adding some type checking to it. I initially thought it must be user error, but I dug a little deeper and noticed the types in the button distribution are missing imports. I can see they should be defined in (as they are in the repository), but in my node_modules they are not.

Hereā€™s what Iā€™m seeing inside node_modules/@react-aria/button/dist/types.d.ts:

import { ElementType, HTMLAttributes, RefObject } from "react";
import { AriaButtonProps, AriaToggleButtonProps } from "@react-types/button";
...
export function useButton(props: AriaButtonProps<'a'>, ref: RefObject<HTMLAnchorElement>): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;

tsc fails because of missing AnchorHTMLAttributes, this pattern repeats forButtonHTMLAttributes and alsoInputHTMLAttributes.

šŸ¤” Expected Behavior

Button.d.ts should be importing the missing attributes (my editor suggested the following): import {AnchorHTMLAttributes, ButtonHTMLAttributes, ElementType, HTMLAttributes, InputHTMLAttributes, RefObject } from "react";

šŸ˜Æ Current Behavior

They donā€™t exist, it is only happening inside Button which is interesting.

The error is self-explanatory but: ../../node_modules/@react-aria/button/dist/types.d.ts:11:108 - error TS2304: Cannot find name 'ButtonHTMLAttributes'.

šŸ’ Possible Solution

Whatever is generating the import needs adjusting.

šŸ”¦ Context

Working with tsc.

šŸ’» Code Sample

I double and tripled checked through this just to be certain.

I found a way to show the problem: If we download the tarball from NPM: https://registry.npmjs.org/@react-aria/button/-/button-3.3.0.tgz

Open up dist/types.d.ts, youā€™ll see the missing imports.

šŸŒ Your Environment

Software Version(s)
react-aria ^3.1.1
Browser N/A
Operating System Mac

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 11
  • Comments: 18 (12 by maintainers)

Most upvoted comments

This should be released with todayā€™s release, let us know if the issue still occurs. Iā€™ve looked at the https://registry.npmjs.org/@react-aria/button/-/button-3.4.0.tgz tarball myself and verified that AnchorHTMLAttributes, ButtonHTMLAttributes, and InputHTMLAttributes now exist in the dist/types.d.ts.

Yep, itā€™s still in there. Our automated release script didnā€™t notice because it wasnā€™t a code change and we humans forgot about it. Iā€™ve been working on a script to catch this is the future. Weā€™ll have it in our next release.

Ah, weā€™re probably missing these because we have to use --skipLibcheck in some other contexts. Seems reasonable. Weā€™re focused on a pretty big issue with pointer events this week, so soonest weā€™d probably look at this is next week, just to set expectations.

Hopefully we can make some progress on this in December

Iā€™ve opened a PR that should fix this on Parcelā€™s end. I see that this repo hasnā€™t been keeping up with the nightlies and still has patches for parcelā€™s library code. Should I update the patch for @parcel/transformer-typescript-types in a separate PR here or should we attempt to move to a more recent version of parcel?

I took a deep look into this - the problem is in Parcel, and Iā€™ve tracked down the issue to here: https://github.com/parcel-bundler/parcel/blob/v2/packages/transformers/typescript-types/src/TSModule.js#L39-L44

If you set a breakpoint there, youā€™ll see that the node for useButton is overwritten for each declaration. @devongovett sorry to tag you here, is this something youā€™d be able to look at? I havenā€™t gotten very far into learning TypeScriptā€™s compiler API but Iā€™m slowly working towards a fix.

Is there an updated estimate on this? Weā€™re using react-aria to build a component library at our company, and this is causing issues for our consumers who donā€™t want to use --skipLibCheck. Weā€™d also rather not downgrade @react-aria/button or react-aria (which depends on @react-aria/button@^3.3.2).