@uppy/react: remove `prop-types` dependency (#5031)

packages/@uppy/dashboard/src/Dashboard.tsx

@@ -176,7 +176,6 @@ export type DashboardOptions<
 > = DashboardMiscOptions<M, B> &
   (DashboardModalOptions | DashboardInlineOptions)
 
-// set default options, must be kept in sync with packages/@uppy/react/src/DashboardModal.js
 const defaultOptions = {
   target: 'body',
   metaFields: [],

packages/@uppy/drag-drop/src/DragDrop.tsx

@@ -24,7 +24,6 @@ export interface DragDropOptions extends UIPluginOptions {
   onDrop?: (event: DragEvent) => void
 }
 
-// Default options, must be kept in sync with @uppy/react/src/DragDrop.js.
 const defaultOptions = {
   inputName: 'files[]',
   width: '100%',

packages/@uppy/file-input/src/FileInput.tsx

@@ -14,7 +14,6 @@ export interface FileInputOptions extends UIPluginOptions {
   pretty?: boolean
   inputName?: string
 }
-// Default options, must be kept in sync with @uppy/react/src/FileInput.js.
 const defaultOptions = {
   pretty: true,
   inputName: 'files[]',

packages/@uppy/react/package.json

@@ -21,8 +21,7 @@
     "url": "git+https://github.com/transloadit/uppy.git"
   },
   "dependencies": {
-    "@uppy/utils": "workspace:^",
-    "prop-types": "^15.6.1"
+    "@uppy/utils": "workspace:^"
   },
   "devDependencies": {
     "@types/react": "^18.0.8",

packages/@uppy/react/src/Dashboard.ts

@@ -1,16 +1,8 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import type { UnknownPlugin, Uppy } from '@uppy/core'
 import DashboardPlugin from '@uppy/dashboard'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
 import type { DashboardOptions } from '@uppy/dashboard'
-import {
-  locale,
-  uppy as uppyPropType,
-  plugins,
-  metaFields,
-  cssSize,
-} from './propTypes.ts'
 import getHTMLProps from './getHTMLProps.ts'
 import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.ts'
 
@@ -33,26 +25,6 @@ export interface DashboardProps<M extends Meta, B extends Body>
 class Dashboard<M extends Meta, B extends Body> extends Component<
   DashboardProps<M, B>
 > {
-  static propsTypes = {
-    uppy: uppyPropType,
-    disableInformer: PropTypes.bool,
-    disableStatusBar: PropTypes.bool,
-    disableThumbnailGenerator: PropTypes.bool,
-    height: cssSize,
-    hideProgressAfterFinish: PropTypes.bool,
-    hideUploadButton: PropTypes.bool,
-    locale,
-    metaFields,
-    note: PropTypes.string,
-    plugins,
-    proudlyDisplayPoweredByUppy: PropTypes.bool,
-    showProgressDetails: PropTypes.bool,
-    width: cssSize,
-    // pass-through to ThumbnailGenerator
-    thumbnailType: PropTypes.string,
-    thumbnailWidth: PropTypes.number,
-  }
-
   private container: HTMLElement
 
   private plugin: UnknownPlugin<M, B>

packages/@uppy/react/src/DashboardModal.ts

@@ -1,15 +1,7 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import DashboardPlugin, { type DashboardOptions } from '@uppy/dashboard'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
 import type { Uppy } from '@uppy/core'
-import {
-  cssSize,
-  locale,
-  metaFields,
-  plugins,
-  uppy as uppyPropType,
-} from './propTypes.ts'
 import getHTMLProps from './getHTMLProps.ts'
 import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.ts'
 
@@ -22,8 +14,8 @@ type DashboardInlineOptions<M extends Meta, B extends Body> = Omit<
 export interface DashboardModalProps<M extends Meta, B extends Body>
   extends DashboardInlineOptions<M, B> {
   uppy: Uppy<M, B>
-  onRequestClose: () => void
-  open: boolean
+  onRequestClose?: () => void
+  open?: boolean
 }
 
 /**
@@ -34,87 +26,8 @@ export interface DashboardModalProps<M extends Meta, B extends Body>
 class DashboardModal<M extends Meta, B extends Body> extends Component<
   DashboardModalProps<M, B>
 > {
-  static propTypes = {
-    uppy: uppyPropType.isRequired,
-    target:
-      typeof window !== 'undefined' ?
-        PropTypes.instanceOf(window.HTMLElement)
-      : PropTypes.any,
-    open: PropTypes.bool,
-    onRequestClose: PropTypes.func,
-    closeModalOnClickOutside: PropTypes.bool,
-    disablePageScrollWhenModalOpen: PropTypes.bool,
-    plugins,
-    width: cssSize,
-    height: cssSize,
-    showProgressDetails: PropTypes.bool,
-    note: PropTypes.string,
-    metaFields,
-    proudlyDisplayPoweredByUppy: PropTypes.bool,
-    autoOpenFileEditor: PropTypes.bool,
-    animateOpenClose: PropTypes.bool,
-    browserBackButtonClose: PropTypes.bool,
-    closeAfterFinish: PropTypes.bool,
-    disableStatusBar: PropTypes.bool,
-    disableInformer: PropTypes.bool,
-    disableThumbnailGenerator: PropTypes.bool,
-    disableLocalFiles: PropTypes.bool,
-    disabled: PropTypes.bool,
-    hideCancelButton: PropTypes.bool,
-    hidePauseResumeButton: PropTypes.bool,
-    hideProgressAfterFinish: PropTypes.bool,
-    hideRetryButton: PropTypes.bool,
-    hideUploadButton: PropTypes.bool,
-    showLinkToFileUploadResult: PropTypes.bool,
-    showRemoveButtonAfterComplete: PropTypes.bool,
-    showSelectedFiles: PropTypes.bool,
-    waitForThumbnailsBeforeUpload: PropTypes.bool,
-    fileManagerSelectionType: PropTypes.string,
-    theme: PropTypes.string,
-    // pass-through to ThumbnailGenerator
-    thumbnailType: PropTypes.string,
-    thumbnailWidth: PropTypes.number,
-    locale,
-  }
-
-  // Must be kept in sync with @uppy/dashboard/src/Dashboard.jsx.
   static defaultProps = {
-    metaFields: [],
-    plugins: [],
-    width: 750,
-    height: 550,
-    thumbnailWidth: 280,
-    thumbnailType: 'image/jpeg',
-    waitForThumbnailsBeforeUpload: false,
-    showLinkToFileUploadResult: false,
-    showProgressDetails: false,
-    hideUploadButton: false,
-    hideCancelButton: false,
-    hideRetryButton: false,
-    hidePauseResumeButton: false,
-    hideProgressAfterFinish: false,
-    note: null,
-    closeModalOnClickOutside: false,
-    closeAfterFinish: false,
-    disableStatusBar: false,
-    disableInformer: false,
-    disableThumbnailGenerator: false,
-    disablePageScrollWhenModalOpen: true,
-    animateOpenClose: true,
-    fileManagerSelectionType: 'files',
-    proudlyDisplayPoweredByUppy: true,
-    showSelectedFiles: true,
-    showRemoveButtonAfterComplete: false,
-    browserBackButtonClose: false,
-    theme: 'light',
-    autoOpenFileEditor: false,
-    disabled: false,
-    disableLocalFiles: false,
-
-    // extra
     open: undefined,
-    target: undefined,
-    locale: null,
     onRequestClose: undefined,
   }
 

packages/@uppy/react/src/DragDrop.ts

@@ -1,9 +1,7 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import type { UnknownPlugin, Uppy } from '@uppy/core'
 import DragDropPlugin, { type DragDropOptions } from '@uppy/drag-drop'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
-import * as propTypes from './propTypes.ts'
 import getHTMLProps from './getHTMLProps.ts'
 import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.ts'
 
@@ -20,24 +18,6 @@ interface DragDropProps<M extends Meta, B extends Body>
 class DragDrop<M extends Meta, B extends Body> extends Component<
   DragDropProps<M, B>
 > {
-  static propTypes = {
-    uppy: propTypes.uppy.isRequired,
-    locale: propTypes.locale,
-    inputName: PropTypes.string,
-    width: PropTypes.string,
-    height: PropTypes.string,
-    note: PropTypes.string,
-  }
-
-  // Must be kept in sync with @uppy/drag-drop/src/DragDrop.jsx.
-  static defaultProps = {
-    locale: null,
-    inputName: 'files[]',
-    width: '100%',
-    height: '100%',
-    note: null,
-  }
-
   private container: HTMLElement
 
   private plugin: UnknownPlugin<M, B>

packages/@uppy/react/src/FileInput.ts

@@ -1,10 +1,8 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import type { UnknownPlugin, Uppy } from '@uppy/core'
 import FileInputPlugin from '@uppy/file-input'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
 import type { Locale } from '@uppy/utils/lib/Translator'
-import * as propTypes from './propTypes.ts'
 
 interface FileInputProps<M extends Meta, B extends Body> {
   uppy: Uppy<M, B>
@@ -21,13 +19,6 @@ interface FileInputProps<M extends Meta, B extends Body> {
 class FileInput<M extends Meta, B extends Body> extends Component<
   FileInputProps<M, B>
 > {
-  static propTypes = {
-    uppy: propTypes.uppy.isRequired,
-    locale: propTypes.locale,
-    pretty: PropTypes.bool,
-    inputName: PropTypes.string,
-  }
-
   // Must be kept in sync with @uppy/file-input/src/FileInput.jsx
   static defaultProps = {
     locale: undefined,

packages/@uppy/react/src/ProgressBar.ts

@@ -1,16 +1,13 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import type { UnknownPlugin, Uppy } from '@uppy/core'
-import ProgressBarPlugin from '@uppy/progress-bar'
+import ProgressBarPlugin, { type ProgressBarOptions } from '@uppy/progress-bar'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
-import { uppy as uppyPropType } from './propTypes.ts'
 import getHTMLProps from './getHTMLProps.ts'
 import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.ts'
 
-interface ProgressBarProps<M extends Meta, B extends Body> {
+interface ProgressBarProps<M extends Meta, B extends Body>
+  extends ProgressBarOptions {
   uppy: Uppy<M, B>
-  fixed?: boolean
-  hideAfterFinish?: boolean
 }
 
 /**
@@ -20,18 +17,6 @@ interface ProgressBarProps<M extends Meta, B extends Body> {
 class ProgressBar<M extends Meta, B extends Body> extends Component<
   ProgressBarProps<M, B>
 > {
-  static propTypes = {
-    uppy: uppyPropType.isRequired,
-    fixed: PropTypes.bool,
-    hideAfterFinish: PropTypes.bool,
-  }
-
-  // Must be kept in sync with @uppy/progress-bar/src/ProgressBar.jsx
-  static defaultProps = {
-    fixed: false,
-    hideAfterFinish: true,
-  }
-
   private container: HTMLElement
 
   private plugin: UnknownPlugin<M, B>

packages/@uppy/react/src/StatusBar.ts

@@ -1,9 +1,7 @@
 import { createElement as h, Component } from 'react'
-import PropTypes from 'prop-types'
 import type { UnknownPlugin, Uppy } from '@uppy/core'
 import StatusBarPlugin, { type StatusBarOptions } from '@uppy/status-bar'
 import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
-import { uppy as uppyPropType } from './propTypes.ts'
 import getHTMLProps from './getHTMLProps.ts'
 import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.ts'
 
@@ -20,28 +18,6 @@ interface StatusBarProps<M extends Meta, B extends Body>
 class StatusBar<M extends Meta, B extends Body> extends Component<
   StatusBarProps<M, B>
 > {
-  static propTypes = {
-    uppy: uppyPropType.isRequired,
-    hideUploadButton: PropTypes.bool,
-    hideRetryButton: PropTypes.bool,
-    hidePauseResumeButton: PropTypes.bool,
-    hideCancelButton: PropTypes.bool,
-    showProgressDetails: PropTypes.bool,
-    hideAfterFinish: PropTypes.bool,
-    doneButtonHandler: PropTypes.func,
-  }
-
-  // Must be kept in sync with @uppy/status-bar/src/StatusBar.jsx.
-  static defaultProps = {
-    hideUploadButton: false,
-    hideRetryButton: false,
-    hidePauseResumeButton: false,
-    hideCancelButton: false,
-    showProgressDetails: false,
-    hideAfterFinish: true,
-    doneButtonHandler: null,
-  }
-
   private container: HTMLElement
 
   private plugin: UnknownPlugin<M, B>

packages/@uppy/react/src/propTypes.ts

@@ -1,30 +0,0 @@
-import PropTypes from 'prop-types'
-import { Uppy as UppyCore } from '@uppy/core'
-
-// The `uppy` prop receives the Uppy core instance.
-const uppy = PropTypes.instanceOf(UppyCore)
-
-// A list of plugins to mount inside this component.
-const plugins = PropTypes.arrayOf(PropTypes.string)
-
-// Language strings for this component.
-const locale = PropTypes.shape({
-  strings: PropTypes.object, // eslint-disable-line react/forbid-prop-types
-  pluralize: PropTypes.func,
-})
-
-// List of meta fields for the editor in the Dashboard.
-const metaField = PropTypes.shape({
-  id: PropTypes.string.isRequired,
-  name: PropTypes.string.isRequired,
-  placeholder: PropTypes.string,
-})
-const metaFields = PropTypes.oneOfType([
-  PropTypes.arrayOf(metaField),
-  PropTypes.func,
-])
-
-// A size in pixels (number) or with some other unit (string).
-const cssSize = PropTypes.oneOfType([PropTypes.string, PropTypes.number])
-
-export { uppy, locale, plugins, metaFields, cssSize }

packages/@uppy/status-bar/src/StatusBar.tsx

@@ -57,7 +57,6 @@ function getUploadingState(
   return state
 }
 
-// set default options, must be kept in sync with @uppy/react/src/StatusBar.js
 const defaultOptions = {
   hideUploadButton: false,
   hideRetryButton: false,

yarn.lock

@@ -9643,7 +9643,6 @@ __metadata:
   dependencies:
     "@types/react": ^18.0.8
     "@uppy/utils": "workspace:^"
-    prop-types: ^15.6.1
     react: ^18.1.0
   peerDependencies:
     "@uppy/core": "workspace:^"
@@ -26050,7 +26049,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"prop-types@npm:^15.6.0, prop-types@npm:^15.6.1, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1":
+"prop-types@npm:^15.6.0, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1":
   version: 15.8.1
   resolution: "prop-types@npm:15.8.1"
   dependencies: