fix: improve types resolution

package.json

@@ -18,9 +18,18 @@
   "main": "dist/index.js",
   "type": "module",
   "exports": {
-    ".": "./dist/index.js",
-    "./lazy": "./dist/lazy/index.js",
-    "./*": "./dist/*.js"
+    ".": {
+      "default": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./lazy": {
+      "default": "./dist/lazy/index.js",
+      "types": "./dist/lazy/index.d.ts"
+    },
+    "./*": {
+      "default": "./dist/*.js",
+      "types": "./dist/*.d.ts"
+    }
   },
   "scripts": {
     "clean": "rimraf dist demo coverage",
@@ -43,29 +52,31 @@
     "postpublish": "npm run clean"
   },
   "peerDependencies": {
-    "react": ">=16.6.0"
+    "@types/react": "^17.0.0 || ^18",
+    "react": "^17.0.2 || ^18",
+    "react-dom": "^17.0.2 || ^18"
   },
   "devDependencies": {
     "@types/node": "^14.0.24",
-    "@types/react": "^17.0.0",
+    "@types/react": "^18.2.79",
     "auto-changelog": "^2.0.0",
     "builder": "file:./scripts/builder",
     "c8": "^8.0.1",
     "codecov": "^3.6.5",
     "cross-env": "^7.0.2",
     "esbuild": "^0.19.4",
     "npm-run-all": "^4.1.5",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
-    "react-test-renderer": "^16.13.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-test-renderer": "^18.2.0",
     "rimraf": "^3.0.2",
     "screenfull": "^5.0.2",
     "sinon": "^16.0.0",
     "snazzy": "^8.0.0",
     "standard": "^17.1.0",
     "tester": "file:./scripts/tester",
     "ts-standard": "^12.0.2",
-    "typescript": "^4.1.2",
+    "typescript": "^5.4.5",
     "zora": "^5.2.0"
   },
   "dependencies": {

src/Player.js

@@ -1,8 +1,8 @@
 import React, { Component } from 'react'
 import isEqual from 'react-fast-compare'
 
-import { propTypes, defaultProps } from './props'
-import { isMediaStream } from './utils'
+import { propTypes, defaultProps } from './props.js'
+import { isMediaStream } from './utils.js'
 
 const SEEK_ON_PLAY_EXPIRY = 5000
 

src/ReactPlayer.js

@@ -3,11 +3,11 @@ import merge from 'deepmerge'
 import memoize from 'memoize-one'
 import isEqual from 'react-fast-compare'
 
-import { propTypes, defaultProps } from './props'
-import { omit, lazy } from './utils'
-import Player from './Player'
+import { propTypes, defaultProps } from './props.js'
+import { omit, lazy } from './utils.js'
+import Player from './Player.js'
 
-const Preview = lazy(() => import(/* webpackChunkName: 'reactPlayerPreview' */'./Preview'))
+const Preview = lazy(() => import(/* webpackChunkName: 'reactPlayerPreview' */'./Preview.js'))
 const SUPPORTED_PROPS = Object.keys(propTypes)
 const customPlayers = []
 

src/index.js

@@ -1,5 +1,5 @@
-import players from './players'
-import { createReactPlayer } from './ReactPlayer'
+import players from './players/index.js'
+import { createReactPlayer } from './ReactPlayer.js'
 
 // Fall back to FilePlayer if nothing else can play the URL
 const fallback = players[players.length - 1]

src/players/DailyMotion.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK, parseStartTime } from '../utils'
-import { canPlay, MATCH_URL_DAILYMOTION } from '../patterns'
+import { callPlayer, getSDK, parseStartTime } from '../utils.js'
+import { canPlay, MATCH_URL_DAILYMOTION } from '../patterns.js'
 
 const SDK_URL = 'https://api.dmcdn.net/all.js'
 const SDK_GLOBAL = 'DM'

src/players/Facebook.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK, randomString } from '../utils'
-import { canPlay } from '../patterns'
+import { callPlayer, getSDK, randomString } from '../utils.js'
+import { canPlay } from '../patterns.js'
 
 const SDK_URL = 'https://connect.facebook.net/en_US/sdk.js'
 const SDK_GLOBAL = 'FB'

