No Description

WebViewTypes.js 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451
  1. /**
  2. * Copyright (c) 2015-present, Facebook, Inc.
  3. *
  4. * This source code is licensed under the MIT license found in the
  5. * LICENSE file in the root directory of this source tree.
  6. *
  7. * @format
  8. * @flow
  9. */
  10. 'use strict';
  11. import type {Node, Element, ComponentType} from 'react';
  12. import type {SyntheticEvent} from 'CoreEventTypes';
  13. import type {EdgeInsetsProp} from 'EdgeInsetsPropType';
  14. import type {ViewStyleProp} from 'StyleSheet';
  15. import type {ViewProps} from 'ViewPropTypes';
  16. export type WebViewNativeEvent = $ReadOnly<{|
  17. url: string,
  18. loading: boolean,
  19. title: string,
  20. canGoBack: boolean,
  21. canGoForward: boolean,
  22. |}>;
  23. export type WebViewProgressEvent = $ReadOnly<{|
  24. ...WebViewNativeEvent,
  25. progress: number,
  26. |}>
  27. export type WebViewNavigation = $ReadOnly<{|
  28. ...WebViewNativeEvent,
  29. navigationType:
  30. | 'click'
  31. | 'formsubmit'
  32. | 'backforward'
  33. | 'reload'
  34. | 'formresubmit'
  35. | 'other',
  36. |}>;
  37. export type WebViewMessage = $ReadOnly<{|
  38. ...WebViewNativeEvent,
  39. data: string,
  40. |}>;
  41. export type WebViewError = $ReadOnly<{|
  42. ...WebViewNativeEvent,
  43. /**
  44. * `domain` is only used on iOS
  45. */
  46. domain: ?string,
  47. code: number,
  48. description: string,
  49. |}>;
  50. export type WebViewEvent = SyntheticEvent<WebViewNativeEvent>;
  51. export type WebViewNavigationEvent = SyntheticEvent<WebViewNavigation>;
  52. export type WebViewMessageEvent = SyntheticEvent<WebViewMessage>;
  53. export type WebViewErrorEvent = SyntheticEvent<WebViewError>;
  54. export type DataDetectorTypes =
  55. | 'phoneNumber'
  56. | 'link'
  57. | 'address'
  58. | 'calendarEvent'
  59. | 'trackingNumber'
  60. | 'flightNumber'
  61. | 'lookupSuggestion'
  62. | 'none'
  63. | 'all';
  64. export type OverScrollModeType = 'always' | 'content' | 'never';
  65. export type WebViewSourceUri = $ReadOnly<{|
  66. /**
  67. * The URI to load in the `WebView`. Can be a local or remote file.
  68. */
  69. uri?: ?string,
  70. /**
  71. * The HTTP Method to use. Defaults to GET if not specified.
  72. * NOTE: On Android, only GET and POST are supported.
  73. */
  74. method?: string,
  75. /**
  76. * Additional HTTP headers to send with the request.
  77. * NOTE: On Android, this can only be used with GET requests.
  78. */
  79. headers?: Object,
  80. /**
  81. * The HTTP body to send with the request. This must be a valid
  82. * UTF-8 string, and will be sent exactly as specified, with no
  83. * additional encoding (e.g. URL-escaping or base64) applied.
  84. * NOTE: On Android, this can only be used with POST requests.
  85. */
  86. body?: string,
  87. |}>;
  88. export type WebViewSourceHtml = $ReadOnly<{|
  89. /**
  90. * A static HTML page to display in the WebView.
  91. */
  92. html?: ?string,
  93. /**
  94. * The base URL to be used for any relative links in the HTML.
  95. */
  96. baseUrl?: ?string,
  97. |}>;
  98. export type WebViewSource = WebViewSourceUri | WebViewSourceHtml;
  99. export type WebViewNativeConfig = $ReadOnly<{|
  100. /*
  101. * The native component used to render the WebView.
  102. */
  103. component?: ComponentType<WebViewSharedProps>,
  104. /*
  105. * Set props directly on the native component WebView. Enables custom props which the
  106. * original WebView doesn't pass through.
  107. */
  108. props?: ?Object,
  109. /*
  110. * Set the ViewManager to use for communication with the native side.
  111. * @platform ios
  112. */
  113. viewManager?: ?Object,
  114. |}>;
  115. export type IOSWebViewProps = $ReadOnly<{|
  116. /**
  117. * If true, use WKWebView instead of UIWebView.
  118. * @platform ios
  119. */
  120. useWebKit?: ?boolean,
  121. /**
  122. * Boolean value that determines whether the web view bounces
  123. * when it reaches the edge of the content. The default value is `true`.
  124. * @platform ios
  125. */
  126. bounces?: ?boolean,
  127. /**
  128. * A floating-point number that determines how quickly the scroll view
  129. * decelerates after the user lifts their finger. You may also use the
  130. * string shortcuts `"normal"` and `"fast"` which match the underlying iOS
  131. * settings for `UIScrollViewDecelerationRateNormal` and
  132. * `UIScrollViewDecelerationRateFast` respectively:
  133. *
  134. * - normal: 0.998
  135. * - fast: 0.99 (the default for iOS web view)
  136. * @platform ios
  137. */
  138. decelerationRate?: ?('fast' | 'normal' | number),
  139. /**
  140. * Boolean value that determines whether scrolling is enabled in the
  141. * `WebView`. The default value is `true`.
  142. * @platform ios
  143. */
  144. scrollEnabled?: ?boolean,
  145. /**
  146. * The amount by which the web view content is inset from the edges of
  147. * the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}.
  148. * @platform ios
  149. */
  150. contentInset?: ?EdgeInsetsProp,
  151. /**
  152. * Determines the types of data converted to clickable URLs in the web view's content.
  153. * By default only phone numbers are detected.
  154. *
  155. * You can provide one type or an array of many types.
  156. *
  157. * Possible values for `dataDetectorTypes` are:
  158. *
  159. * - `'phoneNumber'`
  160. * - `'link'`
  161. * - `'address'`
  162. * - `'calendarEvent'`
  163. * - `'none'`
  164. * - `'all'`
  165. *
  166. * With the new WebKit implementation, we have three new values:
  167. * - `'trackingNumber'`,
  168. * - `'flightNumber'`,
  169. * - `'lookupSuggestion'`,
  170. *
  171. * @platform ios
  172. */
  173. dataDetectorTypes?:
  174. | ?DataDetectorTypes
  175. | $ReadOnlyArray<DataDetectorTypes>,
  176. /**
  177. * Function that allows custom handling of any web view requests. Return
  178. * `true` from the function to continue loading the request and `false`
  179. * to stop loading.
  180. * @platform ios
  181. */
  182. onShouldStartLoadWithRequest?: (event: WebViewEvent) => mixed,
  183. /**
  184. * Boolean that determines whether HTML5 videos play inline or use the
  185. * native full-screen controller. The default value is `false`.
  186. *
  187. * **NOTE** : In order for video to play inline, not only does this
  188. * property need to be set to `true`, but the video element in the HTML
  189. * document must also include the `webkit-playsinline` attribute.
  190. * @platform ios
  191. */
  192. allowsInlineMediaPlayback?: ?boolean,
  193. /**
  194. * Hide the accessory view when the keyboard is open. Default is false to be
  195. * backward compatible.
  196. */
  197. hideKeyboardAccessoryView?: ?boolean,
  198. /**
  199. * A Boolean value indicating whether horizontal swipe gestures will trigger
  200. * back-forward list navigations.
  201. */
  202. allowsBackForwardNavigationGestures?: ?boolean,
  203. /**
  204. * The custom user agent string.
  205. */
  206. userAgent?: ?string,
  207. |}>;
  208. export type AndroidWebViewProps = $ReadOnly<{|
  209. onNavigationStateChange?: (event: WebViewNavigation) => mixed,
  210. onContentSizeChange?: (event: WebViewEvent) => mixed,
  211. /**
  212. * https://developer.android.com/reference/android/view/View#OVER_SCROLL_NEVER
  213. * Sets the overScrollMode. Possible values are:
  214. *
  215. * - `'always'` (default)
  216. * - `'content'`
  217. * - `'never'`
  218. *
  219. * @platform android
  220. */
  221. overScrollMode?: ?OverScrollModeType,
  222. /**
  223. * Sets whether Geolocation is enabled. The default is false.
  224. * @platform android
  225. */
  226. geolocationEnabled?: ?boolean,
  227. /**
  228. * Boolean that sets whether JavaScript running in the context of a file
  229. * scheme URL should be allowed to access content from any origin.
  230. * Including accessing content from other file scheme URLs
  231. * @platform android
  232. */
  233. allowUniversalAccessFromFileURLs?: ?boolean,
  234. /**
  235. * Sets whether the webview allow access to file system.
  236. * @platform android
  237. */
  238. allowFileAccess?: ?boolean,
  239. /**
  240. * Used on Android only, controls whether form autocomplete data should be saved
  241. * @platform android
  242. */
  243. saveFormDataDisabled?: ?boolean,
  244. /*
  245. * Used on Android only, controls whether the given list of URL prefixes should
  246. * make {@link com.facebook.react.views.webview.ReactWebViewClient} to launch a
  247. * default activity intent for those URL instead of loading it within the webview.
  248. * Use this to list URLs that WebView cannot handle, e.g. a PDF url.
  249. * @platform android
  250. */
  251. urlPrefixesForDefaultIntent?: $ReadOnlyArray<string>,
  252. /**
  253. * Boolean value to enable JavaScript in the `WebView`. Used on Android only
  254. * as JavaScript is enabled by default on iOS. The default value is `true`.
  255. * @platform android
  256. */
  257. javaScriptEnabled?: ?boolean,
  258. /**
  259. * Boolean value to enable third party cookies in the `WebView`. Used on
  260. * Android Lollipop and above only as third party cookies are enabled by
  261. * default on Android Kitkat and below and on iOS. The default value is `true`.
  262. * @platform android
  263. */
  264. thirdPartyCookiesEnabled?: ?boolean,
  265. /**
  266. * Boolean value to control whether DOM Storage is enabled. Used only in
  267. * Android.
  268. * @platform android
  269. */
  270. domStorageEnabled?: ?boolean,
  271. /**
  272. * Sets the user-agent for the `WebView`.
  273. * @platform android
  274. */
  275. userAgent?: ?string,
  276. /**
  277. * Specifies the mixed content mode. i.e WebView will allow a secure origin to load content from any other origin.
  278. *
  279. * Possible values for `mixedContentMode` are:
  280. *
  281. * - `'never'` (default) - WebView will not allow a secure origin to load content from an insecure origin.
  282. * - `'always'` - WebView will allow a secure origin to load content from any other origin, even if that origin is insecure.
  283. * - `'compatibility'` - WebView will attempt to be compatible with the approach of a modern web browser with regard to mixed content.
  284. * @platform android
  285. */
  286. mixedContentMode?: ?('never' | 'always' | 'compatibility'),
  287. |}>;
  288. export type WebViewSharedProps = $ReadOnly<{|
  289. ...ViewProps,
  290. ...IOSWebViewProps,
  291. ...AndroidWebViewProps,
  292. /**
  293. * Deprecated. Use `source` instead.
  294. */
  295. url?: ?string,
  296. /**
  297. * Deprecated. Use `source` instead.
  298. */
  299. html?: ?string,
  300. /**
  301. * Loads static html or a uri (with optional headers) in the WebView.
  302. */
  303. source?: ?WebViewSource,
  304. /**
  305. * Function that returns a view to show if there's an error.
  306. */
  307. renderError: (errorDomain: ?string, errorCode: number, errorDesc: string) => Element<any>, // view to show if there's an error
  308. /**
  309. * Function that returns a loading indicator.
  310. */
  311. renderLoading: () => Element<any>,
  312. /**
  313. * Function that is invoked when the `WebView` has finished loading.
  314. */
  315. onLoad: (event: WebViewNavigationEvent) => mixed,
  316. /**
  317. * Function that is invoked when the `WebView` load succeeds or fails.
  318. */
  319. onLoadEnd: (event: WebViewNavigationEvent | WebViewErrorEvent) => mixed,
  320. /**
  321. * Function that is invoked when the `WebView` starts loading.
  322. */
  323. onLoadStart: (event: WebViewNavigationEvent) => mixed,
  324. /**
  325. * Function that is invoked when the `WebView` load fails.
  326. */
  327. onError: (event: WebViewErrorEvent) => mixed,
  328. /**
  329. * Controls whether to adjust the content inset for web views that are
  330. * placed behind a navigation bar, tab bar, or toolbar. The default value
  331. * is `true`.
  332. */
  333. automaticallyAdjustContentInsets?: ?boolean,
  334. /**
  335. * Function that is invoked when the `WebView` loading starts or ends.
  336. */
  337. onNavigationStateChange?: (event: WebViewNavigation) => mixed,
  338. /**
  339. * A function that is invoked when the webview calls `window.postMessage`.
  340. * Setting this property will inject a `postMessage` global into your
  341. * webview, but will still call pre-existing values of `postMessage`.
  342. *
  343. * `window.postMessage` accepts one argument, `data`, which will be
  344. * available on the event object, `event.nativeEvent.data`. `data`
  345. * must be a string.
  346. */
  347. onMessage?: (event: WebViewMessageEvent) => mixed,
  348. /**
  349. * Function that is invoked when the `WebView` is loading.
  350. */
  351. onLoadProgress?: (event: WebViewProgressEvent) => mixed,
  352. /**
  353. * Boolean value that forces the `WebView` to show the loading view
  354. * on the first load.
  355. */
  356. startInLoadingState?: ?boolean,
  357. /**
  358. * Set this to provide JavaScript that will be injected into the web page
  359. * when the view loads.
  360. */
  361. injectedJavaScript?: ?string,
  362. /**
  363. * Boolean that controls whether the web content is scaled to fit
  364. * the view and enables the user to change the scale. The default value
  365. * is `true`.
  366. *
  367. * On iOS, when `useWebKit=true`, this prop will not work.
  368. */
  369. scalesPageToFit?: ?boolean,
  370. /**
  371. * Boolean that determines whether HTML5 audio and video requires the user
  372. * to tap them before they start playing. The default value is `true`.
  373. */
  374. mediaPlaybackRequiresUserAction?: ?boolean,
  375. /**
  376. * List of origin strings to allow being navigated to. The strings allow
  377. * wildcards and get matched against *just* the origin (not the full URL).
  378. * If the user taps to navigate to a new page but the new page is not in
  379. * this whitelist, we will open the URL in Safari.
  380. * The default whitelisted origins are "http://*" and "https://*".
  381. */
  382. originWhitelist?: $ReadOnlyArray<string>,
  383. /**
  384. * Override the native component used to render the WebView. Enables a custom native
  385. * WebView which uses the same JavaScript as the original WebView.
  386. */
  387. nativeConfig?: ?WebViewNativeConfig,
  388. style?: ViewStyleProp,
  389. children: Node,
  390. |}>;