fix(react): restore intrinsic HTML props under React 19 types

`React.PropsWithRef<JSX.IntrinsicElements['x']>` relied on the global
`JSX` namespace, which @types/react@19 no longer augments. Under React
19 the type collapsed to `any`, silently dropping `onClick`, `type`,
`disabled`, `aria-*`, `children`, etc. from every affected component.

Replaced with `React.ComponentProps<'x'>` /
`React.ComponentPropsWithoutRef<'x'>` across ~60 type files. Works on
React 18 and 19.

Fixes #120.

Author: wangdicoder

.changeset/react-19-types-compat.md

@@ -0,0 +1,5 @@
+---
+'@tiny-design/react': patch
+---
+
+Fix TypeScript compatibility with React 19. Component prop interfaces used the pattern `React.PropsWithRef<JSX.IntrinsicElements['x']>`, which relied on a globally-augmented `JSX` namespace that `@types/react@19` no longer provides. The resolved prop types collapsed to `any`, silently dropping every intrinsic HTML attribute (`onClick`, `type`, `disabled`, `aria-*`, `children`, etc.) for consumers on React 19. Replaced the pattern with `React.ComponentProps<'x'>` / `React.ComponentPropsWithoutRef<'x'>` across ~60 component type files. Works on React 18 and 19.

packages/react/src/alert/types.ts

@@ -5,7 +5,7 @@ export type AlertType = 'success' | 'info' | 'warning' | 'error';
 
 export interface AlertProps
   extends BaseProps,
-    Omit<React.PropsWithoutRef<JSX.IntrinsicElements['div']>, 'title'> {
+    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {
   /** alert title */
   title?: string | ReactNode;
 

packages/react/src/anchor/types.ts

@@ -12,7 +12,7 @@ export interface AnchorProps extends BaseProps {
   children?: React.ReactNode;
 }
 
-export interface AnchorLinkProps extends BaseProps, React.PropsWithRef<JSX.IntrinsicElements['a']> {
+export interface AnchorLinkProps extends BaseProps, React.ComponentProps<'a'> {
   href: string;
   title: string;
   children?: React.ReactElement<AnchorLinkProps>[];

packages/react/src/aspect-ratio/types.ts

@@ -3,7 +3,7 @@ import { BaseProps } from '../_utils/props';
 
 export interface AspectRatioProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['div']> {
+    React.ComponentPropsWithoutRef<'div'> {
   /** the width of the content */
   width?: number | string;
 

packages/react/src/avatar/types.ts

@@ -6,7 +6,7 @@ export type AvatarPresence = 'online' | 'busy' | 'away' | 'offline';
 
 export interface AvatarProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['span']> {
+    React.ComponentPropsWithoutRef<'span'> {
   /** use an icon */
   icon?: React.ReactNode;
 
@@ -28,7 +28,7 @@ export interface AvatarProps
 
 export interface AvatarGroupProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['span']> {
+    React.ComponentPropsWithoutRef<'span'> {
   /** the distance between two avatars */
   gap: number | string;
 }

packages/react/src/badge/types.ts

@@ -3,7 +3,7 @@ import { BaseProps } from '../_utils/props';
 
 export interface BadgeProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['span']> {
+    React.ComponentPropsWithoutRef<'span'> {
   /** the number to show in badge */
   count?: React.ReactNode;
 

packages/react/src/breadcrumb/types.ts

@@ -3,14 +3,14 @@ import { BaseProps } from '../_utils/props';
 
 export interface BreadcrumbProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['nav']> {
+    React.ComponentPropsWithoutRef<'nav'> {
   separator?: React.ReactNode;
   children: ReactElement<BreadcrumbItemProps> | ReactElement<BreadcrumbItemProps>[];
 }
 
 export interface BreadcrumbItemProps
   extends BaseProps,
-    React.PropsWithoutRef<JSX.IntrinsicElements['li']> {
+    React.ComponentPropsWithoutRef<'li'> {
   separator?: React.ReactNode;
   children?: React.ReactNode;
 }

packages/react/src/button/types.ts

@@ -12,7 +12,7 @@ export type ButtonIconPosition = 'start' | 'end';
 export type ButtonGroupInheritMode = 'fill' | 'override' | 'none';
 
 export interface ButtonProps
-  extends BaseProps, React.PropsWithRef<JSX.IntrinsicElements['button']> {
+  extends BaseProps, React.ComponentProps<'button'> {
   variant?: ButtonVariant;
   color?: ButtonColor;
   loading?: boolean;
@@ -27,7 +27,7 @@ export interface ButtonProps
 }
 
 export interface ButtonGroupProps
-  extends BaseProps, React.PropsWithRef<JSX.IntrinsicElements['div']> {
+  extends BaseProps, React.ComponentProps<'div'> {
   variant?: ButtonVariant;
   color?: ButtonColor;
   size?: SizeType;

packages/react/src/calendar/types.ts

@@ -7,7 +7,7 @@ export type SelectionMode = 'single' | 'range' | 'multiple';
 
 export interface CalendarProps
   extends BaseProps,
-    Omit<React.PropsWithoutRef<JSX.IntrinsicElements['div']>, 'onChange' | 'onSelect' | 'defaultValue'> {
+    Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange' | 'onSelect' | 'defaultValue'> {
   /** Selected date (controlled, single mode) */
   defaultValue?: Date;
   /** Controlled selected date */

packages/react/src/card/types.ts

@@ -3,14 +3,14 @@ import { BaseProps } from '../_utils/props';
 
 export type CardVariant = 'outlined' | 'elevated' | 'filled';
 
-export interface CardContentProps extends React.PropsWithoutRef<JSX.IntrinsicElements['div']> {
+export interface CardContentProps extends React.ComponentPropsWithoutRef<'div'> {
   prefixCls?: string;
   children: ReactNode;
 }
 
 export interface CardProps
   extends BaseProps,
-    Omit<React.PropsWithoutRef<JSX.IntrinsicElements['div']>, 'title'> {
+    Omit<React.ComponentPropsWithoutRef<'div'>, 'title'> {
   title?: ReactNode;
   extra?: ReactNode;
   /** Card surface style */