Skip to content

TypeScript: DefaultProps fields incorrectly required in Props type #263

@SheaJanke

Description

@SheaJanke

Description

In react-resizable@4.0.1, the bundled TypeScript types in build/propTypes.d.ts define Props as DefaultProps & { ... }, which makes all DefaultProps fields (axis, handleSize, lockAspectRatio, minConstraints, maxConstraints, resizeHandles, transformScale) required.

These props all have runtime defaults and should be optional. The previous @types/react-resizable (DefinitelyTyped) correctly modeled them as optional.

Reproduction

import { ResizableBox } from 'react-resizable';

// TS Error: Type '{ children: Element; width: number; height: number; }'
// is missing the following properties from type 'Readonly<ResizableBoxProps>':
// axis, handleSize, lockAspectRatio, minConstraints, and 3 more.
<ResizableBox width={800} height={350}>
  <div>content</div>
</ResizableBox>

This worked in previous versions when types came from @types/react-resizable. Since v4.0.1 ships its own types (via "types": "./build/index.d.ts" in package.json), TypeScript resolves the bundled types and @types/react-resizable is ignored.

Root cause

In build/propTypes.d.ts:

export type Props = DefaultProps & {
  children: React.ReactElement<any>;
  // ...
};

DefaultProps contains fields that all have runtime defaults, but the intersection makes them required at the type level.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions