Bug: Element Modal doesn't have required attribute ...

[NikooDev]

Environment

System:
OS: macOS 13.3.1
CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
Memory: 151.03 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
Watchman: 2023.05.01.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.12.1 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.4, iOS 16.4, macOS 13.3, tvOS 16.4, watchOS 9.4
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 14.3/14E222b - /usr/bin/xcodebuild
Languages:
Java: 20.0.1 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: ^18.2.0 => 18.2.0
react-native: ^0.71.7 => 0.71.7
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Platforms

iOS

Versions

react-native-modal@13.0.1

Description

I have an error for 60 props : Element Modal doesn't have required attribute ...
In the modal.d.ts file, on lines 68 to 106, the propTypes have the value: PropTypes.Requireable<...>

Thanks

[adamaveray]

This is resolved in #614 which was opened in Oct 2021 so I'm not optimistic it'll get merged any time soon.

As a workaround adding the following module augmentation file (within a directory specified in your tsconfig.json's compilerOptions.typeRoots list – see the docs) will resolve the all-props-are-required type issues:

// react-native-modal.d.ts
import type React from 'react';
import type { ModalProps } from 'react-native-modal';

declare module 'react-native-modal' {
    const Modal: React.ClassicComponentClass<Partial<ModalProps> & { children: ModalProps['children'] }>;
    export default Modal;
}

[juanch0x]

This is resolved in #614 which was opened in Oct 2021 so I'm not optimistic it'll get merged any time soon.

As a workaround adding the following module augmentation file (within a directory specified in your tsconfig.json's compilerOptions.typeRoots list – see the docs) will resolve the all-props-are-required type issues:

// react-native-modal.d.ts
import type React from 'react';
import type { ModalProps } from 'react-native-modal';

declare module 'react-native-modal' {
    const Modal: React.ClassicComponentClass<Partial<ModalProps> & { children: ModalProps['children'] }>;
    export default Modal;
}

Thanks, you save my life!

I rewrite it without the 2024 deprecated clases

// react-native-modal.d.ts
import React from 'react';
import type { ModalProps } from 'react-native-modal';

type PartialProps = Partial<ModalProps> & {
  children: ModalProps['children'];
};

declare module 'react-native-modal' {
  const Modal: (Props: PartialProps) => React.ReactNode;
  export default Modal;
}