src/players/FilePlayer.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { getSDK, isMediaStream, supportsWebKitPresentationMode } from '../utils'
-import { canPlay, AUDIO_EXTENSIONS, HLS_EXTENSIONS, DASH_EXTENSIONS, FLV_EXTENSIONS } from '../patterns'
+import { getSDK, isMediaStream, supportsWebKitPresentationMode } from '../utils.js'
+import { canPlay, AUDIO_EXTENSIONS, HLS_EXTENSIONS, DASH_EXTENSIONS, FLV_EXTENSIONS } from '../patterns.js'
 
 const HAS_NAVIGATOR = typeof navigator !== 'undefined'
 const IS_IPAD_PRO = HAS_NAVIGATOR && navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1

src/players/Kaltura.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK } from '../utils'
-import { canPlay } from '../patterns'
+import { callPlayer, getSDK } from '../utils.js'
+import { canPlay } from '../patterns.js'
 
 const SDK_URL = 'https://cdn.embed.ly/player-0.1.0.min.js'
 const SDK_GLOBAL = 'playerjs'

src/players/Mixcloud.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK, queryString } from '../utils'
-import { canPlay, MATCH_URL_MIXCLOUD } from '../patterns'
+import { callPlayer, getSDK, queryString } from '../utils.js'
+import { canPlay, MATCH_URL_MIXCLOUD } from '../patterns.js'
 
 const SDK_URL = 'https://widget.mixcloud.com/media/js/widgetApi.js'
 const SDK_GLOBAL = 'Mixcloud'

src/players/Mux.js

@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 
-import { canPlay, MATCH_URL_MUX } from '../patterns'
+import { canPlay, MATCH_URL_MUX } from '../patterns.js'
 
 const SDK_URL = 'https://cdn.jsdelivr.net/npm/@mux/mux-player@VERSION/dist/mux-player.mjs'
 

src/players/SoundCloud.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK } from '../utils'
-import { canPlay } from '../patterns'
+import { callPlayer, getSDK } from '../utils.js'
+import { canPlay } from '../patterns.js'
 
 const SDK_URL = 'https://w.soundcloud.com/player/api.js'
 const SDK_GLOBAL = 'SC'

src/players/Streamable.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK } from '../utils'
-import { canPlay, MATCH_URL_STREAMABLE } from '../patterns'
+import { callPlayer, getSDK } from '../utils.js'
+import { canPlay, MATCH_URL_STREAMABLE } from '../patterns.js'
 
 const SDK_URL = 'https://cdn.embed.ly/player-0.1.0.min.js'
 const SDK_GLOBAL = 'playerjs'

src/players/Twitch.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK, parseStartTime, randomString } from '../utils'
-import { canPlay, MATCH_URL_TWITCH_CHANNEL, MATCH_URL_TWITCH_VIDEO } from '../patterns'
+import { callPlayer, getSDK, parseStartTime, randomString } from '../utils.js'
+import { canPlay, MATCH_URL_TWITCH_CHANNEL, MATCH_URL_TWITCH_VIDEO } from '../patterns.js'
 
 const SDK_URL = 'https://player.twitch.tv/js/embed/v1.js'
 const SDK_GLOBAL = 'Twitch'

src/players/Vidyard.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK } from '../utils'
-import { canPlay, MATCH_URL_VIDYARD } from '../patterns'
+import { callPlayer, getSDK } from '../utils.js'
+import { canPlay, MATCH_URL_VIDYARD } from '../patterns.js'
 
 const SDK_URL = 'https://play.vidyard.com/embed/v4.js'
 const SDK_GLOBAL = 'VidyardV4'

src/players/Vimeo.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
 
-import { callPlayer, getSDK } from '../utils'
-import { canPlay } from '../patterns'
+import { callPlayer, getSDK } from '../utils.js'
+import { canPlay } from '../patterns.js'
 
 const SDK_URL = 'https://player.vimeo.com/api/player.js'
 const SDK_GLOBAL = 'Vimeo'