1import * as WebBrowser from 'expo-web-browser'; 2import React from 'react'; 3 4import FunctionDemo, { FunctionDescription } from '../../components/FunctionDemo'; 5import Colors from '../../constants/Colors'; 6 7const URL = 'https://blog.expo.dev/expo-sdk-44-4c4b8306584a'; 8 9const FUNCTIONS_DESCRIPTION: FunctionDescription = { 10 name: 'openBrowserAsync', 11 parameters: [ 12 { 13 type: 'constant', 14 name: 'url', 15 value: URL, 16 }, 17 { 18 type: 'object', 19 name: 'options', 20 properties: [ 21 { 22 name: 'toolbarColor', 23 type: 'enum', 24 values: [ 25 { 26 name: 'undefined', 27 value: undefined, 28 }, 29 { 30 name: `"${Colors.tintColor}"`, 31 value: Colors.tintColor, 32 }, 33 ], 34 }, 35 { 36 name: 'secondaryToolbarColor', 37 platforms: ['android'], 38 type: 'enum', 39 values: [ 40 { 41 name: 'undefined', 42 value: undefined, 43 }, 44 { 45 name: `"${Colors.highlightColor}"`, 46 value: Colors.highlightColor, 47 }, 48 ], 49 }, 50 { 51 name: 'controlsColor', 52 type: 'enum', 53 values: [ 54 { 55 name: 'undefined', 56 value: undefined, 57 }, 58 { name: `"${Colors.headerTitle}"`, value: Colors.headerTitle }, 59 ], 60 }, 61 { 62 type: 'boolean', 63 name: 'showTitle', 64 platforms: ['android'], 65 initial: false, 66 }, 67 { 68 type: 'boolean', 69 name: 'showInRecents', 70 platforms: ['android'], 71 initial: false, 72 }, 73 { 74 type: 'boolean', 75 name: 'enableBarCollapsing', 76 initial: false, 77 }, 78 { 79 type: 'boolean', 80 name: 'readerMode', 81 platforms: ['ios'], 82 initial: false, 83 }, 84 { 85 type: 'boolean', 86 name: 'enableDefaultShareMenuItem', 87 platforms: ['android'], 88 initial: false, 89 }, 90 { 91 name: 'presentationStyle', 92 type: 'enum', 93 platforms: ['ios'], 94 values: [ 95 { 96 name: 'WebBrowserPresentationStyle.OVER_FULL_SCREEN', 97 value: WebBrowser.WebBrowserPresentationStyle.OVER_FULL_SCREEN, 98 }, 99 { 100 name: 'WebBrowserPresentationStyle.FULL_SCREEN', 101 value: WebBrowser.WebBrowserPresentationStyle.FULL_SCREEN, 102 }, 103 { 104 name: 'WebBrowserPresentationStyle.PAGE_SHEET', 105 value: WebBrowser.WebBrowserPresentationStyle.PAGE_SHEET, 106 }, 107 { 108 name: 'WebBrowserPresentationStyle.FORM_SHEET', 109 value: WebBrowser.WebBrowserPresentationStyle.FORM_SHEET, 110 }, 111 { 112 name: 'WebBrowserPresentationStyle.CURRENT_CONTEXT', 113 value: WebBrowser.WebBrowserPresentationStyle.CURRENT_CONTEXT, 114 }, 115 { 116 name: 'WebBrowserPresentationStyle.OVER_CURRENT_CONTEXT', 117 value: WebBrowser.WebBrowserPresentationStyle.OVER_CURRENT_CONTEXT, 118 }, 119 { 120 name: 'WebBrowserPresentationStyle.POPOVER', 121 value: WebBrowser.WebBrowserPresentationStyle.POPOVER, 122 }, 123 { 124 name: 'WebBrowserPresentationStyle.AUTOMATIC', 125 value: WebBrowser.WebBrowserPresentationStyle.AUTOMATIC, 126 }, 127 ], 128 }, 129 ], 130 }, 131 ], 132 actions: [ 133 { name: 'Open', action: WebBrowser.openBrowserAsync }, 134 { 135 name: 'Open and dismiss', 136 action: (url: string, openOptions: WebBrowser.WebBrowserOpenOptions) => { 137 const openBrowserPromise = WebBrowser.openBrowserAsync(url, openOptions); 138 WebBrowser.dismissBrowser(); 139 return openBrowserPromise; 140 }, 141 }, 142 { 143 name: 'Open twice', 144 action: (url: string, openOptions: WebBrowser.WebBrowserOpenOptions) => { 145 WebBrowser.openBrowserAsync(url, openOptions); 146 return WebBrowser.openBrowserAsync(url, openOptions); 147 }, 148 }, 149 { name: 'Dismiss (no-op)', action: async () => WebBrowser.dismissBrowser() }, 150 ], 151}; 152 153export default function OpenBrowserAsyncDemo() { 154 return <FunctionDemo namespace="WebBrowser" {...FUNCTIONS_DESCRIPTION} />; 155} 156