diff --git a/shared/actions/__tests__/signup.test.tsx b/shared/actions/__tests__/signup.test.tsx index 0703bbe3e2ca..5a8ab4adb7ce 100644 --- a/shared/actions/__tests__/signup.test.tsx +++ b/shared/actions/__tests__/signup.test.tsx @@ -10,7 +10,7 @@ import * as RouteTreeGen from '../route-tree-gen' import {_testing} from '../signup' import reducer from '../../reducers/signup' -const testLogger = new SagaLogger('TESTING', 'TESTINGFCN') +const testLogger = new SagaLogger('TESTING' as any, 'TESTINGFCN') jest.unmock('immutable') diff --git a/shared/actions/chat2/index.tsx b/shared/actions/chat2/index.tsx index 1f797d22e497..0703d079902b 100644 --- a/shared/actions/chat2/index.tsx +++ b/shared/actions/chat2/index.tsx @@ -115,18 +115,16 @@ function* inboxRefresh( ) } - yield* Saga.callRPCs( - RPCChatTypes.localGetInboxNonblockLocalRpcSaga({ - incomingCallMap: {'chat.1.chatUi.chatInboxUnverified': onUnverified}, - params: { - identifyBehavior: RPCTypes.TLFIdentifyBehavior.chatGui, - maxUnbox: 0, - query: Constants.makeInboxQuery([]), - skipUnverified: false, - }, - waitingKey: Constants.waitingKeyInboxRefresh, - }) - ) + yield RPCChatTypes.localGetInboxNonblockLocalRpcSaga({ + incomingCallMap: {'chat.1.chatUi.chatInboxUnverified': onUnverified}, + params: { + identifyBehavior: RPCTypes.TLFIdentifyBehavior.chatGui, + maxUnbox: 0, + query: Constants.makeInboxQuery([]), + skipUnverified: false, + }, + waitingKey: Constants.waitingKeyInboxRefresh, + }) } // When we get info on a team we need to unbox immediately so we can get the channel names @@ -2152,7 +2150,7 @@ function* attachmentDownload( } // Download it - const destPath = yield* Saga.callPromise(downloadFilePath, message.fileName) + const destPath = yield downloadFilePath(message.fileName) yield Saga.callUntyped(downloadAttachment, destPath, message) } @@ -2516,7 +2514,7 @@ function* mobileMessageAttachmentShare( } const fileName = yield* downloadAttachment('', message) try { - yield* Saga.callPromise(showShareActionSheetFromFile, fileName, message.fileType) + yield showShareActionSheetFromFile(fileName) } catch (e) { logger.error('Failed to share attachment: ' + JSON.stringify(e)) } @@ -2546,7 +2544,7 @@ function* mobileMessageAttachmentSave( ) try { logger.info('Trying to save chat attachment to camera roll') - yield* Saga.callPromise(saveAttachmentToCameraRoll, fileName, message.fileType) + yield saveAttachmentToCameraRoll(fileName, message.fileType) } catch (err) { logger.error('Failed to save attachment: ' + err) throw new Error('Failed to save attachment: ' + err) @@ -3394,7 +3392,7 @@ const createConversationFromTeamBuilder = ( }), ] -export function* chatTeamBuildingSaga(): Saga.SagaGenerator { +export function* chatTeamBuildingSaga() { yield* commonTeamBuildingSaga('chat2') yield* Saga.chainAction2( TeamBuildingGen.finishedTeamBuilding, @@ -3402,7 +3400,7 @@ export function* chatTeamBuildingSaga(): Saga.SagaGenerator { ) } -function* chat2Saga(): Saga.SagaGenerator { +function* chat2Saga() { // Platform specific actions if (isMobile) { // Push us into the conversation diff --git a/shared/actions/config/index.tsx b/shared/actions/config/index.tsx index 527c12ff5afd..785157948f4f 100644 --- a/shared/actions/config/index.tsx +++ b/shared/actions/config/index.tsx @@ -270,7 +270,6 @@ function* loadDaemonAccounts( }) ) } - return undefined } } } @@ -589,7 +588,7 @@ const saveDarkPrefs = async (state: Container.TypedState) => { } catch (_) {} } -function* configSaga(): Saga.SagaGenerator { +function* configSaga() { // Start the handshake process. This means we tell all sagas we're handshaking with the daemon. If another // saga needs to do something before we leave the loading screen they should call daemonHandshakeWait yield* Saga.chainAction2([ConfigGen.restartHandshake, ConfigGen.startHandshake], startHandshake) diff --git a/shared/actions/deeplinks.tsx b/shared/actions/deeplinks.tsx index 0aa1f4bd418e..837b473f99f3 100644 --- a/shared/actions/deeplinks.tsx +++ b/shared/actions/deeplinks.tsx @@ -105,7 +105,7 @@ const handleAppLink = (state: Container.TypedState, action: DeeplinksGen.LinkPay return false } -function* deeplinksSaga(): Saga.SagaGenerator { +function* deeplinksSaga() { yield* Saga.chainAction2(DeeplinksGen.link, handleAppLink) yield* Saga.chainAction2(DeeplinksGen.handleKeybaseLink, handleKeybaseLink) } diff --git a/shared/actions/devices.tsx b/shared/actions/devices.tsx index 52b4da2c9351..02cacd56e6cf 100644 --- a/shared/actions/devices.tsx +++ b/shared/actions/devices.tsx @@ -22,22 +22,20 @@ const load = async (state: Container.TypedState) => { } } -function* requestPaperKey(): Iterable { - yield* Saga.callRPCs( - RPCTypes.loginPaperKeyRpcSaga({ - customResponseIncomingCallMap: { - 'keybase.1.loginUi.promptRevokePaperKeys': (_, response) => { - response.result(false) - }, +function* requestPaperKey() { + yield RPCTypes.loginPaperKeyRpcSaga({ + customResponseIncomingCallMap: { + 'keybase.1.loginUi.promptRevokePaperKeys': (_, response) => { + response.result(false) }, - incomingCallMap: { - 'keybase.1.loginUi.displayPaperKeyPhrase': ({phrase}) => - Saga.put(DevicesGen.createPaperKeyCreated({paperKey: new HiddenString(phrase)})), - }, - params: undefined, - waitingKey: Constants.waitingKey, - }) - ) + }, + incomingCallMap: { + 'keybase.1.loginUi.displayPaperKeyPhrase': ({phrase}) => + Saga.put(DevicesGen.createPaperKeyCreated({paperKey: new HiddenString(phrase)})), + }, + params: undefined, + waitingKey: Constants.waitingKey, + }) } const requestEndangeredTLFsLoad = async ( @@ -128,7 +126,7 @@ const receivedBadgeState = (_: Container.TypedState, action: NotificationsGen.Re ], }) -function* deviceSaga(): Saga.SagaGenerator { +function* deviceSaga() { // Load devices yield* Saga.chainAction2([DevicesGen.load, DevicesGen.revoked, DevicesGen.paperKeyCreated], load) // Revoke device diff --git a/shared/actions/fs/common.native.tsx b/shared/actions/fs/common.native.tsx index e6b9e27ed983..1cb7a38e8d7c 100644 --- a/shared/actions/fs/common.native.tsx +++ b/shared/actions/fs/common.native.tsx @@ -54,7 +54,7 @@ const downloadSuccess = async (state: TypedState, action: FsGen.DownloadSuccessP } } -export default function* nativeSaga(): Saga.SagaGenerator { +export default function* nativeSaga() { yield* Saga.chainAction2(FsGen.pickAndUpload, pickAndUploadToPromise) yield* Saga.chainAction2(FsGen.downloadSuccess, downloadSuccess) } diff --git a/shared/actions/fs/index.tsx b/shared/actions/fs/index.tsx index d884db69d967..f834b422ad66 100644 --- a/shared/actions/fs/index.tsx +++ b/shared/actions/fs/index.tsx @@ -400,7 +400,7 @@ function* download( case Types.DownloadIntent.None: // This adds " (1)" suffix to the base name, if the destination path // already exists. - localPath = yield* Saga.callPromise(Constants.downloadFilePathFromPath, path) + localPath = yield Constants.downloadFilePathFromPath(path) break case Types.DownloadIntent.CameraRoll: case Types.DownloadIntent.Share: @@ -411,7 +411,7 @@ function* download( break default: Flow.ifFlowComplainsAboutThisFunctionYouHaventHandledAllCasesInASwitch(intent) - localPath = yield* Saga.callPromise(Constants.downloadFilePathFromPath, path) + localPath = yield Constants.downloadFilePathFromPath(path) break } @@ -709,7 +709,7 @@ function* loadPathMetadata(_: TypedState, action: FsGen.LoadPathMetadataPayload) let pathItem = makeEntry(dirent) if (pathItem.type === Types.PathType.File) { const mimeType = yield* _loadMimeType(path) - pathItem = pathItem.set('mimeType', mimeType) + pathItem = pathItem.set('mimeType', mimeType || null) } yield Saga.put( FsGen.createPathItemLoaded({ @@ -1008,7 +1008,7 @@ const loadPathInfo = async (_: TypedState, action: FsGen.LoadPathInfoPayload) => }) } -function* fsSaga(): Saga.SagaGenerator { +function* fsSaga() { yield* Saga.chainAction2(FsGen.refreshLocalHTTPServerInfo, refreshLocalHTTPServerInfo) yield* Saga.chainAction2(FsGen.cancelDownload, cancelDownload) yield* Saga.chainGenerator( diff --git a/shared/actions/fs/platform-specific.android.tsx b/shared/actions/fs/platform-specific.android.tsx index 4945319fd59c..d1971e80395a 100644 --- a/shared/actions/fs/platform-specific.android.tsx +++ b/shared/actions/fs/platform-specific.android.tsx @@ -63,7 +63,7 @@ const downloadSuccessAndroid = (state, action: FsGen.DownloadSuccessPayload) => return copyToDownloadDir(localPath, mimeType) } -export default function* platformSpecificSaga(): Saga.SagaGenerator { +export default function* platformSpecificSaga() { yield Saga.spawn(nativeSaga) yield* Saga.chainAction2(FsGen.downloadSuccess, downloadSuccessAndroid) } diff --git a/shared/actions/fs/platform-specific.d.ts b/shared/actions/fs/platform-specific.d.ts index b1d3cf764d6f..907cc6ee459b 100644 --- a/shared/actions/fs/platform-specific.d.ts +++ b/shared/actions/fs/platform-specific.d.ts @@ -1,6 +1,6 @@ import * as Saga from '../../util/saga' import * as Types from '../../constants/types/fs' -declare function platformSpecificSaga(): Saga.SagaGenerator +declare function platformSpecificSaga(): void export default platformSpecificSaga diff --git a/shared/actions/fs/platform-specific.desktop.tsx b/shared/actions/fs/platform-specific.desktop.tsx index 4366fed07cc7..fb4019e0c1c8 100644 --- a/shared/actions/fs/platform-specific.desktop.tsx +++ b/shared/actions/fs/platform-specific.desktop.tsx @@ -426,7 +426,7 @@ const refreshMountDirs = async ( ] } -function* platformSpecificSaga(): Saga.SagaGenerator { +function* platformSpecificSaga() { yield* Saga.chainAction2(FsGen.openLocalPathInSystemFileManager, openLocalPathInSystemFileManager) yield* Saga.chainAction2(FsGen.openPathInSystemFileManager, openPathInSystemFileManager) if (!isLinux) { diff --git a/shared/actions/git.tsx b/shared/actions/git.tsx index 7950e2f1d057..cdb6a78c4262 100644 --- a/shared/actions/git.tsx +++ b/shared/actions/git.tsx @@ -118,7 +118,7 @@ function* navigateToTeamRepo(state: TypedState, action: GitGen.NavigateToTeamRep const receivedBadgeState = (_: TypedState, action: NotificationsGen.ReceivedBadgeStatePayload) => GitGen.createBadgeAppForGit({ids: new Set(action.payload.badgeState.newGitRepoGlobalUniqueIDs)}) -function* gitSaga(): Saga.SagaGenerator { +function* gitSaga() { // Create / Delete yield* Saga.chainAction2(GitGen.createPersonalRepo, createPersonalRepo) yield* Saga.chainAction2(GitGen.createTeamRepo, createTeamRepo) diff --git a/shared/actions/gregor.tsx b/shared/actions/gregor.tsx index 597c9419dc4f..484ad81485e4 100644 --- a/shared/actions/gregor.tsx +++ b/shared/actions/gregor.tsx @@ -86,7 +86,7 @@ const updateCategory = async (_: Container.TypedState, action: GregorGen.UpdateC } catch (_) {} } -function* gregorSaga(): Saga.SagaGenerator { +function* gregorSaga() { yield* Saga.chainAction2(GregorGen.updateCategory, updateCategory) yield* Saga.chainAction2([GregorGen.checkReachability, ConfigGen.osNetworkStatusChanged], checkReachability) yield* Saga.chainAction2(EngineGen.connected, registerForGregorNotifications) diff --git a/shared/actions/login.tsx b/shared/actions/login.tsx index 695928c90026..47796487d567 100644 --- a/shared/actions/login.tsx +++ b/shared/actions/login.tsx @@ -48,35 +48,33 @@ const moveToProvisioning = (username: string) => (_: any, response: any) => { // Actually do a user/pass login. Don't get sucked into a provisioning flow function* login(_: Container.TypedState, action: LoginGen.LoginPayload) { try { - yield* Saga.callRPCs( - RPCTypes.loginLoginRpcSaga({ - customResponseIncomingCallMap: { - 'keybase.1.gpgUi.selectKey': cancelOnCallback, - 'keybase.1.loginUi.getEmailOrUsername': cancelOnCallback, - 'keybase.1.provisionUi.DisplayAndPromptSecret': cancelOnCallback, - 'keybase.1.provisionUi.PromptNewDeviceName': moveToProvisioning(action.payload.username), - 'keybase.1.provisionUi.chooseDevice': cancelOnCallback, - 'keybase.1.provisionUi.chooseGPGMethod': cancelOnCallback, - 'keybase.1.secretUi.getPassphrase': getPasswordHandler(action.payload.password.stringValue()), - }, - // cancel if we get any of these callbacks, we're logging in, not provisioning - incomingCallMap: { - 'keybase.1.loginUi.displayPrimaryPaperKey': ignoreCallback, - 'keybase.1.provisionUi.DisplaySecretExchanged': ignoreCallback, - 'keybase.1.provisionUi.ProvisioneeSuccess': ignoreCallback, - 'keybase.1.provisionUi.ProvisionerSuccess': ignoreCallback, - }, - params: { - clientType: RPCTypes.ClientType.guiMain, - deviceName: '', - deviceType: isMobile ? 'mobile' : 'desktop', - doUserSwitch: flags.fastAccountSwitch, - paperKey: '', - username: action.payload.username, - }, - waitingKey: Constants.waitingKey, - }) - ) + yield RPCTypes.loginLoginRpcSaga({ + customResponseIncomingCallMap: { + 'keybase.1.gpgUi.selectKey': cancelOnCallback, + 'keybase.1.loginUi.getEmailOrUsername': cancelOnCallback, + 'keybase.1.provisionUi.DisplayAndPromptSecret': cancelOnCallback, + 'keybase.1.provisionUi.PromptNewDeviceName': moveToProvisioning(action.payload.username), + 'keybase.1.provisionUi.chooseDevice': cancelOnCallback, + 'keybase.1.provisionUi.chooseGPGMethod': cancelOnCallback, + 'keybase.1.secretUi.getPassphrase': getPasswordHandler(action.payload.password.stringValue()), + }, + // cancel if we get any of these callbacks, we're logging in, not provisioning + incomingCallMap: { + 'keybase.1.loginUi.displayPrimaryPaperKey': ignoreCallback, + 'keybase.1.provisionUi.DisplaySecretExchanged': ignoreCallback, + 'keybase.1.provisionUi.ProvisioneeSuccess': ignoreCallback, + 'keybase.1.provisionUi.ProvisionerSuccess': ignoreCallback, + }, + params: { + clientType: RPCTypes.ClientType.guiMain, + deviceName: '', + deviceType: isMobile ? 'mobile' : 'desktop', + doUserSwitch: flags.fastAccountSwitch, + paperKey: '', + username: action.payload.username, + }, + waitingKey: Constants.waitingKey, + }) logger.info('login call succeeded') yield Saga.put(ConfigGen.createLoggedIn({causedBySignup: false, causedByStartup: false})) } catch (e) { @@ -107,7 +105,7 @@ const loadIsOnline = async () => { } } -function* loginSaga(): Saga.SagaGenerator { +function* loginSaga() { // Actually log in yield* Saga.chainGenerator(LoginGen.login, login) yield* Saga.chainAction2(LoginGen.launchForgotPasswordWebPage, launchForgotPasswordWebPage) diff --git a/shared/actions/notifications.tsx b/shared/actions/notifications.tsx index ccbfc6fd4db3..82e3cef10085 100644 --- a/shared/actions/notifications.tsx +++ b/shared/actions/notifications.tsx @@ -83,7 +83,7 @@ const receivedBoxAuditError = ( ), }) -function* notificationsSaga(): Saga.SagaGenerator { +function* notificationsSaga() { yield* Saga.chainAction2(NotificationsGen.receivedBadgeState, receivedBadgeState) yield* Saga.chainAction2(EngineGen.keybase1NotifyAuditRootAuditError, receivedRootAuditError) yield* Saga.chainAction2(EngineGen.keybase1NotifyAuditBoxAuditError, receivedBoxAuditError) diff --git a/shared/actions/people.tsx b/shared/actions/people.tsx index 69197ed1b8f4..6545ed0394fc 100644 --- a/shared/actions/people.tsx +++ b/shared/actions/people.tsx @@ -44,7 +44,13 @@ const getPeopleData = async (state: Container.TypedState, action: PeopleGen.GetP .reduce(Constants.reduceRPCItemToPeopleItem, I.List()) if (debugTodo) { - const allTodos: Array = Object.values(RPCTypes.HomeScreenTodoType) + const allTodos = Object.values(RPCTypes.HomeScreenTodoType).reduce>( + (arr, t) => { + typeof t !== 'string' && arr.push(t) + return arr + }, + [] + ) allTodos.forEach(avdlType => { const todoType = Constants.todoTypeEnumToType[avdlType] if (newItems.some(t => t.type === 'todo' && t.todoType === todoType)) { @@ -157,7 +163,7 @@ const connected = async () => { } } -const peopleSaga = function*(): Saga.SagaGenerator { +const peopleSaga = function*() { yield* Saga.chainAction2(PeopleGen.getPeopleData, getPeopleData) yield* Saga.chainAction2(PeopleGen.markViewed, markViewed) yield* Saga.chainAction2(PeopleGen.skipTodo, skipTodo) diff --git a/shared/actions/pinentry.tsx b/shared/actions/pinentry.tsx index 2a8451aa9104..a15b301a3317 100644 --- a/shared/actions/pinentry.tsx +++ b/shared/actions/pinentry.tsx @@ -75,7 +75,7 @@ const onCancel = (_: Container.TypedState, action: PinentryGen.OnCancelPayload) }) } -function* pinentrySaga(): Saga.SagaGenerator { +function* pinentrySaga() { yield* Saga.chainAction2(PinentryGen.onSubmit, onSubmit) yield* Saga.chainAction2(PinentryGen.onCancel, onCancel) yield* Saga.chainAction2(PinentryGen.newPinentry, onNewPinentry) diff --git a/shared/actions/plan-billing.tsx b/shared/actions/plan-billing.tsx index e90b7ddff23b..68c7a2f61cd0 100644 --- a/shared/actions/plan-billing.tsx +++ b/shared/actions/plan-billing.tsx @@ -1,5 +1,5 @@ // import logger from '../logger' -import * as Saga from '../util/saga' +// import * as Saga from '../util/saga' // import * as Constants from '../constants/plan-billing' // import * as Types from '../constants/types/plan-billing' // import * as RPCTypes from '../constants/types/rpc-gen' @@ -167,7 +167,7 @@ import * as Saga from '../util/saga' // } // } -function* billingSaga(): Saga.SagaGenerator { +function* billingSaga() { // this isn't used // yield Saga.safeTakeEvery(Constants.updateBilling, updateBillingSaga) // yield Saga.safeTakeEvery(Constants.fetchBillingAndQuota, fetchBillingAndQuotaSaga) diff --git a/shared/actions/platform-specific/index.d.ts b/shared/actions/platform-specific/index.d.ts index b53752bd2d4a..7b2360b4ff10 100644 --- a/shared/actions/platform-specific/index.d.ts +++ b/shared/actions/platform-specific/index.d.ts @@ -37,4 +37,4 @@ export declare function getContentTypeFromURL( }) => Promise | void ) -export declare function platformConfigSaga(): Saga.SagaGenerator +export declare function platformConfigSaga() diff --git a/shared/actions/platform-specific/index.desktop.tsx b/shared/actions/platform-specific/index.desktop.tsx index b108f1dc292a..136e1e00f12a 100644 --- a/shared/actions/platform-specific/index.desktop.tsx +++ b/shared/actions/platform-specific/index.desktop.tsx @@ -62,7 +62,7 @@ export const getContentTypeFromURL = ( req.end() } -function* handleWindowFocusEvents(): Iterable { +function* handleWindowFocusEvents() { const channel = Saga.eventChannel(emitter => { window.addEventListener('focus', () => emitter('focus')) window.addEventListener('blur', () => emitter('blur')) @@ -260,7 +260,7 @@ const sendKBServiceCheck = (state: Container.TypedState, action: ConfigGen.Daemo function* startOutOfDateCheckLoop() { while (1) { try { - const toPut = yield* Saga.callPromise(checkForUpdate) + const toPut = yield checkForUpdate() yield Saga.put(toPut) yield Saga.delay(3600 * 1000) // 1 hr } catch (err) { @@ -412,7 +412,7 @@ const setOpenAtLogin = async (state: Container.TypedState) => { export const requestLocationPermission = () => Promise.resolve() -export function* platformConfigSaga(): Saga.SagaGenerator { +export function* platformConfigSaga() { yield* Saga.chainAction2(ConfigGen.setOpenAtLogin, setOpenAtLogin) yield* Saga.chainAction2(ConfigGen.setNotifySound, setNotifySound) yield* Saga.chainAction2(ConfigGen.showMain, showMainWindow) diff --git a/shared/actions/platform-specific/index.native.tsx b/shared/actions/platform-specific/index.native.tsx index 3b14a2f1dc7f..7b6bf497f970 100644 --- a/shared/actions/platform-specific/index.native.tsx +++ b/shared/actions/platform-specific/index.native.tsx @@ -632,7 +632,7 @@ function* setupDarkMode() { } } -export function* platformConfigSaga(): Saga.SagaGenerator { +export function* platformConfigSaga() { yield* Saga.chainGenerator(ConfigGen.persistRoute, persistRoute) yield* Saga.chainAction2(ConfigGen.mobileAppState, updateChangedFocus) yield* Saga.chainAction2(ConfigGen.openAppSettings, openAppSettings) diff --git a/shared/actions/platform-specific/push.native.tsx b/shared/actions/platform-specific/push.native.tsx index dd314e45bdd6..efcf416ad592 100644 --- a/shared/actions/platform-specific/push.native.tsx +++ b/shared/actions/platform-specific/push.native.tsx @@ -274,7 +274,7 @@ const neverShowMonsterAgain = async (state: Container.TypedState) => { function* requestPermissions() { if (isIOS) { - const shownPushPrompt = yield* Saga.callPromise(askNativeIfSystemPushPromptHasBeenShown) + const shownPushPrompt = yield askNativeIfSystemPushPromptHasBeenShown() if (shownPushPrompt) { // we've already shown the prompt, take them to settings yield Saga.put(ConfigGen.createOpenAppSettings()) @@ -285,7 +285,7 @@ function* requestPermissions() { try { yield Saga.put(WaitingGen.createIncrementWaiting({key: Constants.permissionsRequestingWaitingKey})) logger.info('[PushRequesting] asking native') - const permissions = yield* Saga.callPromise(requestPermissionsFromNative) + const permissions = yield requestPermissionsFromNative() logger.info('[PushRequesting] after prompt:', permissions) if (permissions && (permissions.alert || permissions.badge)) { logger.info('[PushRequesting] enabled') @@ -300,7 +300,7 @@ function* requestPermissions() { } } -function* initialPermissionsCheck(): Saga.SagaGenerator { +function* initialPermissionsCheck() { const hasPermissions = yield _checkPermissions(null) if (hasPermissions) { // Get the token @@ -344,13 +344,13 @@ function* _checkPermissions(action: ConfigGen.MobileAppStatePayload | null) { } logger.debug(`[PushCheck] checking ${action ? 'on foreground' : 'on startup'}`) - const permissions = yield* Saga.callPromise(checkPermissionsFromNative) + const permissions = yield checkPermissionsFromNative() if (permissions.alert || permissions.badge) { const state: Container.TypedState = yield* Saga.selectState() if (!state.push.hasPermissions) { logger.info('[PushCheck] enabled: getting token') yield Saga.put(PushGen.createUpdateHasPermissions({hasPermissions: true})) - yield* Saga.callPromise(requestPermissionsFromNative) + yield requestPermissionsFromNative() } else { logger.info('[PushCheck] enabled already') } @@ -364,7 +364,7 @@ function* _checkPermissions(action: ConfigGen.MobileAppStatePayload | null) { function* getStartupDetailsFromInitialPush() { const {push, pushTimeout}: {push: PushGen.NotificationPayload; pushTimeout: boolean} = yield Saga.race({ - push: Saga.callPromise(isAndroid ? getInitialPushAndroid : getInitialPushiOS), + push: isAndroid ? getInitialPushAndroid() : getInitialPushiOS(), pushTimeout: Saga.delay(10), }) if (pushTimeout || !push) { @@ -402,7 +402,7 @@ const getInitialPushiOS = () => }) ) -function* pushSaga(): Saga.SagaGenerator { +function* pushSaga() { // Permissions yield* Saga.chainGenerator( PushGen.requestPermissions, diff --git a/shared/actions/profile/index.tsx b/shared/actions/profile/index.tsx index 63d3217a866d..e1317d2efb9b 100644 --- a/shared/actions/profile/index.tsx +++ b/shared/actions/profile/index.tsx @@ -177,7 +177,7 @@ function* _profileSaga() { yield* Saga.chainAction2(ProfileGen.editAvatar, editAvatar) } -function* profileSaga(): Saga.SagaGenerator { +function* profileSaga() { yield Saga.spawn(_profileSaga) yield Saga.spawn(pgpSaga) yield Saga.spawn(proofsSaga) diff --git a/shared/actions/profile/proofs.tsx b/shared/actions/profile/proofs.tsx index 9e0b778b0eba..2710acff16ac 100644 --- a/shared/actions/profile/proofs.tsx +++ b/shared/actions/profile/proofs.tsx @@ -320,7 +320,7 @@ const submitCryptoAddress = async ( } } -function* proofsSaga(): Saga.SagaGenerator { +function* proofsSaga() { yield* Saga.chainAction2([ProfileGen.submitBTCAddress, ProfileGen.submitZcashAddress], submitCryptoAddress) yield* Saga.chainGenerator(ProfileGen.addProof, addProof) yield* Saga.chainAction2(ProfileGen.checkProof, checkProof) diff --git a/shared/actions/provision.tsx b/shared/actions/provision.tsx index 2c97f3249eb7..d70564fe396d 100644 --- a/shared/actions/provision.tsx +++ b/shared/actions/provision.tsx @@ -534,7 +534,7 @@ const forgotUsername = async (_: Container.TypedState, action: ProvisionGen.Forg } } -function* provisionSaga(): Saga.SagaGenerator { +function* provisionSaga() { // Always ensure we have one live makeProvisioningManager(false) diff --git a/shared/actions/search.tsx b/shared/actions/search.tsx index 3a7a5ef12e8b..25f2c1fe4407 100644 --- a/shared/actions/search.tsx +++ b/shared/actions/search.tsx @@ -377,7 +377,7 @@ const clearSearchTextInput = (state, {payload: {searchKey}}: SearchGen.UserInput }) } -function* searchSaga(): Saga.SagaGenerator { +function* searchSaga() { yield* Saga.chainGenerator(SearchGen.search, search) yield* Saga.chainAction2(SearchGen.searchSuggestions, searchSuggestions) yield* Saga.chainAction2(SearchGen.updateSelectedSearchResult, updateSelectedSearchResult) diff --git a/shared/actions/settings.tsx b/shared/actions/settings.tsx index 85d2a2061aab..fc5781a20173 100644 --- a/shared/actions/settings.tsx +++ b/shared/actions/settings.tsx @@ -746,7 +746,7 @@ const addEmail = async (state: TypedState, action: SettingsGen.AddEmailPayload, } } -function* settingsSaga(): Saga.SagaGenerator { +function* settingsSaga() { yield* Saga.chainAction2(SettingsGen.invitesReclaim, reclaimInvite) yield* Saga.chainAction2(SettingsGen.invitesRefresh, refreshInvites) yield* Saga.chainAction2(SettingsGen.invitesSend, sendInvite) diff --git a/shared/actions/signup.tsx b/shared/actions/signup.tsx index 6c8c20e6ec03..ca1d0b518b3e 100644 --- a/shared/actions/signup.tsx +++ b/shared/actions/signup.tsx @@ -147,7 +147,7 @@ const checkDevicename = async (state: Container.TypedState) => { } // Actually sign up /////////////////////////////////////////////////////////// -function* reallySignupOnNoErrors(state: Container.TypedState): Saga.SagaGenerator { +function* reallySignupOnNoErrors(state: Container.TypedState) { if (!noErrors(state)) { logger.warn('Still has errors, bailing on really signing up') return @@ -194,7 +194,7 @@ function* reallySignupOnNoErrors(state: Container.TypedState): Saga.SagaGenerato } } -const signupSaga = function*(): Saga.SagaGenerator { +const signupSaga = function*() { // validation actions yield* Saga.chainAction2(SignupGen.requestInvite, requestInvite) yield* Saga.chainAction2(SignupGen.checkUsername, checkUsername, 'checkUsername') diff --git a/shared/actions/team-building.tsx b/shared/actions/team-building.tsx index 4ac3567c3f37..c9a4ddd2ce3e 100644 --- a/shared/actions/team-building.tsx +++ b/shared/actions/team-building.tsx @@ -132,9 +132,7 @@ export function filterForNs( } } -export default function* commonSagas( - namespace: TeamBuildingTypes.AllowedNamespace -): Saga.SagaGenerator { +export default function* commonSagas(namespace: TeamBuildingTypes.AllowedNamespace) { yield* Saga.chainAction2(TeamBuildingGen.search, filterForNs(namespace, search)) yield* Saga.chainAction2(TeamBuildingGen.fetchUserRecs, filterForNs(namespace, fetchUserRecs)) // Navigation, before creating diff --git a/shared/actions/teams.tsx b/shared/actions/teams.tsx index bbc1b8d00c3f..1dd93fc33430 100644 --- a/shared/actions/teams.tsx +++ b/shared/actions/teams.tsx @@ -99,19 +99,17 @@ const getTeamProfileAddList = async (_: TypedState, action: TeamsGen.GetTeamProf } function* deleteTeam(_: TypedState, action: TeamsGen.DeleteTeamPayload) { - yield* Saga.callRPCs( - RPCTypes.teamsTeamDeleteRpcSaga({ - customResponseIncomingCallMap: { - 'keybase.1.teamsUi.confirmRootTeamDelete': (_, response) => response.result(true), - 'keybase.1.teamsUi.confirmSubteamDelete': (_, response) => response.result(true), - }, - incomingCallMap: {}, - params: { - name: action.payload.teamname, - }, - waitingKey: Constants.deleteTeamWaitingKey(action.payload.teamname), - }) - ) + yield RPCTypes.teamsTeamDeleteRpcSaga({ + customResponseIncomingCallMap: { + 'keybase.1.teamsUi.confirmRootTeamDelete': (_, response) => response.result(true), + 'keybase.1.teamsUi.confirmSubteamDelete': (_, response) => response.result(true), + }, + incomingCallMap: {}, + params: { + name: action.payload.teamname, + }, + waitingKey: Constants.deleteTeamWaitingKey(action.payload.teamname), + }) } const leaveTeam = async (_: TypedState, action: TeamsGen.LeaveTeamPayload, logger: Saga.SagaLogger) => { const {context, teamname} = action.payload @@ -1406,7 +1404,7 @@ function addThemToTeamFromTeamBuilder( ) } -function* teamBuildingSaga(): Saga.SagaGenerator { +function* teamBuildingSaga() { yield* commonTeamBuildingSaga('teams') yield* Saga.chainAction2( @@ -1415,7 +1413,7 @@ function* teamBuildingSaga(): Saga.SagaGenerator { ) } -const teamsSaga = function*(): Saga.SagaGenerator { +const teamsSaga = function*() { yield* Saga.chainAction2(TeamsGen.leaveTeam, leaveTeam, 'leaveTeam') yield* Saga.chainGenerator(TeamsGen.deleteTeam, deleteTeam, 'deleteTeam') yield* Saga.chainAction2(TeamsGen.getTeamProfileAddList, getTeamProfileAddList, 'getTeamProfileAddList') diff --git a/shared/actions/tracker2.tsx b/shared/actions/tracker2.tsx index a656b9fdfd1d..36f442aa4627 100644 --- a/shared/actions/tracker2.tsx +++ b/shared/actions/tracker2.tsx @@ -146,17 +146,15 @@ function* load(state: Container.TypedState, action: Tracker2Gen.LoadPayload) { throw new Error('No guid on profile 2 load? ' + action.payload.assertion || '') } try { - yield* Saga.callRPCs( - RPCTypes.identify3Identify3RpcSaga({ - incomingCallMap: {}, - params: { - assertion: action.payload.assertion, - guiID: action.payload.guiID, - ignoreCache: !!action.payload.ignoreCache, - }, - waitingKey: Constants.profileLoadWaitingKey, - }) - ) + yield RPCTypes.identify3Identify3RpcSaga({ + incomingCallMap: {}, + params: { + assertion: action.payload.assertion, + guiID: action.payload.guiID, + ignoreCache: !!action.payload.ignoreCache, + }, + waitingKey: Constants.profileLoadWaitingKey, + }) } catch (err) { if (err.code === RPCTypes.StatusCode.scresolutionfailed) { yield Saga.put( @@ -286,7 +284,7 @@ const loadNonUserProfile = async (_: Container.TypedState, action: Tracker2Gen.L } } -function* tracker2Saga(): Saga.SagaGenerator { +function* tracker2Saga() { yield* Saga.chainAction2(EngineGen.keybase1Identify3UiIdentify3UpdateUserCard, updateUserCard) yield* Saga.chainAction2(Tracker2Gen.changeFollow, changeFollow) yield* Saga.chainAction2(Tracker2Gen.ignore, ignore) diff --git a/shared/actions/unlock-folders.tsx b/shared/actions/unlock-folders.tsx index 846871dd15ed..f17a4d50c555 100644 --- a/shared/actions/unlock-folders.tsx +++ b/shared/actions/unlock-folders.tsx @@ -72,7 +72,7 @@ const delegateRekeyUI = ( response && response.result(session.id) } -function* unlockFoldersSaga(): Saga.SagaGenerator { +function* unlockFoldersSaga() { yield* Saga.chainGenerator( UnlockFoldersGen.checkPaperKey, checkPaperKey diff --git a/shared/actions/users.tsx b/shared/actions/users.tsx index bdbd974f7be5..3245f1c1b2e9 100644 --- a/shared/actions/users.tsx +++ b/shared/actions/users.tsx @@ -13,7 +13,7 @@ const onIdentifyUpdate = ( newlyFixed: action.payload.params.okUsernames || [], }) -function* usersSaga(): Saga.SagaGenerator { +function* usersSaga() { yield* Saga.chainAction2(EngineGen.keybase1NotifyUsersIdentifyUpdate, onIdentifyUpdate, 'onIdentifyUpdate') } diff --git a/shared/actions/wallets.tsx b/shared/actions/wallets.tsx index 78a992dbaabf..abadbee3fd91 100644 --- a/shared/actions/wallets.tsx +++ b/shared/actions/wallets.tsx @@ -13,7 +13,7 @@ import * as RouteTreeGen from './route-tree-gen' import * as Flow from '../util/flow' import * as Router2Constants from '../constants/router2' import HiddenString from '../util/hidden-string' -import logger from '../logger' +import _logger from '../logger' import * as Tabs from '../constants/tabs' import * as SettingsConstants from '../constants/settings' import * as I from 'immutable' @@ -35,7 +35,7 @@ const buildErrCatcher = (err: any) => { if (err instanceof RPCError && err.code === RPCTypes.StatusCode.sccanceled) { // ignore cancellation } else { - logger.error(`buildPayment error: ${err.message}`) + _logger.error(`buildPayment error: ${err.message}`) throw err } } @@ -219,7 +219,7 @@ function* requestPayment(state: TypedState, _: WalletsGen.RequestPaymentPayload, ) } catch (err) { buildErrCatcher(err) - return null + return false } if (!buildRes.readyToRequest) { logger.warn( @@ -233,7 +233,7 @@ function* requestPayment(state: TypedState, _: WalletsGen.RequestPaymentPayload, forBuildCounter: state.wallets.buildCounter, }) ) - return null + return false } const kbRqID: Saga.RPCPromiseType< @@ -263,6 +263,7 @@ function* requestPayment(state: TypedState, _: WalletsGen.RequestPaymentPayload, }) ), ]) + return false } const startPayment = async (state: TypedState) => { @@ -420,9 +421,9 @@ const handleSelectAccountError = (action, msg, err) => { action.payload.reason === 'auto-selected' ) { // No need to throw black bars -- handled by Reloadable. - logger.warn(errMsg) + _logger.warn(errMsg) } else { - logger.error(errMsg) + _logger.error(errMsg) throw err } } @@ -561,7 +562,7 @@ const loadSendAssetChoices = async (_: TypedState, action: WalletsGen.LoadSendAs // The result is dropped here. See PICNIC-84 for fixing it. return res && WalletsGen.createSendAssetChoicesReceived({sendAssetChoices: res}) } catch (err) { - logger.warn(`Error: ${err.desc}`) + _logger.warn(`Error: ${err.desc}`) return false } } @@ -689,7 +690,7 @@ const setAccountAsDefault = async (_: TypedState, action: WalletsGen.SetAccountA return WalletsGen.createDidSetAccountAsDefault({ accounts: (accountsAfterUpdate || []).map(account => { if (!account.accountID) { - logger.error(`Found empty accountID, name: ${account.name} isDefault: ${String(account.isDefault)}`) + _logger.error(`Found empty accountID, name: ${account.name} isDefault: ${String(account.isDefault)}`) } return Constants.accountResultToAccount(account) }), @@ -1402,7 +1403,7 @@ const addTrustline = async (state: TypedState, {payload: {accountID, assetID}}) ) return [WalletsGen.createChangedTrustline(), refresh] } catch (err) { - logger.warn(`Error: ${err.desc}`) + _logger.warn(`Error: ${err.desc}`) return [WalletsGen.createChangedTrustlineError({error: err.desc}), refresh] } } @@ -1423,7 +1424,7 @@ const deleteTrustline = async (state: TypedState, {payload: {accountID, assetID} ) return [WalletsGen.createChangedTrustline(), refresh] } catch (err) { - logger.warn(`Error: ${err.desc}`) + _logger.warn(`Error: ${err.desc}`) return [WalletsGen.createChangedTrustlineError({error: err.desc}), refresh] } } @@ -1671,9 +1672,10 @@ function* loadStaticConfig(state: TypedState, action: ConfigGen.DaemonHandshakeP }) ) } + return false } -function* walletsSaga(): Saga.SagaGenerator { +function* walletsSaga() { yield* Saga.chainAction2(WalletsGen.createNewAccount, createNewAccount, 'createNewAccount') yield* Saga.chainAction2( [ diff --git a/shared/chat/conversation/list-area/normal/index.stories.tsx b/shared/chat/conversation/list-area/normal/index.stories.tsx index c0e7564bb6ed..35ed95003962 100644 --- a/shared/chat/conversation/list-area/normal/index.stories.tsx +++ b/shared/chat/conversation/list-area/normal/index.stories.tsx @@ -24,7 +24,7 @@ const makeMoreOrdinals = ( num = __STORYSHOT__ ? 10 : 100 ): I.List => { if (direction === 'prepend') { - const oldStart = ordinals.size ? Types.ordinalToNumber(ordinals.first()) : firstOrdinal + const oldStart = ordinals.size ? Types.ordinalToNumber(ordinals.first() as Types.Ordinal) : firstOrdinal const start = Math.max(0, oldStart - num) const end = oldStart const newOrdinals: Array = [] @@ -33,7 +33,7 @@ const makeMoreOrdinals = ( } return ordinals.unshift(...newOrdinals) } else { - const oldEnd = ordinals.size ? Types.ordinalToNumber(ordinals.last()) + 1 : firstOrdinal + const oldEnd = ordinals.size ? Types.ordinalToNumber(ordinals.last() as Types.Ordinal) + 1 : firstOrdinal const start = oldEnd const end = oldEnd + num const newOrdinals: Array = [] diff --git a/shared/constants/chat2/message.tsx b/shared/constants/chat2/message.tsx index 4c7e3efad6b6..1e4d730f2bb5 100644 --- a/shared/constants/chat2/message.tsx +++ b/shared/constants/chat2/message.tsx @@ -1081,9 +1081,9 @@ export const makePendingTextMessage = ( // would cause the timer to count down while the message is still pending // and probably reset when we get the real message back. - const lastOrdinal = state.chat2.messageOrdinals - .get(conversationIDKey, I.List()) - .last(Types.numberToOrdinal(0)) + const lastOrdinal = (state.chat2.messageOrdinals.get(conversationIDKey) || I.OrderedSet()).last( + Types.numberToOrdinal(0) + ) const ordinal = nextFractionalOrdinal(lastOrdinal) const explodeInfo = explodeTime ? {exploding: true, explodingTime: Date.now() + explodeTime * 1000} : {} @@ -1115,9 +1115,9 @@ export const makePendingAttachmentMessage = ( errorReason: string | null, explodeTime?: number ) => { - const lastOrdinal = state.chat2.messageOrdinals - .get(conversationIDKey, I.List()) - .last(Types.numberToOrdinal(0)) + const lastOrdinal = (state.chat2.messageOrdinals.get(conversationIDKey) || I.OrderedSet()).last( + Types.numberToOrdinal(0) + ) const ordinal = !inOrdinal ? nextFractionalOrdinal(lastOrdinal) : inOrdinal const explodeInfo = explodeTime ? {exploding: true, explodingTime: Date.now() + explodeTime * 1000} : {} diff --git a/shared/constants/fs.tsx b/shared/constants/fs.tsx index 2458f7ff54d9..f9a9efbb062f 100644 --- a/shared/constants/fs.tsx +++ b/shared/constants/fs.tsx @@ -870,7 +870,7 @@ export const getChatTarget = (path: Types.Path, me: string): string => { if (parsedPath.writers.size + (parsedPath.readers ? parsedPath.readers.size : 0) === 2) { const notMe = parsedPath.writers.concat(parsedPath.readers || []).filter(u => u !== me) if (notMe.size === 1) { - return notMe.first() + return notMe.first() as string } } return 'group conversation' diff --git a/shared/constants/teams.tsx b/shared/constants/teams.tsx index f4331fd568db..21f2cea55447 100644 --- a/shared/constants/teams.tsx +++ b/shared/constants/teams.tsx @@ -297,7 +297,11 @@ export const userIsRoleInTeam = ( username: string, role: Types.TeamRoleType ): boolean => { - return userIsRoleInTeamWithInfo(state.teams.teamNameToMembers.get(teamname, I.Map()), username, role) + return userIsRoleInTeamWithInfo( + state.teams.teamNameToMembers.get(teamname) || I.Map(), + username, + role + ) } const getEmailInviteError = (state: TypedState) => state.teams.emailInviteError @@ -309,7 +313,10 @@ const getTeamChannelInfos = ( state: TypedState, teamname: Types.Teamname ): I.Map => { - return state.teams.teamNameToChannelInfos.get(teamname, I.Map()) + return ( + state.teams.teamNameToChannelInfos.get(teamname) || + I.Map() + ) } const getChannelInfoFromConvID = ( @@ -452,7 +459,7 @@ const isBigTeam = (state: TypedState, teamname: Types.Teamname): boolean => getTeamType(state, teamname) === 'big' const getTeamMembers = (state: TypedState, teamname: Types.Teamname): I.Map => - state.teams.teamNameToMembers.get(teamname, I.Map()) + state.teams.teamNameToMembers.get(teamname) || I.Map() const getTeamPublicitySettings = (state: TypedState, teamname: Types.Teamname): Types._PublicitySettings => state.teams.teamNameToPublicitySettings.get(teamname, { @@ -481,13 +488,13 @@ const getTeamSubteams = (state: TypedState, teamname: Types.Teamname): I.Set - state.teams.teamNameToSettings.get(teamname, makeTeamSettings()) + state.teams.teamNameToSettings.get(teamname) || makeTeamSettings() const getTeamResetUsers = (state: TypedState, teamname: Types.Teamname): I.Set => state.teams.teamNameToResetUsers.get(teamname, I.Set()) const getTeamLoadingInvites = (state: TypedState, teamname: Types.Teamname): I.Map => - state.teams.teamNameToLoadingInvites.get(teamname, I.Map()) + state.teams.teamNameToLoadingInvites.get(teamname) || I.Map() const getTeamRequests = (state: TypedState, teamname: Types.Teamname): I.Set => state.teams.teamNameToRequests.get(teamname, I.Set()) diff --git a/shared/fs/footer/upload-container.tsx b/shared/fs/footer/upload-container.tsx index 4c08c039c7d7..a4f21e1dc478 100644 --- a/shared/fs/footer/upload-container.tsx +++ b/shared/fs/footer/upload-container.tsx @@ -70,7 +70,10 @@ export const uploadsToUploadCountdownHOCProps = ( // since journal status comes a bit slower, and merging the two causes // flakes on our perception of overall upload status. endEstimate: enableDebugUploadBanner ? (uploads.endEstimate || 0) + 32000 : uploads.endEstimate || 0, - fileName: filePaths.size === 1 ? Types.getPathName(filePaths.first() || Types.stringToPath('')) : null, + fileName: + filePaths.size === 1 + ? Types.getPathName((filePaths.first() as Types.Path) || Types.stringToPath('')) + : null, files: filePaths.size, totalSyncingBytes: uploads.totalSyncingBytes, } diff --git a/shared/override-d.ts/react-native/kb-custom b/shared/override-d.ts/react-native/kb-custom index 209798bb3c9a..61faf9c6cbcc 100644 --- a/shared/override-d.ts/react-native/kb-custom +++ b/shared/override-d.ts/react-native/kb-custom @@ -1,6 +1,7 @@ // KB changes // comment out navigator // comment out globals.d.ts +// comment out geolocation // add VirtualizedList // // Type definitions for react-native 0.60 @@ -44,51 +45,45 @@ /// /// /// +/// -import * as PropTypes from 'prop-types' -import * as React from 'react' - +import * as PropTypes from "prop-types"; +import * as React from "react"; export class VirtualizedList extends React.Component> {} - -type Constructor = new (...args: any[]) => T +type Constructor = new (...args: any[]) => T; export type MeasureOnSuccessCallback = ( - x: number, - y: number, - width: number, - height: number, - pageX: number, - pageY: number -) => void - -export type MeasureInWindowOnSuccessCallback = (x: number, y: number, width: number, height: number) => void - -export type MeasureLayoutOnSuccessCallback = ( - left: number, - top: number, - width: number, - height: number -) => void + x: number, + y: number, + width: number, + height: number, + pageX: number, + pageY: number +) => void; + +export type MeasureInWindowOnSuccessCallback = (x: number, y: number, width: number, height: number) => void; + +export type MeasureLayoutOnSuccessCallback = (left: number, top: number, width: number, height: number) => void; /** * EventSubscription represents a subscription to a particular event. It can * remove its own subscription. */ interface EventSubscription { - eventType: string - key: number - subscriber: EventSubscriptionVendor + eventType: string; + key: number; + subscriber: EventSubscriptionVendor; - /** - * @param subscriber the subscriber that controls - * this subscription. - */ - new (subscriber: EventSubscriptionVendor): EventSubscription + /** + * @param subscriber the subscriber that controls + * this subscription. + */ + new (subscriber: EventSubscriptionVendor): EventSubscription; - /** - * Removes this subscription from the subscriber that controls it. - */ - remove(): void + /** + * Removes this subscription from the subscriber that controls it. + */ + remove(): void; } /** @@ -96,185 +91,185 @@ interface EventSubscription { * subscribed to a particular event type. */ interface EventSubscriptionVendor { - constructor(): EventSubscriptionVendor - - /** - * Adds a subscription keyed by an event type. - * - */ - addSubscription(eventType: string, subscription: EventSubscription): EventSubscription - - /** - * Removes a bulk set of the subscriptions. - * - * @param eventType - Optional name of the event type whose - * registered supscriptions to remove, if null remove all subscriptions. - */ - removeAllSubscriptions(eventType?: string): void - - /** - * Removes a specific subscription. Instead of calling this function, call - * `subscription.remove()` directly. - * - */ - removeSubscription(subscription: any): void - - /** - * Returns the array of subscriptions that are currently registered for the - * given event type. - * - * Note: This array can be potentially sparse as subscriptions are deleted - * from it when they are removed. - * - */ - getSubscriptionsForType(eventType: string): EventSubscription[] + constructor(): EventSubscriptionVendor; + + /** + * Adds a subscription keyed by an event type. + * + */ + addSubscription(eventType: string, subscription: EventSubscription): EventSubscription; + + /** + * Removes a bulk set of the subscriptions. + * + * @param eventType - Optional name of the event type whose + * registered supscriptions to remove, if null remove all subscriptions. + */ + removeAllSubscriptions(eventType?: string): void; + + /** + * Removes a specific subscription. Instead of calling this function, call + * `subscription.remove()` directly. + * + */ + removeSubscription(subscription: any): void; + + /** + * Returns the array of subscriptions that are currently registered for the + * given event type. + * + * Note: This array can be potentially sparse as subscriptions are deleted + * from it when they are removed. + * + */ + getSubscriptionsForType(eventType: string): EventSubscription[]; } /** * EmitterSubscription represents a subscription with listener and context data. */ interface EmitterSubscription extends EventSubscription { - emitter: EventEmitter - listener: () => any - context: any - - /** - * @param emitter - The event emitter that registered this - * subscription - * @param subscriber - The subscriber that controls - * this subscription - * @param listener - Function to invoke when the specified event is - * emitted - * @param context - Optional context object to use when invoking the - * listener - */ - new ( - emitter: EventEmitter, - subscriber: EventSubscriptionVendor, - listener: () => any, - context: any - ): EmitterSubscription - - /** - * Removes this subscription from the emitter that registered it. - * Note: we're overriding the `remove()` method of EventSubscription here - * but deliberately not calling `super.remove()` as the responsibility - * for removing the subscription lies with the EventEmitter. - */ - remove(): void + emitter: EventEmitter; + listener: () => any; + context: any; + + /** + * @param emitter - The event emitter that registered this + * subscription + * @param subscriber - The subscriber that controls + * this subscription + * @param listener - Function to invoke when the specified event is + * emitted + * @param context - Optional context object to use when invoking the + * listener + */ + new ( + emitter: EventEmitter, + subscriber: EventSubscriptionVendor, + listener: () => any, + context: any + ): EmitterSubscription; + + /** + * Removes this subscription from the emitter that registered it. + * Note: we're overriding the `remove()` method of EventSubscription here + * but deliberately not calling `super.remove()` as the responsibility + * for removing the subscription lies with the EventEmitter. + */ + remove(): void; } interface EventEmitterListener { - /** - * Adds a listener to be invoked when events of the specified type are - * emitted. An optional calling context may be provided. The data arguments - * emitted will be passed to the listener function. - * - * @param eventType - Name of the event to listen to - * @param listener - Function to invoke when the specified event is - * emitted - * @param context - Optional context object to use when invoking the - * listener - */ - addListener(eventType: string, listener: (...args: any[]) => any, context?: any): EmitterSubscription + /** + * Adds a listener to be invoked when events of the specified type are + * emitted. An optional calling context may be provided. The data arguments + * emitted will be passed to the listener function. + * + * @param eventType - Name of the event to listen to + * @param listener - Function to invoke when the specified event is + * emitted + * @param context - Optional context object to use when invoking the + * listener + */ + addListener(eventType: string, listener: (...args: any[]) => any, context?: any): EmitterSubscription; } interface EventEmitter extends EventEmitterListener { - /** - * - * @param subscriber - Optional subscriber instance - * to use. If omitted, a new subscriber will be created for the emitter. - */ - new (subscriber?: EventSubscriptionVendor): EventEmitter - - /** - * Similar to addListener, except that the listener is removed after it is - * invoked once. - * - * @param eventType - Name of the event to listen to - * @param listener - Function to invoke only once when the - * specified event is emitted - * @param context - Optional context object to use when invoking the - * listener - */ - once(eventType: string, listener: (...args: any[]) => any, context: any): EmitterSubscription - - /** - * Removes all of the registered listeners, including those registered as - * listener maps. - * - * @param eventType - Optional name of the event whose registered - * listeners to remove - */ - removeAllListeners(eventType?: string): void - - /** - * Provides an API that can be called during an eventing cycle to remove the - * last listener that was invoked. This allows a developer to provide an event - * object that can remove the listener (or listener map) during the - * invocation. - * - * If it is called when not inside of an emitting cycle it will throw. - * - * @throws {Error} When called not during an eventing cycle - * - * @example - * const subscription = emitter.addListenerMap({ - * someEvent: function(data, event) { - * console.log(data); - * emitter.removeCurrentListener(); - * } - * }); - * - * emitter.emit('someEvent', 'abc'); // logs 'abc' - * emitter.emit('someEvent', 'def'); // does not log anything - */ - removeCurrentListener(): void - - /** - * Removes a specific subscription. Called by the `remove()` method of the - * subscription itself to ensure any necessary cleanup is performed. - */ - removeSubscription(subscription: EmitterSubscription): void - - /** - * Returns an array of listeners that are currently registered for the given - * event. - * - * @param eventType - Name of the event to query - */ - listeners(eventType: string): EmitterSubscription[] - - /** - * Emits an event of the given type with the given data. All handlers of that - * particular type will be notified. - * - * @param eventType - Name of the event to emit - * @param Arbitrary arguments to be passed to each registered listener - * - * @example - * emitter.addListener('someEvent', function(message) { - * console.log(message); - * }); - * - * emitter.emit('someEvent', 'abc'); // logs 'abc' - */ - emit(eventType: string, ...params: any[]): void - - /** - * Removes the given listener for event of specific type. - * - * @param eventType - Name of the event to emit - * @param listener - Function to invoke when the specified event is - * emitted - * - * @example - * emitter.removeListener('someEvent', function(message) { - * console.log(message); - * }); // removes the listener if already registered - * - */ - removeListener(eventType: string, listener: (...args: any[]) => any): void + /** + * + * @param subscriber - Optional subscriber instance + * to use. If omitted, a new subscriber will be created for the emitter. + */ + new (subscriber?: EventSubscriptionVendor): EventEmitter; + + /** + * Similar to addListener, except that the listener is removed after it is + * invoked once. + * + * @param eventType - Name of the event to listen to + * @param listener - Function to invoke only once when the + * specified event is emitted + * @param context - Optional context object to use when invoking the + * listener + */ + once(eventType: string, listener: (...args: any[]) => any, context: any): EmitterSubscription; + + /** + * Removes all of the registered listeners, including those registered as + * listener maps. + * + * @param eventType - Optional name of the event whose registered + * listeners to remove + */ + removeAllListeners(eventType?: string): void; + + /** + * Provides an API that can be called during an eventing cycle to remove the + * last listener that was invoked. This allows a developer to provide an event + * object that can remove the listener (or listener map) during the + * invocation. + * + * If it is called when not inside of an emitting cycle it will throw. + * + * @throws {Error} When called not during an eventing cycle + * + * @example + * const subscription = emitter.addListenerMap({ + * someEvent: function(data, event) { + * console.log(data); + * emitter.removeCurrentListener(); + * } + * }); + * + * emitter.emit('someEvent', 'abc'); // logs 'abc' + * emitter.emit('someEvent', 'def'); // does not log anything + */ + removeCurrentListener(): void; + + /** + * Removes a specific subscription. Called by the `remove()` method of the + * subscription itself to ensure any necessary cleanup is performed. + */ + removeSubscription(subscription: EmitterSubscription): void; + + /** + * Returns an array of listeners that are currently registered for the given + * event. + * + * @param eventType - Name of the event to query + */ + listeners(eventType: string): EmitterSubscription[]; + + /** + * Emits an event of the given type with the given data. All handlers of that + * particular type will be notified. + * + * @param eventType - Name of the event to emit + * @param Arbitrary arguments to be passed to each registered listener + * + * @example + * emitter.addListener('someEvent', function(message) { + * console.log(message); + * }); + * + * emitter.emit('someEvent', 'abc'); // logs 'abc' + */ + emit(eventType: string, ...params: any[]): void; + + /** + * Removes the given listener for event of specific type. + * + * @param eventType - Name of the event to emit + * @param listener - Function to invoke when the specified event is + * emitted + * + * @example + * emitter.removeListener('someEvent', function(message) { + * console.log(message); + * }); // removes the listener if already registered + * + */ + removeListener(eventType: string, listener: (...args: any[]) => any): void; } /** NativeMethodsMixin provides methods to access the underlying native component directly. @@ -287,157 +282,157 @@ interface EventEmitter extends EventEmitterListener { * @see https://github.com/facebook/react-native/blob/master/Libraries/ReactIOS/NativeMethodsMixin.js */ export interface NativeMethodsMixinStatic { - /** - * Determines the location on screen, width, and height of the given view and - * returns the values via an async callback. If successful, the callback will - * be called with the following arguments: - * - * - x - * - y - * - width - * - height - * - pageX - * - pageY - * - * Note that these measurements are not available until after the rendering - * has been completed in native. If you need the measurements as soon as - * possible, consider using the [`onLayout` - * prop](docs/view.html#onlayout) instead. - */ - measure(callback: MeasureOnSuccessCallback): void - - /** - * Determines the location of the given view in the window and returns the - * values via an async callback. If the React root view is embedded in - * another native view, this will give you the absolute coordinates. If - * successful, the callback will be called with the following - * arguments: - * - * - x - * - y - * - width - * - height - * - * Note that these measurements are not available until after the rendering - * has been completed in native. - */ - measureInWindow(callback: MeasureInWindowOnSuccessCallback): void - - /** - * Like [`measure()`](#measure), but measures the view relative an ancestor, - * specified as `relativeToNativeNode`. This means that the returned x, y - * are relative to the origin x, y of the ancestor view. - * - * As always, to obtain a native node handle for a component, you can use - * `React.findNodeHandle(component)`. - */ - measureLayout( - relativeToNativeNode: number, - onSuccess: MeasureLayoutOnSuccessCallback, - onFail: () => void /* currently unused */ - ): void - - /** - * This function sends props straight to native. They will not participate in - * future diff process - this means that if you do not include them in the - * next render, they will remain active (see [Direct - * Manipulation](docs/direct-manipulation.html)). - */ - setNativeProps(nativeProps: Object): void - - /** - * Requests focus for the given input or view. The exact behavior triggered - * will depend on the platform and type of view. - */ - focus(): void - - /** - * Removes focus from an input or view. This is the opposite of `focus()`. - */ - blur(): void - - refs: { - [key: string]: React.Component - } + /** + * Determines the location on screen, width, and height of the given view and + * returns the values via an async callback. If successful, the callback will + * be called with the following arguments: + * + * - x + * - y + * - width + * - height + * - pageX + * - pageY + * + * Note that these measurements are not available until after the rendering + * has been completed in native. If you need the measurements as soon as + * possible, consider using the [`onLayout` + * prop](docs/view.html#onlayout) instead. + */ + measure(callback: MeasureOnSuccessCallback): void; + + /** + * Determines the location of the given view in the window and returns the + * values via an async callback. If the React root view is embedded in + * another native view, this will give you the absolute coordinates. If + * successful, the callback will be called with the following + * arguments: + * + * - x + * - y + * - width + * - height + * + * Note that these measurements are not available until after the rendering + * has been completed in native. + */ + measureInWindow(callback: MeasureInWindowOnSuccessCallback): void; + + /** + * Like [`measure()`](#measure), but measures the view relative an ancestor, + * specified as `relativeToNativeNode`. This means that the returned x, y + * are relative to the origin x, y of the ancestor view. + * + * As always, to obtain a native node handle for a component, you can use + * `React.findNodeHandle(component)`. + */ + measureLayout( + relativeToNativeNode: number, + onSuccess: MeasureLayoutOnSuccessCallback, + onFail: () => void /* currently unused */ + ): void; + + /** + * This function sends props straight to native. They will not participate in + * future diff process - this means that if you do not include them in the + * next render, they will remain active (see [Direct + * Manipulation](docs/direct-manipulation.html)). + */ + setNativeProps(nativeProps: Object): void; + + /** + * Requests focus for the given input or view. The exact behavior triggered + * will depend on the platform and type of view. + */ + focus(): void; + + /** + * Removes focus from an input or view. This is the opposite of `focus()`. + */ + blur(): void; + + refs: { + [key: string]: React.Component; + }; } // see react-jsx.d.ts export function createElement

( - type: React.ReactType, - props?: P, - ...children: React.ReactNode[] -): React.ReactElement

+ type: React.ReactType, + props?: P, + ...children: React.ReactNode[] +): React.ReactElement

; -export type Runnable = (appParameters: any) => void +export type Runnable = (appParameters: any) => void; -type Task = (taskData: any) => Promise -type TaskProvider = () => Task +type Task = (taskData: any) => Promise; +type TaskProvider = () => Task; -type NodeHandle = number +type NodeHandle = number; // Similar to React.SyntheticEvent except for nativeEvent export interface NativeSyntheticEvent extends React.BaseSyntheticEvent {} export interface NativeTouchEvent { - /** - * Array of all touch events that have changed since the last event - */ - changedTouches: NativeTouchEvent[] - - /** - * The ID of the touch - */ - identifier: string - - /** - * The X position of the touch, relative to the element - */ - locationX: number - - /** - * The Y position of the touch, relative to the element - */ - locationY: number - - /** - * The X position of the touch, relative to the screen - */ - pageX: number - - /** - * The Y position of the touch, relative to the screen - */ - pageY: number - - /** - * The node id of the element receiving the touch event - */ - target: string - - /** - * A time identifier for the touch, useful for velocity calculation - */ - timestamp: number - - /** - * Array of all current touches on the screen - */ - touches: NativeTouchEvent[] + /** + * Array of all touch events that have changed since the last event + */ + changedTouches: NativeTouchEvent[]; + + /** + * The ID of the touch + */ + identifier: string; + + /** + * The X position of the touch, relative to the element + */ + locationX: number; + + /** + * The Y position of the touch, relative to the element + */ + locationY: number; + + /** + * The X position of the touch, relative to the screen + */ + pageX: number; + + /** + * The Y position of the touch, relative to the screen + */ + pageY: number; + + /** + * The node id of the element receiving the touch event + */ + target: string; + + /** + * A time identifier for the touch, useful for velocity calculation + */ + timestamp: number; + + /** + * Array of all current touches on the screen + */ + touches: NativeTouchEvent[]; } export interface GestureResponderEvent extends NativeSyntheticEvent {} // See https://facebook.github.io/react-native/docs/scrollview.html#contentoffset export interface PointPropType { - x: number - y: number + x: number; + y: number; } export interface Insets { - top?: number - left?: number - bottom?: number - right?: number + top?: number; + left?: number; + bottom?: number; + right?: number; } /** @@ -445,20 +440,20 @@ export interface Insets { * @see React.DOMAtributes */ export interface Touchable { - onTouchStart?: (event: GestureResponderEvent) => void - onTouchMove?: (event: GestureResponderEvent) => void - onTouchEnd?: (event: GestureResponderEvent) => void - onTouchCancel?: (event: GestureResponderEvent) => void - onTouchEndCapture?: (event: GestureResponderEvent) => void + onTouchStart?: (event: GestureResponderEvent) => void; + onTouchMove?: (event: GestureResponderEvent) => void; + onTouchEnd?: (event: GestureResponderEvent) => void; + onTouchCancel?: (event: GestureResponderEvent) => void; + onTouchEndCapture?: (event: GestureResponderEvent) => void; } -export type ComponentProvider = () => React.ComponentType +export type ComponentProvider = () => React.ComponentType; export type AppConfig = { - appKey: string - component?: ComponentProvider - run?: Runnable -} + appKey: string; + component?: ComponentProvider; + run?: Runnable; +}; // https://github.com/facebook/react-native/blob/master/Libraries/AppRegistry/AppRegistry.js /** @@ -477,81 +472,81 @@ export type AppConfig = { * `require`d. */ export namespace AppRegistry { - function registerConfig(config: AppConfig[]): void + function registerConfig(config: AppConfig[]): void; - function registerComponent(appKey: string, getComponentFunc: ComponentProvider): string + function registerComponent(appKey: string, getComponentFunc: ComponentProvider): string; - function registerRunnable(appKey: string, func: Runnable): string + function registerRunnable(appKey: string, func: Runnable): string; - function getAppKeys(): string[] + function getAppKeys(): string[]; - function unmountApplicationComponentAtRootTag(rootTag: number): void + function unmountApplicationComponentAtRootTag(rootTag: number): void; - function runApplication(appKey: string, appParameters: any): void + function runApplication(appKey: string, appParameters: any): void; - function registerHeadlessTask(appKey: string, task: TaskProvider): void + function registerHeadlessTask(appKey: string, task: TaskProvider): void; - function getRunnable(appKey: string): Runnable | undefined + function getRunnable(appKey: string): Runnable | undefined; } export interface LayoutAnimationTypes { - spring: string - linear: string - easeInEaseOut: string - easeIn: string - easeOut: string - keyboard: string + spring: string; + linear: string; + easeInEaseOut: string; + easeIn: string; + easeOut: string; + keyboard: string; } export interface LayoutAnimationProperties { - opacity: string - scaleXY: string + opacity: string; + scaleXY: string; } export interface LayoutAnimationAnim { - duration?: number - delay?: number - springDamping?: number - initialVelocity?: number - type?: string //LayoutAnimationTypes - property?: string //LayoutAnimationProperties + duration?: number; + delay?: number; + springDamping?: number; + initialVelocity?: number; + type?: string; //LayoutAnimationTypes + property?: string; //LayoutAnimationProperties } export interface LayoutAnimationConfig { - duration: number - create?: LayoutAnimationAnim - update?: LayoutAnimationAnim - delete?: LayoutAnimationAnim + duration: number; + create?: LayoutAnimationAnim; + update?: LayoutAnimationAnim; + delete?: LayoutAnimationAnim; } /** Automatically animates views to their new positions when the next layout happens. * A common way to use this API is to call LayoutAnimation.configureNext before * calling setState. */ export interface LayoutAnimationStatic { - /** Schedules an animation to happen on the next layout. - * @param config Specifies animation properties: - * `duration` in milliseconds - * `create`, config for animating in new views (see Anim type) - * `update`, config for animating views that have been updated (see Anim type) - * @param onAnimationDidEnd Called when the animation finished. Only supported on iOS. - */ - configureNext: (config: LayoutAnimationConfig, onAnimationDidEnd?: () => void) => void - /** Helper for creating a config for configureNext. */ - create: (duration: number, type?: string, creationProp?: string) => LayoutAnimationConfig - Types: LayoutAnimationTypes - Properties: LayoutAnimationProperties - configChecker: (shapeTypes: {[key: string]: any}) => any - Presets: { - easeInEaseOut: LayoutAnimationConfig - linear: LayoutAnimationConfig - spring: LayoutAnimationConfig - } - easeInEaseOut: (onAnimationDidEnd?: () => void) => void - linear: (onAnimationDidEnd?: () => void) => void - spring: (onAnimationDidEnd?: () => void) => void -} - -type FlexAlignType = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline' + /** Schedules an animation to happen on the next layout. + * @param config Specifies animation properties: + * `duration` in milliseconds + * `create`, config for animating in new views (see Anim type) + * `update`, config for animating views that have been updated (see Anim type) + * @param onAnimationDidEnd Called when the animation finished. Only supported on iOS. + */ + configureNext: (config: LayoutAnimationConfig, onAnimationDidEnd?: () => void) => void; + /** Helper for creating a config for configureNext. */ + create: (duration: number, type?: string, creationProp?: string) => LayoutAnimationConfig; + Types: LayoutAnimationTypes; + Properties: LayoutAnimationProperties; + configChecker: (shapeTypes: { [key: string]: any }) => any; + Presets: { + easeInEaseOut: LayoutAnimationConfig; + linear: LayoutAnimationConfig; + spring: LayoutAnimationConfig; + }; + easeInEaseOut: (onAnimationDidEnd?: () => void) => void; + linear: (onAnimationDidEnd?: () => void) => void; + spring: (onAnimationDidEnd?: () => void) => void; +} + +type FlexAlignType = "flex-start" | "flex-end" | "center" | "stretch" | "baseline"; /** * Flex Prop Types @@ -560,389 +555,384 @@ type FlexAlignType = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baselin * @see https://github.com/facebook/react-native/blob/master/Libraries/StyleSheet/LayoutPropTypes.js */ export interface FlexStyle { - alignContent?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'space-between' | 'space-around' - alignItems?: FlexAlignType - alignSelf?: 'auto' | FlexAlignType - aspectRatio?: number - borderBottomWidth?: number - borderEndWidth?: number | string - borderLeftWidth?: number - borderRightWidth?: number - borderStartWidth?: number | string - borderTopWidth?: number - borderWidth?: number - bottom?: number | string - display?: 'none' | 'flex' - end?: number | string - flex?: number - flexBasis?: number | string - flexDirection?: 'row' | 'column' | 'row-reverse' | 'column-reverse' - flexGrow?: number - flexShrink?: number - flexWrap?: 'wrap' | 'nowrap' | 'wrap-reverse' - height?: number | string - justifyContent?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly' - left?: number | string - margin?: number | string - marginBottom?: number | string - marginEnd?: number | string - marginHorizontal?: number | string - marginLeft?: number | string - marginRight?: number | string - marginStart?: number | string - marginTop?: number | string - marginVertical?: number | string - maxHeight?: number | string - maxWidth?: number | string - minHeight?: number | string - minWidth?: number | string - overflow?: 'visible' | 'hidden' | 'scroll' - padding?: number | string - paddingBottom?: number | string - paddingEnd?: number | string - paddingHorizontal?: number | string - paddingLeft?: number | string - paddingRight?: number | string - paddingStart?: number | string - paddingTop?: number | string - paddingVertical?: number | string - position?: 'absolute' | 'relative' - right?: number | string - start?: number | string - top?: number | string - width?: number | string - zIndex?: number - - /** - * @platform ios - */ - direction?: 'inherit' | 'ltr' | 'rtl' + alignContent?: "flex-start" | "flex-end" | "center" | "stretch" | "space-between" | "space-around"; + alignItems?: FlexAlignType; + alignSelf?: "auto" | FlexAlignType; + aspectRatio?: number; + borderBottomWidth?: number; + borderEndWidth?: number | string; + borderLeftWidth?: number; + borderRightWidth?: number; + borderStartWidth?: number | string; + borderTopWidth?: number; + borderWidth?: number; + bottom?: number | string; + display?: "none" | "flex"; + end?: number | string; + flex?: number; + flexBasis?: number | string; + flexDirection?: "row" | "column" | "row-reverse" | "column-reverse"; + flexGrow?: number; + flexShrink?: number; + flexWrap?: "wrap" | "nowrap" | "wrap-reverse"; + height?: number | string; + justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly"; + left?: number | string; + margin?: number | string; + marginBottom?: number | string; + marginEnd?: number | string; + marginHorizontal?: number | string; + marginLeft?: number | string; + marginRight?: number | string; + marginStart?: number | string; + marginTop?: number | string; + marginVertical?: number | string; + maxHeight?: number | string; + maxWidth?: number | string; + minHeight?: number | string; + minWidth?: number | string; + overflow?: "visible" | "hidden" | "scroll"; + padding?: number | string; + paddingBottom?: number | string; + paddingEnd?: number | string; + paddingHorizontal?: number | string; + paddingLeft?: number | string; + paddingRight?: number | string; + paddingStart?: number | string; + paddingTop?: number | string; + paddingVertical?: number | string; + position?: "absolute" | "relative"; + right?: number | string; + start?: number | string; + top?: number | string; + width?: number | string; + zIndex?: number; + + /** + * @platform ios + */ + direction?: "inherit" | "ltr" | "rtl"; } /** * @see ShadowPropTypesIOS.js */ export interface ShadowPropTypesIOSStatic { - /** - * Sets the drop shadow color - * @platform ios - */ - shadowColor: string - - /** - * Sets the drop shadow offset - * @platform ios - */ - shadowOffset: {width: number; height: number} - - /** - * Sets the drop shadow opacity (multiplied by the color's alpha component) - * @platform ios - */ - shadowOpacity: number - - /** - * Sets the drop shadow blur radius - * @platform ios - */ - shadowRadius: number + /** + * Sets the drop shadow color + * @platform ios + */ + shadowColor: string; + + /** + * Sets the drop shadow offset + * @platform ios + */ + shadowOffset: { width: number; height: number }; + + /** + * Sets the drop shadow opacity (multiplied by the color's alpha component) + * @platform ios + */ + shadowOpacity: number; + + /** + * Sets the drop shadow blur radius + * @platform ios + */ + shadowRadius: number; } type GeoConfiguration = { - skipPermissionRequests: boolean -} + skipPermissionRequests: boolean; +}; type GeoOptions = { - timeout?: number - maximumAge?: number - enableHighAccuracy?: boolean - distanceFilter?: number - useSignificantChanges?: boolean -} + timeout?: number; + maximumAge?: number; + enableHighAccuracy?: boolean; + distanceFilter?: number; + useSignificantChanges?: boolean; +}; type GeolocationReturnType = { - coords: { - latitude: number - longitude: number - altitude: number | null - accuracy: number - altitudeAccuracy: number | null - heading: number | null - speed: number | null - } - timestamp: number -} + coords: { + latitude: number; + longitude: number; + altitude: number | null; + accuracy: number; + altitudeAccuracy: number | null; + heading: number | null; + speed: number | null; + }; + timestamp: number; +}; type GeolocationError = { - code: number - message: string - PERMISSION_DENIED: number - POSITION_UNAVAILABLE: number - TIMEOUT: number -} + code: number; + message: string; + PERMISSION_DENIED: number; + POSITION_UNAVAILABLE: number; + TIMEOUT: number; +}; interface PerpectiveTransform { - perspective: number + perspective: number; } interface RotateTransform { - rotate: string + rotate: string; } interface RotateXTransform { - rotateX: string + rotateX: string; } interface RotateYTransform { - rotateY: string + rotateY: string; } interface RotateZTransform { - rotateZ: string + rotateZ: string; } interface ScaleTransform { - scale: number + scale: number; } interface ScaleXTransform { - scaleX: number + scaleX: number; } interface ScaleYTransform { - scaleY: number + scaleY: number; } interface TranslateXTransform { - translateX: number + translateX: number; } interface TranslateYTransform { - translateY: number + translateY: number; } interface SkewXTransform { - skewX: string + skewX: string; } interface SkewYTransform { - skewY: string + skewY: string; } export interface TransformsStyle { - transform?: ( - | PerpectiveTransform - | RotateTransform - | RotateXTransform - | RotateYTransform - | RotateZTransform - | ScaleTransform - | ScaleXTransform - | ScaleYTransform - | TranslateXTransform - | TranslateYTransform - | SkewXTransform - | SkewYTransform)[] - transformMatrix?: Array - rotation?: number - scaleX?: number - scaleY?: number - translateX?: number - translateY?: number + transform?: ( + | PerpectiveTransform + | RotateTransform + | RotateXTransform + | RotateYTransform + | RotateZTransform + | ScaleTransform + | ScaleXTransform + | ScaleYTransform + | TranslateXTransform + | TranslateYTransform + | SkewXTransform + | SkewYTransform)[]; + transformMatrix?: Array; + rotation?: number; + scaleX?: number; + scaleY?: number; + translateX?: number; + translateY?: number; } export interface StyleSheetProperties { - hairlineWidth: number - flatten(style: T): T + hairlineWidth: number; + flatten(style: T): T; } export interface LayoutRectangle { - x: number - y: number - width: number - height: number + x: number; + y: number; + width: number; + height: number; } // @see TextProps.onLayout export interface LayoutChangeEvent { - nativeEvent: { - layout: LayoutRectangle - } + nativeEvent: { + layout: LayoutRectangle; + }; } -export type FontVariant = - | 'small-caps' - | 'oldstyle-nums' - | 'lining-nums' - | 'tabular-nums' - | 'proportional-nums' +export type FontVariant = 'small-caps' | 'oldstyle-nums' | 'lining-nums' | 'tabular-nums' | 'proportional-nums'; export interface TextStyleIOS extends ViewStyle { - fontVariant?: FontVariant[] - letterSpacing?: number - textDecorationColor?: string - textDecorationStyle?: 'solid' | 'double' | 'dotted' | 'dashed' - textTransform?: 'none' | 'capitalize' | 'uppercase' | 'lowercase' - writingDirection?: 'auto' | 'ltr' | 'rtl' + fontVariant?: FontVariant[]; + letterSpacing?: number; + textDecorationColor?: string; + textDecorationStyle?: "solid" | "double" | "dotted" | "dashed"; + textTransform?: "none" | "capitalize" | "uppercase" | "lowercase"; + writingDirection?: "auto" | "ltr" | "rtl"; } export interface TextStyleAndroid extends ViewStyle { - textAlignVertical?: 'auto' | 'top' | 'bottom' | 'center' - includeFontPadding?: boolean + textAlignVertical?: "auto" | "top" | "bottom" | "center"; + includeFontPadding?: boolean; } // @see https://facebook.github.io/react-native/docs/text.html#style export interface TextStyle extends TextStyleIOS, TextStyleAndroid, ViewStyle { - color?: string - fontFamily?: string - fontSize?: number - fontStyle?: 'normal' | 'italic' - /** - * Specifies font weight. The values 'normal' and 'bold' are supported - * for most fonts. Not all fonts have a variant for each of the numeric - * values, in that case the closest one is chosen. - */ - fontWeight?: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' - letterSpacing?: number - lineHeight?: number - textAlign?: 'auto' | 'left' | 'right' | 'center' | 'justify' - textDecorationLine?: 'none' | 'underline' | 'line-through' | 'underline line-through' - textDecorationStyle?: 'solid' | 'double' | 'dotted' | 'dashed' - textDecorationColor?: string - textShadowColor?: string - textShadowOffset?: {width: number; height: number} - textShadowRadius?: number - testID?: string + color?: string; + fontFamily?: string; + fontSize?: number; + fontStyle?: "normal" | "italic"; + /** + * Specifies font weight. The values 'normal' and 'bold' are supported + * for most fonts. Not all fonts have a variant for each of the numeric + * values, in that case the closest one is chosen. + */ + fontWeight?: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900"; + letterSpacing?: number; + lineHeight?: number; + textAlign?: "auto" | "left" | "right" | "center" | "justify"; + textDecorationLine?: "none" | "underline" | "line-through" | "underline line-through"; + textDecorationStyle?: "solid" | "double" | "dotted" | "dashed"; + textDecorationColor?: string; + textShadowColor?: string; + textShadowOffset?: { width: number; height: number }; + textShadowRadius?: number; + testID?: string; } export interface TextPropsIOS { - /** - * Specifies whether font should be scaled down automatically to fit given style constraints. - */ - adjustsFontSizeToFit?: boolean + /** + * Specifies whether font should be scaled down automatically to fit given style constraints. + */ + adjustsFontSizeToFit?: boolean; - /** - * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0). - */ - minimumFontScale?: number + /** + * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0). + */ + minimumFontScale?: number; - /** - * When `true`, no visual change is made when text is pressed down. By - * default, a gray oval highlights the text on press down. - */ - suppressHighlighting?: boolean + /** + * When `true`, no visual change is made when text is pressed down. By + * default, a gray oval highlights the text on press down. + */ + suppressHighlighting?: boolean; } export interface TextPropsAndroid { - /** - * Lets the user select text, to use the native copy and paste functionality. - */ - selectable?: boolean + /** + * Lets the user select text, to use the native copy and paste functionality. + */ + selectable?: boolean; - /** - * The highlight color of the text. - */ - selectionColor?: string + /** + * The highlight color of the text. + */ + selectionColor?: string; - /** - * Set text break strategy on Android API Level 23+ - * default is `highQuality`. - */ - textBreakStrategy?: 'simple' | 'highQuality' | 'balanced' + /** + * Set text break strategy on Android API Level 23+ + * default is `highQuality`. + */ + textBreakStrategy?: "simple" | "highQuality" | "balanced"; } // https://facebook.github.io/react-native/docs/text.html#props export interface TextProps extends TextPropsIOS, TextPropsAndroid, AccessibilityProps { - /** - * Specifies whether fonts should scale to respect Text Size accessibility settings. - * The default is `true`. - */ - allowFontScaling?: boolean - - /** - * This can be one of the following values: - * - * - `head` - The line is displayed so that the end fits in the container and the missing text - * at the beginning of the line is indicated by an ellipsis glyph. e.g., "...wxyz" - * - `middle` - The line is displayed so that the beginning and end fit in the container and the - * missing text in the middle is indicated by an ellipsis glyph. "ab...yz" - * - `tail` - The line is displayed so that the beginning fits in the container and the - * missing text at the end of the line is indicated by an ellipsis glyph. e.g., "abcd..." - * - `clip` - Lines are not drawn past the edge of the text container. - * - * The default is `tail`. - * - * `numberOfLines` must be set in conjunction with this prop. - * - * > `clip` is working only for iOS - */ - ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip' - - /** - * Line Break mode. Works only with numberOfLines. - * clip is working only for iOS - */ - lineBreakMode?: 'head' | 'middle' | 'tail' | 'clip' - - /** - * Used to truncate the text with an ellipsis after computing the text - * layout, including line wrapping, such that the total number of lines - * does not exceed this number. - * - * This prop is commonly used with `ellipsizeMode`. - */ - numberOfLines?: number - - /** - * Invoked on mount and layout changes with - * - * {nativeEvent: { layout: {x, y, width, height}}}. - */ - onLayout?: (event: LayoutChangeEvent) => void - - /** - * This function is called on press. - * Text intrinsically supports press handling with a default highlight state (which can be disabled with suppressHighlighting). - */ - onPress?: (event: GestureResponderEvent) => void - - /** - * This function is called on long press. - * e.g., `onLongPress={this.increaseSize}>`` - */ - onLongPress?: (event: GestureResponderEvent) => void - - /** - * @see https://facebook.github.io/react-native/docs/text.html#style - */ - style?: StyleProp - - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string - - /** - * Used to reference react managed views from native code. - */ - nativeID?: string - - /** - * Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: - * - null/undefined (default): inherit from the parent node or the global default (0) - * - 0: no max, ignore parent/global default - * - >= 1: sets the maxFontSizeMultiplier of this node to this value - */ - maxFontSizeMultiplier?: number | null + /** + * Specifies whether fonts should scale to respect Text Size accessibility settings. + * The default is `true`. + */ + allowFontScaling?: boolean; + + /** + * This can be one of the following values: + * + * - `head` - The line is displayed so that the end fits in the container and the missing text + * at the beginning of the line is indicated by an ellipsis glyph. e.g., "...wxyz" + * - `middle` - The line is displayed so that the beginning and end fit in the container and the + * missing text in the middle is indicated by an ellipsis glyph. "ab...yz" + * - `tail` - The line is displayed so that the beginning fits in the container and the + * missing text at the end of the line is indicated by an ellipsis glyph. e.g., "abcd..." + * - `clip` - Lines are not drawn past the edge of the text container. + * + * The default is `tail`. + * + * `numberOfLines` must be set in conjunction with this prop. + * + * > `clip` is working only for iOS + */ + ellipsizeMode?: "head" | "middle" | "tail" | "clip"; + + /** + * Line Break mode. Works only with numberOfLines. + * clip is working only for iOS + */ + lineBreakMode?: "head" | "middle" | "tail" | "clip"; + + /** + * Used to truncate the text with an ellipsis after computing the text + * layout, including line wrapping, such that the total number of lines + * does not exceed this number. + * + * This prop is commonly used with `ellipsizeMode`. + */ + numberOfLines?: number; + + /** + * Invoked on mount and layout changes with + * + * {nativeEvent: { layout: {x, y, width, height}}}. + */ + onLayout?: (event: LayoutChangeEvent) => void; + + /** + * This function is called on press. + * Text intrinsically supports press handling with a default highlight state (which can be disabled with suppressHighlighting). + */ + onPress?: (event: GestureResponderEvent) => void; + + /** + * This function is called on long press. + * e.g., `onLongPress={this.increaseSize}>`` + */ + onLongPress?: (event: GestureResponderEvent) => void; + + /** + * @see https://facebook.github.io/react-native/docs/text.html#style + */ + style?: StyleProp; + + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; + + /** + * Used to reference react managed views from native code. + */ + nativeID?: string; + + /** + * Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: + * - null/undefined (default): inherit from the parent node or the global default (0) + * - 0: no max, ignore parent/global default + * - >= 1: sets the maxFontSizeMultiplier of this node to this value + */ + maxFontSizeMultiplier?: number | null; } /** * A React component for displaying text which supports nesting, styling, and touch handling. */ declare class TextComponent extends React.Component {} -declare const TextBase: Constructor & typeof TextComponent +declare const TextBase: Constructor & typeof TextComponent; export class Text extends TextBase {} -type DataDetectorTypes = 'phoneNumber' | 'link' | 'address' | 'calendarEvent' | 'none' | 'all' +type DataDetectorTypes = "phoneNumber" | "link" | "address" | "calendarEvent" | "none" | "all"; /** * DocumentSelectionState is responsible for maintaining selection information @@ -954,33 +944,33 @@ type DataDetectorTypes = 'phoneNumber' | 'link' | 'address' | 'calendarEvent' | * components re-render. */ export interface DocumentSelectionState extends EventEmitter { - new (anchor: number, focus: number): DocumentSelectionState - - /** - * Apply an update to the state. If either offset value has changed, - * set the values and emit the `change` event. Otherwise no-op. - * - */ - update(anchor: number, focus: number): void - - /** - * Given a max text length, constrain our selection offsets to ensure - * that the selection remains strictly within the text range. - * - */ - constrainLength(maxLength: number): void - - focus(): void - blur(): void - hasFocus(): boolean - isCollapsed(): boolean - isBackward(): boolean - - getAnchorOffset(): number - getFocusOffset(): number - getStartOffset(): number - getEndOffset(): number - overlaps(start: number, end: number): boolean + new (anchor: number, focus: number): DocumentSelectionState; + + /** + * Apply an update to the state. If either offset value has changed, + * set the values and emit the `change` event. Otherwise no-op. + * + */ + update(anchor: number, focus: number): void; + + /** + * Given a max text length, constrain our selection offsets to ensure + * that the selection remains strictly within the text range. + * + */ + constrainLength(maxLength: number): void; + + focus(): void; + blur(): void; + hasFocus(): boolean; + isCollapsed(): boolean; + isBackward(): boolean; + + getAnchorOffset(): number; + getFocusOffset(): number; + getStartOffset(): number; + getEndOffset(): number; + overlaps(start: number, end: number): boolean; } /** @@ -988,135 +978,135 @@ export interface DocumentSelectionState extends EventEmitter { * @see https://facebook.github.io/react-native/docs/textinput.html#props */ export interface TextInputIOSProps { - /** - * enum('never', 'while-editing', 'unless-editing', 'always') - * When the clear button should appear on the right side of the text view - */ - clearButtonMode?: 'never' | 'while-editing' | 'unless-editing' | 'always' - - /** - * If true, clears the text field automatically when editing begins - */ - clearTextOnFocus?: boolean - - /** - * Determines the types of data converted to clickable URLs in the text input. - * Only valid if `multiline={true}` and `editable={false}`. - * By default no data types are detected. - * - * You can provide one type or an array of many types. - * - * Possible values for `dataDetectorTypes` are: - * - * - `'phoneNumber'` - * - `'link'` - * - `'address'` - * - `'calendarEvent'` - * - `'none'` - * - `'all'` - */ - dataDetectorTypes?: DataDetectorTypes | DataDetectorTypes[] - - /** - * If true, the keyboard disables the return key when there is no text and automatically enables it when there is text. - * The default value is false. - */ - enablesReturnKeyAutomatically?: boolean - - /** - * Determines the color of the keyboard. - */ - keyboardAppearance?: 'default' | 'light' | 'dark' - - /** - * See DocumentSelectionState.js, some state that is responsible for maintaining selection information for a document - */ - selectionState?: DocumentSelectionState - - /** - * If false, disables spell-check style (i.e. red underlines). The default value is inherited from autoCorrect - */ - spellCheck?: boolean - - /** - * Give the keyboard and the system information about the expected - * semantic meaning for the content that users enter. - * - * For iOS 11+ you can set `textContentType` to `username` or `password` to - * enable autofill of login details from the device keychain. - * - * For iOS 12+ `newPassword` can be used to indicate a new password input the - * user may want to save in the keychain, and `oneTimeCode` can be used to indicate - * that a field can be autofilled by a code arriving in an SMS. - * - * To disable autofill, set textContentType to `none`. - * - * Possible values for `textContentType` are: - * - * - `'none'` - * - `'URL'` - * - `'addressCity'` - * - `'addressCityAndState'` - * - `'addressState'` - * - `'countryName'` - * - `'creditCardNumber'` - * - `'emailAddress'` - * - `'familyName'` - * - `'fullStreetAddress'` - * - `'givenName'` - * - `'jobTitle'` - * - `'location'` - * - `'middleName'` - * - `'name'` - * - `'namePrefix'` - * - `'nameSuffix'` - * - `'nickname'` - * - `'organizationName'` - * - `'postalCode'` - * - `'streetAddressLine1'` - * - `'streetAddressLine2'` - * - `'sublocality'` - * - `'telephoneNumber'` - * - `'username'` - * - `'password'` - * - `'newPassword'` - * - `'oneTimeCode'` - * - */ - textContentType?: - | 'none' - | 'URL' - | 'addressCity' - | 'addressCityAndState' - | 'addressState' - | 'countryName' - | 'creditCardNumber' - | 'emailAddress' - | 'familyName' - | 'fullStreetAddress' - | 'givenName' - | 'jobTitle' - | 'location' - | 'middleName' - | 'name' - | 'namePrefix' - | 'nameSuffix' - | 'nickname' - | 'organizationName' - | 'postalCode' - | 'streetAddressLine1' - | 'streetAddressLine2' - | 'sublocality' - | 'telephoneNumber' - | 'username' - | 'password' - | 'newPassword' - | 'oneTimeCode' - - /** - * If false, scrolling of the text view will be disabled. The default value is true. Only works with multiline={true} - */ - scrollEnabled?: boolean + /** + * enum('never', 'while-editing', 'unless-editing', 'always') + * When the clear button should appear on the right side of the text view + */ + clearButtonMode?: "never" | "while-editing" | "unless-editing" | "always"; + + /** + * If true, clears the text field automatically when editing begins + */ + clearTextOnFocus?: boolean; + + /** + * Determines the types of data converted to clickable URLs in the text input. + * Only valid if `multiline={true}` and `editable={false}`. + * By default no data types are detected. + * + * You can provide one type or an array of many types. + * + * Possible values for `dataDetectorTypes` are: + * + * - `'phoneNumber'` + * - `'link'` + * - `'address'` + * - `'calendarEvent'` + * - `'none'` + * - `'all'` + */ + dataDetectorTypes?: DataDetectorTypes | DataDetectorTypes[]; + + /** + * If true, the keyboard disables the return key when there is no text and automatically enables it when there is text. + * The default value is false. + */ + enablesReturnKeyAutomatically?: boolean; + + /** + * Determines the color of the keyboard. + */ + keyboardAppearance?: "default" | "light" | "dark"; + + /** + * See DocumentSelectionState.js, some state that is responsible for maintaining selection information for a document + */ + selectionState?: DocumentSelectionState; + + /** + * If false, disables spell-check style (i.e. red underlines). The default value is inherited from autoCorrect + */ + spellCheck?: boolean; + + /** + * Give the keyboard and the system information about the expected + * semantic meaning for the content that users enter. + * + * For iOS 11+ you can set `textContentType` to `username` or `password` to + * enable autofill of login details from the device keychain. + * + * For iOS 12+ `newPassword` can be used to indicate a new password input the + * user may want to save in the keychain, and `oneTimeCode` can be used to indicate + * that a field can be autofilled by a code arriving in an SMS. + * + * To disable autofill, set textContentType to `none`. + * + * Possible values for `textContentType` are: + * + * - `'none'` + * - `'URL'` + * - `'addressCity'` + * - `'addressCityAndState'` + * - `'addressState'` + * - `'countryName'` + * - `'creditCardNumber'` + * - `'emailAddress'` + * - `'familyName'` + * - `'fullStreetAddress'` + * - `'givenName'` + * - `'jobTitle'` + * - `'location'` + * - `'middleName'` + * - `'name'` + * - `'namePrefix'` + * - `'nameSuffix'` + * - `'nickname'` + * - `'organizationName'` + * - `'postalCode'` + * - `'streetAddressLine1'` + * - `'streetAddressLine2'` + * - `'sublocality'` + * - `'telephoneNumber'` + * - `'username'` + * - `'password'` + * - `'newPassword'` + * - `'oneTimeCode'` + * + */ + textContentType?: + | "none" + | "URL" + | "addressCity" + | "addressCityAndState" + | "addressState" + | "countryName" + | "creditCardNumber" + | "emailAddress" + | "familyName" + | "fullStreetAddress" + | "givenName" + | "jobTitle" + | "location" + | "middleName" + | "name" + | "namePrefix" + | "nameSuffix" + | "nickname" + | "organizationName" + | "postalCode" + | "streetAddressLine1" + | "streetAddressLine2" + | "sublocality" + | "telephoneNumber" + | "username" + | "password" + | "newPassword" + | "oneTimeCode"; + + /** + * If false, scrolling of the text view will be disabled. The default value is true. Only works with multiline={true} + */ + scrollEnabled?: boolean; } /** @@ -1124,394 +1114,390 @@ export interface TextInputIOSProps { * @see https://facebook.github.io/react-native/docs/textinput.html#props */ export interface TextInputAndroidProps { - /** - * Determines which content to suggest on auto complete, e.g.`username`. - * To disable auto complete, use `off`. - * - * *Android Only* - * - * The following values work on Android only: - * - * - `username` - * - `password` - * - `email` - * - `name` - * - `tel` - * - `street-address` - * - `postal-code` - * - `cc-number` - * - `cc-csc` - * - `cc-exp` - * - `cc-exp-month` - * - `cc-exp-year` - * - `off` - */ - autoCompleteType?: - | 'cc-csc' - | 'cc-exp' - | 'cc-exp-month' - | 'cc-exp-year' - | 'cc-number' - | 'email' - | 'name' - | 'password' - | 'postal-code' - | 'street-address' - | 'tel' - | 'username' - | 'off' - - /** - * When false, if there is a small amount of space available around a text input (e.g. landscape orientation on a phone), - * the OS may choose to have the user edit the text inside of a full screen text input mode. - * When true, this feature is disabled and users will always edit the text directly inside of the text input. - * Defaults to false. - */ - disableFullscreenUI?: boolean - - /** - * If defined, the provided image resource will be rendered on the left. - */ - inlineImageLeft?: string - - /** - * Padding between the inline image, if any, and the text input itself. - */ - inlineImagePadding?: number - - /** - * Sets the number of lines for a TextInput. - * Use it with multiline set to true to be able to fill the lines. - */ - numberOfLines?: number - - /** - * Sets the return key to the label. Use it instead of `returnKeyType`. - * @platform android - */ - returnKeyLabel?: string - - /** - * Set text break strategy on Android API Level 23+, possible values are simple, highQuality, balanced - * The default value is simple. - */ - textBreakStrategy?: 'simple' | 'highQuality' | 'balanced' - - /** - * The color of the textInput underline. - */ - underlineColorAndroid?: string - - /** - * Vertically align text when `multiline` is set to true - */ - textAlignVertical?: 'auto' | 'top' | 'bottom' | 'center' -} - -export type KeyboardType = 'default' | 'email-address' | 'numeric' | 'phone-pad' -export type KeyboardTypeIOS = - | 'ascii-capable' - | 'numbers-and-punctuation' - | 'url' - | 'number-pad' - | 'name-phone-pad' - | 'decimal-pad' - | 'twitter' - | 'web-search' -export type KeyboardTypeAndroid = 'visible-password' -export type KeyboardTypeOptions = KeyboardType | KeyboardTypeAndroid | KeyboardTypeIOS - -export type ReturnKeyType = 'done' | 'go' | 'next' | 'search' | 'send' -export type ReturnKeyTypeAndroid = 'none' | 'previous' -export type ReturnKeyTypeIOS = 'default' | 'google' | 'join' | 'route' | 'yahoo' | 'emergency-call' -export type ReturnKeyTypeOptions = ReturnKeyType | ReturnKeyTypeAndroid | ReturnKeyTypeIOS + /** + * Determines which content to suggest on auto complete, e.g.`username`. + * To disable auto complete, use `off`. + * + * *Android Only* + * + * The following values work on Android only: + * + * - `username` + * - `password` + * - `email` + * - `name` + * - `tel` + * - `street-address` + * - `postal-code` + * - `cc-number` + * - `cc-csc` + * - `cc-exp` + * - `cc-exp-month` + * - `cc-exp-year` + * - `off` + */ + autoCompleteType?: + | "cc-csc" + | "cc-exp" + | "cc-exp-month" + | "cc-exp-year" + | "cc-number" + | "email" + | "name" + | "password" + | "postal-code" + | "street-address" + | "tel" + | "username" + | "off"; -export interface TargetedEvent { - target: number -} + /** + * When false, if there is a small amount of space available around a text input (e.g. landscape orientation on a phone), + * the OS may choose to have the user edit the text inside of a full screen text input mode. + * When true, this feature is disabled and users will always edit the text directly inside of the text input. + * Defaults to false. + */ + disableFullscreenUI?: boolean; -/** - * @see TextInputProps.onFocus - */ -export interface TextInputFocusEventData extends TargetedEvent { - text: string - eventCount: number -} + /** + * If defined, the provided image resource will be rendered on the left. + */ + inlineImageLeft?: string; -/** + /** + * Padding between the inline image, if any, and the text input itself. + */ + inlineImagePadding?: number; + + /** + * Sets the number of lines for a TextInput. + * Use it with multiline set to true to be able to fill the lines. + */ + numberOfLines?: number; + + /** + * Sets the return key to the label. Use it instead of `returnKeyType`. + * @platform android + */ + returnKeyLabel?: string; + + /** + * Set text break strategy on Android API Level 23+, possible values are simple, highQuality, balanced + * The default value is simple. + */ + textBreakStrategy?: "simple" | "highQuality" | "balanced"; + + /** + * The color of the textInput underline. + */ + underlineColorAndroid?: string; + + /** + * Vertically align text when `multiline` is set to true + */ + textAlignVertical?: "auto" | "top" | "bottom" | "center"; +} + +export type KeyboardType = "default" | "email-address" | "numeric" | "phone-pad"; +export type KeyboardTypeIOS = + | "ascii-capable" + | "numbers-and-punctuation" + | "url" + | "number-pad" + | "name-phone-pad" + | "decimal-pad" + | "twitter" + | "web-search"; +export type KeyboardTypeAndroid = "visible-password"; +export type KeyboardTypeOptions = KeyboardType | KeyboardTypeAndroid | KeyboardTypeIOS; + +export type ReturnKeyType = "done" | "go" | "next" | "search" | "send"; +export type ReturnKeyTypeAndroid = "none" | "previous"; +export type ReturnKeyTypeIOS = "default" | "google" | "join" | "route" | "yahoo" | "emergency-call"; +export type ReturnKeyTypeOptions = ReturnKeyType | ReturnKeyTypeAndroid | ReturnKeyTypeIOS; + +export interface TargetedEvent { + target: number; +} + +/** + * @see TextInputProps.onFocus + */ +export interface TextInputFocusEventData extends TargetedEvent { + text: string; + eventCount: number; +} + +/** * @see TextInputProps.onScroll */ export interface TextInputScrollEventData { - contentOffset: {x: number; y: number} + contentOffset: { x: number; y: number }; } /** * @see TextInputProps.onSelectionChange */ export interface TextInputSelectionChangeEventData extends TargetedEvent { - selection: { - start: number - end: number - } + selection: { + start: number; + end: number; + }; } /** * @see TextInputProps.onKeyPress */ export interface TextInputKeyPressEventData { - key: string + key: string; } /** * @see TextInputProps.onChange */ export interface TextInputChangeEventData extends TargetedEvent { - eventCount: number - text: string + eventCount: number; + text: string; } /** * @see TextInputProps.onContentSizeChange */ export interface TextInputContentSizeChangeEventData { - contentSize: {width: number; height: number} + contentSize: { width: number; height: number }; } /** * @see TextInputProps.onEndEditing */ export interface TextInputEndEditingEventData { - text: string + text: string; } /** * @see TextInputProps.onSubmitEditing */ export interface TextInputSubmitEditingEventData { - text: string + text: string; } /** * @see https://facebook.github.io/react-native/docs/textinput.html#props */ -export interface TextInputProps - extends ViewProps, - TextInputIOSProps, - TextInputAndroidProps, - AccessibilityProps { - /** - * Specifies whether fonts should scale to respect Text Size accessibility settings. - * The default is `true`. - */ - allowFontScaling?: boolean - - /** - * Can tell TextInput to automatically capitalize certain characters. - * characters: all characters, - * words: first letter of each word - * sentences: first letter of each sentence (default) - * none: don't auto capitalize anything - * - * https://facebook.github.io/react-native/docs/textinput.html#autocapitalize - */ - autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters' - - /** - * If false, disables auto-correct. - * The default value is true. - */ - autoCorrect?: boolean - - /** - * If true, focuses the input on componentDidMount. - * The default value is false. - */ - autoFocus?: boolean - - /** - * If true, the text field will blur when submitted. - * The default value is true. - */ - blurOnSubmit?: boolean - - /** - * If true, caret is hidden. The default value is false. - */ - caretHidden?: boolean - - /** - * If true, context menu is hidden. The default value is false. - */ - contextMenuHidden?: boolean - - /** - * Provides an initial value that will change when the user starts typing. - * Useful for simple use-cases where you don't want to deal with listening to events - * and updating the value prop to keep the controlled state in sync. - */ - defaultValue?: string - - /** - * If false, text is not editable. The default value is true. - */ - editable?: boolean - - /** - * enum("default", 'numeric', 'email-address', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', - * 'decimal-pad', 'twitter', 'web-search', 'visible-password') - * Determines which keyboard to open, e.g.numeric. - * The following values work across platforms: - default - numeric - email-address - phone-pad - * The following values work on iOS: - ascii-capable - numbers-and-punctuation - url - number-pad - name-phone-pad - decimal-pad - twitter - web-search - * The following values work on Android: - visible-password - */ - keyboardType?: KeyboardTypeOptions - - /** - * Limits the maximum number of characters that can be entered. - * Use this instead of implementing the logic in JS to avoid flicker. - */ - maxLength?: number - - /** - * If true, the text input can be multiple lines. The default value is false. - */ - multiline?: boolean - - /** - * Callback that is called when the text input is blurred - */ - onBlur?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when the text input's text changes. - */ - onChange?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when the text input's text changes. - * Changed text is passed as an argument to the callback handler. - */ - onChangeText?: (text: string) => void - - /** - * Callback that is called when the text input's content size changes. - * This will be called with - * `{ nativeEvent: { contentSize: { width, height } } }`. - * - * Only called for multiline text inputs. - */ - onContentSizeChange?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when text input ends. - */ - onEndEditing?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when the text input is focused - */ - onFocus?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when the text input selection is changed. - */ - onSelectionChange?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when the text input's submit button is pressed. - */ - onSubmitEditing?: (e: NativeSyntheticEvent) => void - - /** - * Invoked on content scroll with - * `{ nativeEvent: { contentOffset: { x, y } } }`. - * - * May also contain other properties from ScrollEvent but on Android contentSize is not provided for performance reasons. - */ - onScroll?: (e: NativeSyntheticEvent) => void - - /** - * Callback that is called when a key is pressed. - * This will be called with - * `{ nativeEvent: { key: keyValue } }` - * where keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space. - * - * Fires before onChange callbacks. - * Note: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs. - */ - onKeyPress?: (e: NativeSyntheticEvent) => void - - /** - * The string that will be rendered before text input has been entered - */ - placeholder?: string - - /** - * The text color of the placeholder string - */ - placeholderTextColor?: string - - /** - * enum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call') - * Determines how the return key should look. - */ - returnKeyType?: ReturnKeyTypeOptions - - /** - * If true, the text input obscures the text entered so that sensitive text like passwords stay secure. - * The default value is false. - */ - secureTextEntry?: boolean - - /** - * If true, all text will automatically be selected on focus - */ - selectTextOnFocus?: boolean - - /** - * The start and end of the text input's selection. Set start and end to - * the same value to position the cursor. - */ - selection?: {start: number; end?: number} - - /** - * The highlight (and cursor on ios) color of the text input - */ - selectionColor?: string - - /** - * Styles - */ - style?: StyleProp - - /** - * Used to locate this view in end-to-end tests - */ - testID?: string - - /** - * Used to connect to an InputAccessoryView. Not part of react-natives documentation, but present in examples and - * code. - * See https://facebook.github.io/react-native/docs/inputaccessoryview.html for more information. - */ - inputAccessoryViewID?: string - - /** - * The value to show for the text input. TextInput is a controlled component, - * which means the native value will be forced to match this value prop if provided. - * For most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. - * In addition to simply setting the same value, either set editable={false}, - * or set/update maxLength to prevent unwanted edits without flicker. - */ - value?: string - - /** - * Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: - * - null/undefined (default): inherit from the parent node or the global default (0) - * - 0: no max, ignore parent/global default - * - >= 1: sets the maxFontSizeMultiplier of this node to this value - */ - maxFontSizeMultiplier?: number | null +export interface TextInputProps extends ViewProps, TextInputIOSProps, TextInputAndroidProps, AccessibilityProps { + /** + * Specifies whether fonts should scale to respect Text Size accessibility settings. + * The default is `true`. + */ + allowFontScaling?: boolean; + + /** + * Can tell TextInput to automatically capitalize certain characters. + * characters: all characters, + * words: first letter of each word + * sentences: first letter of each sentence (default) + * none: don't auto capitalize anything + * + * https://facebook.github.io/react-native/docs/textinput.html#autocapitalize + */ + autoCapitalize?: "none" | "sentences" | "words" | "characters"; + + /** + * If false, disables auto-correct. + * The default value is true. + */ + autoCorrect?: boolean; + + /** + * If true, focuses the input on componentDidMount. + * The default value is false. + */ + autoFocus?: boolean; + + /** + * If true, the text field will blur when submitted. + * The default value is true. + */ + blurOnSubmit?: boolean; + + /** + * If true, caret is hidden. The default value is false. + */ + caretHidden?: boolean; + + /** + * If true, context menu is hidden. The default value is false. + */ + contextMenuHidden?: boolean; + + /** + * Provides an initial value that will change when the user starts typing. + * Useful for simple use-cases where you don't want to deal with listening to events + * and updating the value prop to keep the controlled state in sync. + */ + defaultValue?: string; + + /** + * If false, text is not editable. The default value is true. + */ + editable?: boolean; + + /** + * enum("default", 'numeric', 'email-address', "ascii-capable", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad', + * 'decimal-pad', 'twitter', 'web-search', 'visible-password') + * Determines which keyboard to open, e.g.numeric. + * The following values work across platforms: - default - numeric - email-address - phone-pad + * The following values work on iOS: - ascii-capable - numbers-and-punctuation - url - number-pad - name-phone-pad - decimal-pad - twitter - web-search + * The following values work on Android: - visible-password + */ + keyboardType?: KeyboardTypeOptions; + + /** + * Limits the maximum number of characters that can be entered. + * Use this instead of implementing the logic in JS to avoid flicker. + */ + maxLength?: number; + + /** + * If true, the text input can be multiple lines. The default value is false. + */ + multiline?: boolean; + + /** + * Callback that is called when the text input is blurred + */ + onBlur?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the text input's text changes. + */ + onChange?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the text input's text changes. + * Changed text is passed as an argument to the callback handler. + */ + onChangeText?: (text: string) => void; + + /** + * Callback that is called when the text input's content size changes. + * This will be called with + * `{ nativeEvent: { contentSize: { width, height } } }`. + * + * Only called for multiline text inputs. + */ + onContentSizeChange?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when text input ends. + */ + onEndEditing?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the text input is focused + */ + onFocus?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the text input selection is changed. + */ + onSelectionChange?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the text input's submit button is pressed. + */ + onSubmitEditing?: (e: NativeSyntheticEvent) => void; + + /** + * Invoked on content scroll with + * `{ nativeEvent: { contentOffset: { x, y } } }`. + * + * May also contain other properties from ScrollEvent but on Android contentSize is not provided for performance reasons. + */ + onScroll?: (e: NativeSyntheticEvent) => void; + + /** + * Callback that is called when a key is pressed. + * This will be called with + * `{ nativeEvent: { key: keyValue } }` + * where keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space. + * + * Fires before onChange callbacks. + * Note: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs. + */ + onKeyPress?: (e: NativeSyntheticEvent) => void; + + /** + * The string that will be rendered before text input has been entered + */ + placeholder?: string; + + /** + * The text color of the placeholder string + */ + placeholderTextColor?: string; + + /** + * enum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call') + * Determines how the return key should look. + */ + returnKeyType?: ReturnKeyTypeOptions; + + /** + * If true, the text input obscures the text entered so that sensitive text like passwords stay secure. + * The default value is false. + */ + secureTextEntry?: boolean; + + /** + * If true, all text will automatically be selected on focus + */ + selectTextOnFocus?: boolean; + + /** + * The start and end of the text input's selection. Set start and end to + * the same value to position the cursor. + */ + selection?: { start: number; end?: number }; + + /** + * The highlight (and cursor on ios) color of the text input + */ + selectionColor?: string; + + /** + * Styles + */ + style?: StyleProp; + + /** + * Used to locate this view in end-to-end tests + */ + testID?: string; + + /** + * Used to connect to an InputAccessoryView. Not part of react-natives documentation, but present in examples and + * code. + * See https://facebook.github.io/react-native/docs/inputaccessoryview.html for more information. + */ + inputAccessoryViewID?: string; + + /** + * The value to show for the text input. TextInput is a controlled component, + * which means the native value will be forced to match this value prop if provided. + * For most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same. + * In addition to simply setting the same value, either set editable={false}, + * or set/update maxLength to prevent unwanted edits without flicker. + */ + value?: string; + + /** + * Specifies largest possible scale a font can reach when allowFontScaling is enabled. Possible values: + * - null/undefined (default): inherit from the parent node or the global default (0) + * - 0: no max, ignore parent/global default + * - >= 1: sets the maxFontSizeMultiplier of this node to this value + */ + maxFontSizeMultiplier?: number | null; } /** @@ -1520,170 +1506,168 @@ export interface TextInputProps * should be funneled through here */ interface TextInputState { - /** - * Returns the ID of the currently focused text field, if one exists - * If no text field is focused it returns null - */ - currentlyFocusedField(): number - - /** - * @deprecated - * @param TextInputID id of the text field to focus - * Focuses the specified text field - * noop if the text field was already focused - */ - focusTextInput(textFieldID?: number): void - - /** - * @deprecated - * @param textFieldID id of the text field to focus - * Unfocuses the specified text field - * noop if it wasn't focused - */ - blurTextInput(textFieldID?: number): void + /** + * Returns the ID of the currently focused text field, if one exists + * If no text field is focused it returns null + */ + currentlyFocusedField(): number; + + /** + * @deprecated + * @param TextInputID id of the text field to focus + * Focuses the specified text field + * noop if the text field was already focused + */ + focusTextInput(textFieldID?: number): void; + + /** + * @deprecated + * @param textFieldID id of the text field to focus + * Unfocuses the specified text field + * noop if it wasn't focused + */ + blurTextInput(textFieldID?: number): void; } /** * @see https://facebook.github.io/react-native/docs/textinput.html#methods */ declare class TextInputComponent extends React.Component {} -declare const TextInputBase: Constructor & - Constructor & - typeof TextInputComponent +declare const TextInputBase: Constructor & Constructor & typeof TextInputComponent; export class TextInput extends TextInputBase { - /** - * Access the current focus state. - */ - static State: TextInputState + /** + * Access the current focus state. + */ + static State: TextInputState; - /** - * Returns if the input is currently focused. - */ - isFocused: () => boolean + /** + * Returns if the input is currently focused. + */ + isFocused: () => boolean; - /** - * Removes all text from the input. - */ - clear: () => void + /** + * Removes all text from the input. + */ + clear: () => void; } export type ToolbarAndroidAction = { - /** - * title: required, the title of this action - */ - title: string + /** + * title: required, the title of this action + */ + title: string; - /** - * icon: the icon for this action, e.g. require('./some_icon.png') - */ - icon?: ImageURISource + /** + * icon: the icon for this action, e.g. require('./some_icon.png') + */ + icon?: ImageURISource; - /** - * show: when to show this action as an icon or hide it in the overflow menu: always, ifRoom or never - */ - show?: 'always' | 'ifRoom' | 'never' + /** + * show: when to show this action as an icon or hide it in the overflow menu: always, ifRoom or never + */ + show?: "always" | "ifRoom" | "never"; - /** - * showWithText: boolean, whether to show text alongside the icon or not - */ - showWithText?: boolean -} + /** + * showWithText: boolean, whether to show text alongside the icon or not + */ + showWithText?: boolean; +}; export interface ToolbarAndroidProps extends ViewProps { - /** - * Sets possible actions on the toolbar as part of the action menu. These are displayed as icons - * or text on the right side of the widget. If they don't fit they are placed in an 'overflow' - * menu. - * - * This property takes an array of objects, where each object has the following keys: - * - * * `title`: **required**, the title of this action - * * `icon`: the icon for this action, e.g. `require('./some_icon.png')` - * * `show`: when to show this action as an icon or hide it in the overflow menu: `always`, - * `ifRoom` or `never` - * * `showWithText`: boolean, whether to show text alongside the icon or not - */ - actions?: ToolbarAndroidAction[] - - /** - * Sets the content inset for the toolbar ending edge. - * The content inset affects the valid area for Toolbar content other - * than the navigation button and menu. Insets define the minimum - * margin for these components and can be used to effectively align - * Toolbar content along well-known gridlines. - */ - contentInsetEnd?: number - - /** - * Sets the content inset for the toolbar starting edge. - * The content inset affects the valid area for Toolbar content - * other than the navigation button and menu. Insets define the - * minimum margin for these components and can be used to effectively - * align Toolbar content along well-known gridlines. - */ - contentInsetStart?: number - - /** - * Sets the toolbar logo. - */ - logo?: ImageURISource - - /** - * Sets the navigation icon. - */ - navIcon?: ImageURISource - - /** - * Callback that is called when an action is selected. The only - * argument that is passed to the callback is the position of the - * action in the actions array. - */ - onActionSelected?: (position: number) => void - - /** - * Callback called when the icon is selected. - */ - onIconClicked?: () => void - - /** - * Sets the overflow icon. - */ - overflowIcon?: ImageURISource - - /** - * Used to set the toolbar direction to RTL. - * In addition to this property you need to add - * android:supportsRtl="true" - * to your application AndroidManifest.xml and then call - * setLayoutDirection(LayoutDirection.RTL) in your MainActivity - * onCreate method. - */ - rtl?: boolean - - /** - * Sets the toolbar subtitle. - */ - subtitle?: string - - /** - * Sets the toolbar subtitle color. - */ - subtitleColor?: string - - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string - - /** - * Sets the toolbar title. - */ - title?: string - - /** - * Sets the toolbar title color. - */ - titleColor?: string + /** + * Sets possible actions on the toolbar as part of the action menu. These are displayed as icons + * or text on the right side of the widget. If they don't fit they are placed in an 'overflow' + * menu. + * + * This property takes an array of objects, where each object has the following keys: + * + * * `title`: **required**, the title of this action + * * `icon`: the icon for this action, e.g. `require('./some_icon.png')` + * * `show`: when to show this action as an icon or hide it in the overflow menu: `always`, + * `ifRoom` or `never` + * * `showWithText`: boolean, whether to show text alongside the icon or not + */ + actions?: ToolbarAndroidAction[]; + + /** + * Sets the content inset for the toolbar ending edge. + * The content inset affects the valid area for Toolbar content other + * than the navigation button and menu. Insets define the minimum + * margin for these components and can be used to effectively align + * Toolbar content along well-known gridlines. + */ + contentInsetEnd?: number; + + /** + * Sets the content inset for the toolbar starting edge. + * The content inset affects the valid area for Toolbar content + * other than the navigation button and menu. Insets define the + * minimum margin for these components and can be used to effectively + * align Toolbar content along well-known gridlines. + */ + contentInsetStart?: number; + + /** + * Sets the toolbar logo. + */ + logo?: ImageURISource; + + /** + * Sets the navigation icon. + */ + navIcon?: ImageURISource; + + /** + * Callback that is called when an action is selected. The only + * argument that is passed to the callback is the position of the + * action in the actions array. + */ + onActionSelected?: (position: number) => void; + + /** + * Callback called when the icon is selected. + */ + onIconClicked?: () => void; + + /** + * Sets the overflow icon. + */ + overflowIcon?: ImageURISource; + + /** + * Used to set the toolbar direction to RTL. + * In addition to this property you need to add + * android:supportsRtl="true" + * to your application AndroidManifest.xml and then call + * setLayoutDirection(LayoutDirection.RTL) in your MainActivity + * onCreate method. + */ + rtl?: boolean; + + /** + * Sets the toolbar subtitle. + */ + subtitle?: string; + + /** + * Sets the toolbar subtitle color. + */ + subtitleColor?: string; + + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; + + /** + * Sets the toolbar title. + */ + title?: string; + + /** + * Sets the toolbar title color. + */ + titleColor?: string; } /** @@ -1703,7 +1687,7 @@ export interface ToolbarAndroidProps extends ViewProps { * [0]: https://developer.android.com/reference/android/support/v7/widget/Toolbar.html */ declare class ToolbarAndroidComponent extends React.Component {} -declare const ToolbarAndroidBase: Constructor & typeof ToolbarAndroidComponent +declare const ToolbarAndroidBase: Constructor & typeof ToolbarAndroidComponent; export class ToolbarAndroid extends ToolbarAndroidBase {} /** @@ -1732,562 +1716,563 @@ export class ToolbarAndroid extends ToolbarAndroidBase {} * Use TouchableHighlight anywhere where you would use a button or link on web. */ export interface GestureResponderHandlers { - /** - * A view can become the touch responder by implementing the correct negotiation methods. - * There are two methods to ask the view if it wants to become responder: - */ - - /** - * Does this view want to become responder on the start of a touch? - */ - onStartShouldSetResponder?: (event: GestureResponderEvent) => boolean - - /** - * Called for every touch move on the View when it is not the responder: does this view want to "claim" touch responsiveness? - */ - onMoveShouldSetResponder?: (event: GestureResponderEvent) => boolean - - /** - * If the View returns true and attempts to become the responder, one of the following will happen: - */ - - onResponderEnd?: (event: GestureResponderEvent) => void - - /** - * The View is now responding for touch events. - * This is the time to highlight and show the user what is happening - */ - onResponderGrant?: (event: GestureResponderEvent) => void - - /** - * Something else is the responder right now and will not release it - */ - onResponderReject?: (event: GestureResponderEvent) => void - - /** - * If the view is responding, the following handlers can be called: - */ - - /** - * The user is moving their finger - */ - onResponderMove?: (event: GestureResponderEvent) => void - - /** - * Fired at the end of the touch, ie "touchUp" - */ - onResponderRelease?: (event: GestureResponderEvent) => void - - onResponderStart?: (event: GestureResponderEvent) => void - - /** - * Something else wants to become responder. - * Should this view release the responder? Returning true allows release - */ - onResponderTerminationRequest?: (event: GestureResponderEvent) => boolean - - /** - * The responder has been taken from the View. - * Might be taken by other views after a call to onResponderTerminationRequest, - * or might be taken by the OS without asking (happens with control center/ notification center on iOS) - */ - onResponderTerminate?: (event: GestureResponderEvent) => void - - /** - * onStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, - * where the deepest node is called first. - * That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. - * This is desirable in most cases, because it makes sure all controls and buttons are usable. - * - * However, sometimes a parent will want to make sure that it becomes responder. - * This can be handled by using the capture phase. - * Before the responder system bubbles up from the deepest component, - * it will do a capture phase, firing on*ShouldSetResponderCapture. - * So if a parent View wants to prevent the child from becoming responder on a touch start, - * it should have a onStartShouldSetResponderCapture handler which returns true. - */ - onStartShouldSetResponderCapture?: (event: GestureResponderEvent) => boolean - - /** - * onStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, - * where the deepest node is called first. - * That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. - * This is desirable in most cases, because it makes sure all controls and buttons are usable. - * - * However, sometimes a parent will want to make sure that it becomes responder. - * This can be handled by using the capture phase. - * Before the responder system bubbles up from the deepest component, - * it will do a capture phase, firing on*ShouldSetResponderCapture. - * So if a parent View wants to prevent the child from becoming responder on a touch start, - * it should have a onStartShouldSetResponderCapture handler which returns true. - */ - onMoveShouldSetResponderCapture?: (event: GestureResponderEvent) => boolean -} + /** + * A view can become the touch responder by implementing the correct negotiation methods. + * There are two methods to ask the view if it wants to become responder: + */ -/** - * @see https://facebook.github.io/react-native/docs/view.html#style - * @see https://github.com/facebook/react-native/blob/master/Libraries/Components/View/ViewStylePropTypes.js - */ -export interface ViewStyle extends FlexStyle, ShadowStyleIOS, TransformsStyle { - backfaceVisibility?: 'visible' | 'hidden' - backgroundColor?: string - borderBottomColor?: string - borderBottomEndRadius?: number - borderBottomLeftRadius?: number - borderBottomRightRadius?: number - borderBottomStartRadius?: number - borderBottomWidth?: number - borderColor?: string - borderEndColor?: string - borderLeftColor?: string - borderLeftWidth?: number - borderRadius?: number - borderRightColor?: string - borderRightWidth?: number - borderStartColor?: string - borderStyle?: 'solid' | 'dotted' | 'dashed' - borderTopColor?: string - borderTopEndRadius?: number - borderTopLeftRadius?: number - borderTopRightRadius?: number - borderTopStartRadius?: number - borderTopWidth?: number - borderWidth?: number - opacity?: number - testID?: string - /** - * Sets the elevation of a view, using Android's underlying - * [elevation API](https://developer.android.com/training/material/shadows-clipping.html#Elevation). - * This adds a drop shadow to the item and affects z-order for overlapping views. - * Only supported on Android 5.0+, has no effect on earlier versions. - * - * @platform android - */ - elevation?: number -} + /** + * Does this view want to become responder on the start of a touch? + */ + onStartShouldSetResponder?: (event: GestureResponderEvent) => boolean; -export type TVParallaxProperties = { - /** - * If true, parallax effects are enabled. Defaults to true. - */ - enabled?: boolean - - /** - * Defaults to 2.0. - */ - shiftDistanceX?: number - - /** - * Defaults to 2.0. - */ - shiftDistanceY?: number - - /** - * Defaults to 0.05. - */ - tiltAngle?: number - - /** - * Defaults to 1.0 - */ - magnification?: number - - /** - * Defaults to 1.0 - */ - pressMagnification?: number - - /** - * Defaults to 0.3 - */ - pressDuration?: number - - /** - * Defaults to 0.3 - */ - pressDelay?: number -} + /** + * Called for every touch move on the View when it is not the responder: does this view want to "claim" touch responsiveness? + */ + onMoveShouldSetResponder?: (event: GestureResponderEvent) => boolean; -export interface TVViewPropsIOS { - /** - * *(Apple TV only)* When set to true, this view will be focusable - * and navigable using the Apple TV remote. - * - * @platform ios - */ - isTVSelectable?: boolean - - /** - * *(Apple TV only)* May be set to true to force the Apple TV focus engine to move focus to this view. - * - * @platform ios - */ - hasTVPreferredFocus?: boolean - - /** - * *(Apple TV only)* Object with properties to control Apple TV parallax effects. - * - * @platform ios - */ - tvParallaxProperties?: TVParallaxProperties - - /** - * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0. - * - * @platform ios - */ - tvParallaxShiftDistanceX?: number - - /** - * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0. - * - * @platform ios - */ - tvParallaxShiftDistanceY?: number - - /** - * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 0.05. - * - * @platform ios - */ - tvParallaxTiltAngle?: number - - /** - * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 1.0. - * - * @platform ios - */ - tvParallaxMagnification?: number -} + /** + * If the View returns true and attempts to become the responder, one of the following will happen: + */ -export interface ViewPropsIOS extends TVViewPropsIOS { - /** - * A Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. - * @platform ios - */ - accessibilityViewIsModal?: boolean - - /** - * Provides an array of custom actions available for accessibility. - * @platform ios - */ - accessibilityActions?: Array - - /** - * When `accessible` is true, the system will try to invoke this function - * when the user performs an accessibility custom action. - * @platform ios - */ - onAccessibilityAction?: () => void - - /** - * Whether this view should be rendered as a bitmap before compositing. - * - * On iOS, this is useful for animations and interactions that do not modify this component's dimensions nor its children; - * for example, when translating the position of a static view, rasterization allows the renderer to reuse a cached bitmap of a static view - * and quickly composite it during each frame. - * - * Rasterization incurs an off-screen drawing pass and the bitmap consumes memory. - * Test and measure when using this property. - */ - shouldRasterizeIOS?: boolean -} + onResponderEnd?: (event: GestureResponderEvent) => void; -export interface ViewPropsAndroid { - /** - * Views that are only used to layout their children or otherwise don't draw anything - * may be automatically removed from the native hierarchy as an optimization. - * Set this property to false to disable this optimization and ensure that this View exists in the native view hierarchy. - */ - collapsable?: boolean - - /** - * Whether this view needs to rendered offscreen and composited with an alpha in order to preserve 100% correct colors and blending behavior. - * The default (false) falls back to drawing the component and its children - * with an alpha applied to the paint used to draw each element instead of rendering the full component offscreen and compositing it back with an alpha value. - * This default may be noticeable and undesired in the case where the View you are setting an opacity on - * has multiple overlapping elements (e.g. multiple overlapping Views, or text and a background). - * - * Rendering offscreen to preserve correct alpha behavior is extremely expensive - * and hard to debug for non-native developers, which is why it is not turned on by default. - * If you do need to enable this property for an animation, - * consider combining it with renderToHardwareTextureAndroid if the view contents are static (i.e. it doesn't need to be redrawn each frame). - * If that property is enabled, this View will be rendered off-screen once, - * saved in a hardware texture, and then composited onto the screen with an alpha each frame without having to switch rendering targets on the GPU. - */ - needsOffscreenAlphaCompositing?: boolean - - /** - * Whether this view should render itself (and all of its children) into a single hardware texture on the GPU. - * - * On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: - * in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be - * re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation. - */ - renderToHardwareTextureAndroid?: boolean -} - -type Falsy = undefined | null | false -interface RecursiveArray extends Array> {} -/** Keep a brand of 'T' so that calls to `StyleSheet.flatten` can take `RegisteredStyle` and return `T`. */ -type RegisteredStyle = number & {__registeredStyleBrand: T} -export type StyleProp = T | RegisteredStyle | RecursiveArray | Falsy> | Falsy + /** + * The View is now responding for touch events. + * This is the time to highlight and show the user what is happening + */ + onResponderGrant?: (event: GestureResponderEvent) => void; -/** - * @see https://facebook.github.io/react-native/docs/accessibility.html#accessibility-properties - */ -export interface AccessibilityProps extends AccessibilityPropsAndroid, AccessibilityPropsIOS { - /** - * When true, indicates that the view is an accessibility element. - * By default, all the touchable elements are accessible. - */ - accessible?: boolean - - /** - * Overrides the text that's read by the screen reader when the user interacts with the element. By default, the - * label is constructed by traversing all the children and accumulating all the Text nodes separated by space. - */ - accessibilityLabel?: string - - /** - * Accessibility Role tells a person using either VoiceOver on iOS or TalkBack on Android the type of element that is focused on. - */ - accessibilityRole?: AccessibilityRole - /** - * Accessibility State tells a person using either VoiceOver on iOS or TalkBack on Android the state of the element currently focused on. - * @deprecated: accessibilityState available in 0.60+ - */ - accessibilityStates?: AccessibilityStates[] - /** - * Accessibility State tells a person using either VoiceOver on iOS or TalkBack on Android the state of the element currently focused on. - */ - accessibilityState?: AccessibilityState - /** - * An accessibility hint helps users understand what will happen when they perform an action on the accessibility element when that result is not obvious from the accessibility label. - */ - accessibilityHint?: string -} + /** + * Something else is the responder right now and will not release it + */ + onResponderReject?: (event: GestureResponderEvent) => void; -// @deprecated: use AccessibilityState available in 0.60+ -export type AccessibilityStates = - | 'disabled' - | 'selected' - | 'checked' - | 'unchecked' - | 'busy' - | 'expanded' - | 'collapsed' - | 'hasPopup' + /** + * If the view is responding, the following handlers can be called: + */ -export interface AccessibilityState { - /** - * When true, informs accessible tools if the element is disabled - */ - disabled?: boolean - /** - * When true, informs accessible tools if the element is selected - */ - selected?: boolean - /** - * For items like Checkboxes and Toggle switches, reports their state to accessible tools - */ - checked?: boolean | 'mixed' - /** - * When present, informs accessible tools if the element is busy - */ - busy?: boolean - /** - * When present, informs accessible tools the element is expanded or collapsed - */ - expanded?: boolean -} + /** + * The user is moving their finger + */ + onResponderMove?: (event: GestureResponderEvent) => void; -export type AccessibilityRole = - | 'none' - | 'button' - | 'link' - | 'search' - | 'image' - | 'keyboardkey' - | 'text' - | 'adjustable' - | 'imagebutton' - | 'header' - | 'summary' - | 'alert' - | 'checkbox' - | 'combobox' - | 'menu' - | 'menubar' - | 'menuitem' - | 'progressbar' - | 'radio' - | 'radiogroup' - | 'scrollbar' - | 'spinbutton' - | 'switch' - | 'tab' - | 'tablist' - | 'timer' - | 'toolbar' + /** + * Fired at the end of the touch, ie "touchUp" + */ + onResponderRelease?: (event: GestureResponderEvent) => void; -export interface AccessibilityPropsAndroid { - /** - * In some cases, we also want to alert the end user of the type of selected component (i.e., that it is a “button”). - * If we were using native buttons, this would work automatically. Since we are using javascript, we need to - * provide a bit more context for TalkBack. To do so, you must specify the ‘accessibilityComponentType’ property - * for any UI component. For instances, we support ‘button’, ‘radiobutton_checked’ and ‘radiobutton_unchecked’ and so on. - * @platform android - */ - accessibilityComponentType?: 'none' | 'button' | 'radiobutton_checked' | 'radiobutton_unchecked' - - /** - * Indicates to accessibility services whether the user should be notified when this view changes. - * Works for Android API >= 19 only. - * See http://developer.android.com/reference/android/view/View.html#attr_android:accessibilityLiveRegion for references. - * @platform android - */ - accessibilityLiveRegion?: 'none' | 'polite' | 'assertive' - - /** - * Controls how view is important for accessibility which is if it fires accessibility events - * and if it is reported to accessibility services that query the screen. - * Works for Android only. See http://developer.android.com/reference/android/R.attr.html#importantForAccessibility for references. - * - * Possible values: - * 'auto' - The system determines whether the view is important for accessibility - default (recommended). - * 'yes' - The view is important for accessibility. - * 'no' - The view is not important for accessibility. - * 'no-hide-descendants' - The view is not important for accessibility, nor are any of its descendant views. - */ - importantForAccessibility?: 'auto' | 'yes' | 'no' | 'no-hide-descendants' -} + onResponderStart?: (event: GestureResponderEvent) => void; -export interface AccessibilityPropsIOS { - /** - * A Boolean value indicating whether the accessibility elements contained within this accessibility element - * are hidden to the screen reader. - * @platform ios - */ - accessibilityElementsHidden?: boolean - - /** - * Accessibility traits tell a person using VoiceOver what kind of element they have selected. - * Is this element a label? A button? A header? These questions are answered by accessibilityTraits. - * @platform ios - */ - accessibilityTraits?: AccessibilityTrait | AccessibilityTrait[] - - /** - * When `accessible` is true, the system will try to invoke this function when the user performs accessibility tap gesture. - * @platform ios - */ - onAccessibilityTap?: () => void - - /** - * When accessible is true, the system will invoke this function when the user performs the magic tap gesture. - * @platform ios - */ - onMagicTap?: () => void - - /** - * https://facebook.github.io/react-native/docs/accessibility#accessibilityignoresinvertcolorsios - * @platform ios - */ - accessibilityIgnoresInvertColors?: boolean -} + /** + * Something else wants to become responder. + * Should this view release the responder? Returning true allows release + */ + onResponderTerminationRequest?: (event: GestureResponderEvent) => boolean; -type AccessibilityTrait = - | 'none' - | 'button' - | 'link' - | 'header' - | 'search' - | 'image' - | 'selected' - | 'plays' - | 'key' - | 'text' - | 'summary' - | 'disabled' - | 'frequentUpdates' - | 'startsMedia' - | 'adjustable' - | 'allowsDirectInteraction' - | 'pageTurn' + /** + * The responder has been taken from the View. + * Might be taken by other views after a call to onResponderTerminationRequest, + * or might be taken by the OS without asking (happens with control center/ notification center on iOS) + */ + onResponderTerminate?: (event: GestureResponderEvent) => void; -/** + /** + * onStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, + * where the deepest node is called first. + * That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. + * This is desirable in most cases, because it makes sure all controls and buttons are usable. + * + * However, sometimes a parent will want to make sure that it becomes responder. + * This can be handled by using the capture phase. + * Before the responder system bubbles up from the deepest component, + * it will do a capture phase, firing on*ShouldSetResponderCapture. + * So if a parent View wants to prevent the child from becoming responder on a touch start, + * it should have a onStartShouldSetResponderCapture handler which returns true. + */ + onStartShouldSetResponderCapture?: (event: GestureResponderEvent) => boolean; + + /** + * onStartShouldSetResponder and onMoveShouldSetResponder are called with a bubbling pattern, + * where the deepest node is called first. + * That means that the deepest component will become responder when multiple Views return true for *ShouldSetResponder handlers. + * This is desirable in most cases, because it makes sure all controls and buttons are usable. + * + * However, sometimes a parent will want to make sure that it becomes responder. + * This can be handled by using the capture phase. + * Before the responder system bubbles up from the deepest component, + * it will do a capture phase, firing on*ShouldSetResponderCapture. + * So if a parent View wants to prevent the child from becoming responder on a touch start, + * it should have a onStartShouldSetResponderCapture handler which returns true. + */ + onMoveShouldSetResponderCapture?: (event: GestureResponderEvent) => boolean; +} + +/** + * @see https://facebook.github.io/react-native/docs/view.html#style + * @see https://github.com/facebook/react-native/blob/master/Libraries/Components/View/ViewStylePropTypes.js + */ +export interface ViewStyle extends FlexStyle, ShadowStyleIOS, TransformsStyle { + backfaceVisibility?: "visible" | "hidden"; + backgroundColor?: string; + borderBottomColor?: string; + borderBottomEndRadius?: number; + borderBottomLeftRadius?: number; + borderBottomRightRadius?: number; + borderBottomStartRadius?: number; + borderBottomWidth?: number; + borderColor?: string; + borderEndColor?: string; + borderLeftColor?: string; + borderLeftWidth?: number; + borderRadius?: number; + borderRightColor?: string; + borderRightWidth?: number; + borderStartColor?: string; + borderStyle?: "solid" | "dotted" | "dashed"; + borderTopColor?: string; + borderTopEndRadius?: number; + borderTopLeftRadius?: number; + borderTopRightRadius?: number; + borderTopStartRadius?: number; + borderTopWidth?: number; + borderWidth?: number; + opacity?: number; + testID?: string; + /** + * Sets the elevation of a view, using Android's underlying + * [elevation API](https://developer.android.com/training/material/shadows-clipping.html#Elevation). + * This adds a drop shadow to the item and affects z-order for overlapping views. + * Only supported on Android 5.0+, has no effect on earlier versions. + * + * @platform android + */ + elevation?: number; +} + +export type TVParallaxProperties = { + /** + * If true, parallax effects are enabled. Defaults to true. + */ + enabled?: boolean, + + /** + * Defaults to 2.0. + */ + shiftDistanceX?: number, + + /** + * Defaults to 2.0. + */ + shiftDistanceY?: number, + + /** + * Defaults to 0.05. + */ + tiltAngle?: number, + + /** + * Defaults to 1.0 + */ + magnification?: number, + + /** + * Defaults to 1.0 + */ + pressMagnification?: number, + + /** + * Defaults to 0.3 + */ + pressDuration?: number, + + /** + * Defaults to 0.3 + */ + pressDelay?: number, +} + +export interface TVViewPropsIOS { + /** + * *(Apple TV only)* When set to true, this view will be focusable + * and navigable using the Apple TV remote. + * + * @platform ios + */ + isTVSelectable?: boolean, + + /** + * *(Apple TV only)* May be set to true to force the Apple TV focus engine to move focus to this view. + * + * @platform ios + */ + hasTVPreferredFocus?: boolean, + + /** + * *(Apple TV only)* Object with properties to control Apple TV parallax effects. + * + * @platform ios + */ + tvParallaxProperties?: TVParallaxProperties, + + /** + * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0. + * + * @platform ios + */ + tvParallaxShiftDistanceX?: number, + + /** + * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 2.0. + * + * @platform ios + */ + tvParallaxShiftDistanceY?: number, + + /** + * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 0.05. + * + * @platform ios + */ + tvParallaxTiltAngle?: number, + + /** + * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus. Defaults to 1.0. + * + * @platform ios + */ + tvParallaxMagnification?: number, +} + +export interface ViewPropsIOS extends TVViewPropsIOS { + /** + * A Boolean value indicating whether VoiceOver should ignore the elements within views that are siblings of the receiver. + * @platform ios + */ + accessibilityViewIsModal?: boolean; + + /** + * Provides an array of custom actions available for accessibility. + * @platform ios + */ + accessibilityActions?: Array; + + /** + * When `accessible` is true, the system will try to invoke this function + * when the user performs an accessibility custom action. + * @platform ios + */ + onAccessibilityAction?: () => void; + + /** + * Whether this view should be rendered as a bitmap before compositing. + * + * On iOS, this is useful for animations and interactions that do not modify this component's dimensions nor its children; + * for example, when translating the position of a static view, rasterization allows the renderer to reuse a cached bitmap of a static view + * and quickly composite it during each frame. + * + * Rasterization incurs an off-screen drawing pass and the bitmap consumes memory. + * Test and measure when using this property. + */ + shouldRasterizeIOS?: boolean; +} + +export interface ViewPropsAndroid { + /** + * Views that are only used to layout their children or otherwise don't draw anything + * may be automatically removed from the native hierarchy as an optimization. + * Set this property to false to disable this optimization and ensure that this View exists in the native view hierarchy. + */ + collapsable?: boolean; + + /** + * Whether this view needs to rendered offscreen and composited with an alpha in order to preserve 100% correct colors and blending behavior. + * The default (false) falls back to drawing the component and its children + * with an alpha applied to the paint used to draw each element instead of rendering the full component offscreen and compositing it back with an alpha value. + * This default may be noticeable and undesired in the case where the View you are setting an opacity on + * has multiple overlapping elements (e.g. multiple overlapping Views, or text and a background). + * + * Rendering offscreen to preserve correct alpha behavior is extremely expensive + * and hard to debug for non-native developers, which is why it is not turned on by default. + * If you do need to enable this property for an animation, + * consider combining it with renderToHardwareTextureAndroid if the view contents are static (i.e. it doesn't need to be redrawn each frame). + * If that property is enabled, this View will be rendered off-screen once, + * saved in a hardware texture, and then composited onto the screen with an alpha each frame without having to switch rendering targets on the GPU. + */ + needsOffscreenAlphaCompositing?: boolean; + + /** + * Whether this view should render itself (and all of its children) into a single hardware texture on the GPU. + * + * On Android, this is useful for animations and interactions that only modify opacity, rotation, translation, and/or scale: + * in those cases, the view doesn't have to be redrawn and display lists don't need to be re-executed. The texture can just be + * re-used and re-composited with different parameters. The downside is that this can use up limited video memory, so this prop should be set back to false at the end of the interaction/animation. + */ + renderToHardwareTextureAndroid?: boolean; +} + +type Falsy = undefined | null | false; +interface RecursiveArray extends Array> {} +/** Keep a brand of 'T' so that calls to `StyleSheet.flatten` can take `RegisteredStyle` and return `T`. */ +type RegisteredStyle = number & { __registeredStyleBrand: T }; +export type StyleProp = T | RegisteredStyle | RecursiveArray | Falsy> | Falsy; + +/** + * @see https://facebook.github.io/react-native/docs/accessibility.html#accessibility-properties + */ +export interface AccessibilityProps extends AccessibilityPropsAndroid, AccessibilityPropsIOS { + /** + * When true, indicates that the view is an accessibility element. + * By default, all the touchable elements are accessible. + */ + accessible?: boolean; + + /** + * Overrides the text that's read by the screen reader when the user interacts with the element. By default, the + * label is constructed by traversing all the children and accumulating all the Text nodes separated by space. + */ + accessibilityLabel?: string; + + /** + * Accessibility Role tells a person using either VoiceOver on iOS or TalkBack on Android the type of element that is focused on. + */ + accessibilityRole?: AccessibilityRole; + /** + * Accessibility State tells a person using either VoiceOver on iOS or TalkBack on Android the state of the element currently focused on. + * @deprecated: accessibilityState available in 0.60+ + */ + accessibilityStates?: AccessibilityStates[]; + /** + * Accessibility State tells a person using either VoiceOver on iOS or TalkBack on Android the state of the element currently focused on. + */ + accessibilityState?: AccessibilityState; + /** + * An accessibility hint helps users understand what will happen when they perform an action on the accessibility element when that result is not obvious from the accessibility label. + */ + accessibilityHint?: string; +} + +// @deprecated: use AccessibilityState available in 0.60+ +export type AccessibilityStates = + | "disabled" + | "selected" + | "checked" + | "unchecked" + | "busy" + | "expanded" + | "collapsed" + | "hasPopup"; + +export interface AccessibilityState { + /** + * When true, informs accessible tools if the element is disabled + */ + disabled?: boolean; + /** + * When true, informs accessible tools if the element is selected + */ + selected?: boolean; + /** + * For items like Checkboxes and Toggle switches, reports their state to accessible tools + */ + checked?: boolean | "mixed"; + /** + * When present, informs accessible tools if the element is busy + */ + busy?: boolean; + /** + * When present, informs accessible tools the element is expanded or collapsed + */ + expanded?: boolean; +} + +export type AccessibilityRole = + | "none" + | "button" + | "link" + | "search" + | "image" + | "keyboardkey" + | "text" + | "adjustable" + | "imagebutton" + | "header" + | "summary" + | "alert" + | "checkbox" + | "combobox" + | "menu" + | "menubar" + | "menuitem" + | "progressbar" + | "radio" + | "radiogroup" + | "scrollbar" + | "spinbutton" + | "switch" + | "tab" + | "tablist" + | "timer" + | "toolbar"; + + +export interface AccessibilityPropsAndroid { + /** + * In some cases, we also want to alert the end user of the type of selected component (i.e., that it is a “button”). + * If we were using native buttons, this would work automatically. Since we are using javascript, we need to + * provide a bit more context for TalkBack. To do so, you must specify the ‘accessibilityComponentType’ property + * for any UI component. For instances, we support ‘button’, ‘radiobutton_checked’ and ‘radiobutton_unchecked’ and so on. + * @platform android + */ + accessibilityComponentType?: "none" | "button" | "radiobutton_checked" | "radiobutton_unchecked"; + + /** + * Indicates to accessibility services whether the user should be notified when this view changes. + * Works for Android API >= 19 only. + * See http://developer.android.com/reference/android/view/View.html#attr_android:accessibilityLiveRegion for references. + * @platform android + */ + accessibilityLiveRegion?: "none" | "polite" | "assertive"; + + /** + * Controls how view is important for accessibility which is if it fires accessibility events + * and if it is reported to accessibility services that query the screen. + * Works for Android only. See http://developer.android.com/reference/android/R.attr.html#importantForAccessibility for references. + * + * Possible values: + * 'auto' - The system determines whether the view is important for accessibility - default (recommended). + * 'yes' - The view is important for accessibility. + * 'no' - The view is not important for accessibility. + * 'no-hide-descendants' - The view is not important for accessibility, nor are any of its descendant views. + */ + importantForAccessibility?: "auto" | "yes" | "no" | "no-hide-descendants"; +} + +export interface AccessibilityPropsIOS { + /** + * A Boolean value indicating whether the accessibility elements contained within this accessibility element + * are hidden to the screen reader. + * @platform ios + */ + accessibilityElementsHidden?: boolean; + + /** + * Accessibility traits tell a person using VoiceOver what kind of element they have selected. + * Is this element a label? A button? A header? These questions are answered by accessibilityTraits. + * @platform ios + */ + accessibilityTraits?: AccessibilityTrait | AccessibilityTrait[]; + + /** + * When `accessible` is true, the system will try to invoke this function when the user performs accessibility tap gesture. + * @platform ios + */ + onAccessibilityTap?: () => void; + + /** + * When accessible is true, the system will invoke this function when the user performs the magic tap gesture. + * @platform ios + */ + onMagicTap?: () => void; + + /** + * https://facebook.github.io/react-native/docs/accessibility#accessibilityignoresinvertcolorsios + * @platform ios + */ + accessibilityIgnoresInvertColors?: boolean; +} + +type AccessibilityTrait = + | "none" + | "button" + | "link" + | "header" + | "search" + | "image" + | "selected" + | "plays" + | "key" + | "text" + | "summary" + | "disabled" + | "frequentUpdates" + | "startsMedia" + | "adjustable" + | "allowsDirectInteraction" + | "pageTurn"; + +/** * @see https://facebook.github.io/react-native/docs/view.html#props */ export interface ViewProps - extends ViewPropsAndroid, - ViewPropsIOS, - GestureResponderHandlers, - Touchable, - AccessibilityProps { - /** - * This defines how far a touch event can start away from the view. - * Typical interface guidelines recommend touch targets that are at least - * 30 - 40 points/density-independent pixels. If a Touchable view has - * a height of 20 the touchable height can be extended to 40 with - * hitSlop={{top: 10, bottom: 10, left: 0, right: 0}} - * NOTE The touch area never extends past the parent view bounds and - * the Z-index of sibling views always takes precedence if a touch - * hits two overlapping views. - */ - hitSlop?: Insets - - /** - * Invoked on mount and layout changes with - * - * {nativeEvent: { layout: {x, y, width, height}}}. - */ - onLayout?: (event: LayoutChangeEvent) => void - - /** - * - * In the absence of auto property, none is much like CSS's none value. box-none is as if you had applied the CSS class: - * - * .box-none { - * pointer-events: none; - * } - * .box-none * { - * pointer-events: all; - * } - * - * box-only is the equivalent of - * - * .box-only { - * pointer-events: all; - * } - * .box-only * { - * pointer-events: none; - * } - * - * But since pointerEvents does not affect layout/appearance, and we are already deviating from the spec by adding additional modes, - * we opt to not include pointerEvents on style. On some platforms, we would need to implement it as a className anyways. Using style or not is an implementation detail of the platform. - */ - pointerEvents?: 'box-none' | 'none' | 'box-only' | 'auto' - - /** - * - * This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, - * most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. - * The subviews must also have overflow: hidden, as should the containing view (or one of its superviews). - */ - removeClippedSubviews?: boolean - - style?: StyleProp - - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string - - /** - * Used to reference react managed views from native code. - */ - nativeID?: string + extends ViewPropsAndroid, + ViewPropsIOS, + GestureResponderHandlers, + Touchable, + AccessibilityProps { + /** + * This defines how far a touch event can start away from the view. + * Typical interface guidelines recommend touch targets that are at least + * 30 - 40 points/density-independent pixels. If a Touchable view has + * a height of 20 the touchable height can be extended to 40 with + * hitSlop={{top: 10, bottom: 10, left: 0, right: 0}} + * NOTE The touch area never extends past the parent view bounds and + * the Z-index of sibling views always takes precedence if a touch + * hits two overlapping views. + */ + hitSlop?: Insets; + + /** + * Invoked on mount and layout changes with + * + * {nativeEvent: { layout: {x, y, width, height}}}. + */ + onLayout?: (event: LayoutChangeEvent) => void; + + /** + * + * In the absence of auto property, none is much like CSS's none value. box-none is as if you had applied the CSS class: + * + * .box-none { + * pointer-events: none; + * } + * .box-none * { + * pointer-events: all; + * } + * + * box-only is the equivalent of + * + * .box-only { + * pointer-events: all; + * } + * .box-only * { + * pointer-events: none; + * } + * + * But since pointerEvents does not affect layout/appearance, and we are already deviating from the spec by adding additional modes, + * we opt to not include pointerEvents on style. On some platforms, we would need to implement it as a className anyways. Using style or not is an implementation detail of the platform. + */ + pointerEvents?: "box-none" | "none" | "box-only" | "auto"; + + /** + * + * This is a special performance property exposed by RCTView and is useful for scrolling content when there are many subviews, + * most of which are offscreen. For this property to be effective, it must be applied to a view that contains many subviews that extend outside its bound. + * The subviews must also have overflow: hidden, as should the containing view (or one of its superviews). + */ + removeClippedSubviews?: boolean; + + style?: StyleProp; + + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; + + /** + * Used to reference react managed views from native code. + */ + nativeID?: string; } /** @@ -2297,13 +2282,13 @@ export interface ViewProps * whether that is a UIView,

, android.view, etc. */ declare class ViewComponent extends React.Component {} -declare const ViewBase: Constructor & typeof ViewComponent +declare const ViewBase: Constructor & typeof ViewComponent; export class View extends ViewBase { - /** - * Is 3D Touch / Force Touch available (i.e. will touch events include `force`) - * @platform ios - */ - static forceTouchAvailable: boolean + /** + * Is 3D Touch / Force Touch available (i.e. will touch events include `force`) + * @platform ios + */ + static forceTouchAvailable: boolean; } /** @@ -2311,84 +2296,84 @@ export class View extends ViewBase { */ export interface ViewPagerAndroidOnPageScrollEventData { - position: number - offset: number + position: number; + offset: number; } export interface ViewPagerAndroidOnPageSelectedEventData { - position: number + position: number; } export interface ViewPagerAndroidProps extends ViewProps { - /** - * Index of initial page that should be selected. Use `setPage` method to - * update the page, and `onPageSelected` to monitor page changes - */ - initialPage?: number - - /** - * When false, the content does not scroll. - * The default value is true. - */ - scrollEnabled?: boolean - - /** - * Executed when transitioning between pages (ether because of animation for - * the requested page change or when user is swiping/dragging between pages) - * The `event.nativeEvent` object for this callback will carry following data: - * - position - index of first page from the left that is currently visible - * - offset - value from range [0,1) describing stage between page transitions. - * Value x means that (1 - x) fraction of the page at "position" index is - * visible, and x fraction of the next page is visible. - */ - onPageScroll?: (event: NativeSyntheticEvent) => void - - /** - * This callback will be called once ViewPager finish navigating to selected page - * (when user swipes between pages). The `event.nativeEvent` object passed to this - * callback will have following fields: - * - position - index of page that has been selected - */ - onPageSelected?: (event: NativeSyntheticEvent) => void - - /** - * Function called when the page scrolling state has changed. - * The page scrolling state can be in 3 states: - * - idle, meaning there is no interaction with the page scroller happening at the time - * - dragging, meaning there is currently an interaction with the page scroller - * - settling, meaning that there was an interaction with the page scroller, and the - * page scroller is now finishing it's closing or opening animation - */ - onPageScrollStateChanged?: (state: 'Idle' | 'Dragging' | 'Settling') => void - - /** - * Determines whether the keyboard gets dismissed in response to a drag. - * - 'none' (the default), drags do not dismiss the keyboard. - * - 'on-drag', the keyboard is dismissed when a drag begins. - */ - keyboardDismissMode?: 'none' | 'on-drag' - - /** - * Blank space to show between pages. This is only visible while scrolling, pages are still - * edge-to-edge. - */ - pageMargin?: number + /** + * Index of initial page that should be selected. Use `setPage` method to + * update the page, and `onPageSelected` to monitor page changes + */ + initialPage?: number; + + /** + * When false, the content does not scroll. + * The default value is true. + */ + scrollEnabled?: boolean; + + /** + * Executed when transitioning between pages (ether because of animation for + * the requested page change or when user is swiping/dragging between pages) + * The `event.nativeEvent` object for this callback will carry following data: + * - position - index of first page from the left that is currently visible + * - offset - value from range [0,1) describing stage between page transitions. + * Value x means that (1 - x) fraction of the page at "position" index is + * visible, and x fraction of the next page is visible. + */ + onPageScroll?: (event: NativeSyntheticEvent) => void; + + /** + * This callback will be called once ViewPager finish navigating to selected page + * (when user swipes between pages). The `event.nativeEvent` object passed to this + * callback will have following fields: + * - position - index of page that has been selected + */ + onPageSelected?: (event: NativeSyntheticEvent) => void; + + /** + * Function called when the page scrolling state has changed. + * The page scrolling state can be in 3 states: + * - idle, meaning there is no interaction with the page scroller happening at the time + * - dragging, meaning there is currently an interaction with the page scroller + * - settling, meaning that there was an interaction with the page scroller, and the + * page scroller is now finishing it's closing or opening animation + */ + onPageScrollStateChanged?: (state: "Idle" | "Dragging" | "Settling") => void; + + /** + * Determines whether the keyboard gets dismissed in response to a drag. + * - 'none' (the default), drags do not dismiss the keyboard. + * - 'on-drag', the keyboard is dismissed when a drag begins. + */ + keyboardDismissMode?: "none" | "on-drag"; + + /** + * Blank space to show between pages. This is only visible while scrolling, pages are still + * edge-to-edge. + */ + pageMargin?: number; } declare class ViewPagerAndroidComponent extends React.Component {} -declare const ViewPagerAndroidBase: Constructor & typeof ViewPagerAndroidComponent +declare const ViewPagerAndroidBase: Constructor & typeof ViewPagerAndroidComponent; export class ViewPagerAndroid extends ViewPagerAndroidBase { - /** - * A helper function to scroll to a specific page in the ViewPager. - * The transition between pages will be animated. - */ - setPage(selectedPage: number): void + /** + * A helper function to scroll to a specific page in the ViewPager. + * The transition between pages will be animated. + */ + setPage(selectedPage: number): void; - /** - * A helper function to scroll to a specific page in the ViewPager. - * The transition between pages will *not* be animated. - */ - setPageWithoutAnimation(selectedPage: number): void + /** + * A helper function to scroll to a specific page in the ViewPager. + * The transition between pages will *not* be animated. + */ + setPageWithoutAnimation(selectedPage: number): void; } /** @@ -2396,365 +2381,365 @@ export class ViewPagerAndroid extends ViewPagerAndroidBase { * It can automatically adjust either its position or bottom padding based on the position of the keyboard. */ declare class KeyboardAvoidingViewComponent extends React.Component {} -declare const KeyboardAvoidingViewBase: Constructor & typeof KeyboardAvoidingViewComponent +declare const KeyboardAvoidingViewBase: Constructor & typeof KeyboardAvoidingViewComponent; export class KeyboardAvoidingView extends KeyboardAvoidingViewBase {} export interface KeyboardAvoidingViewProps extends ViewProps { - behavior?: 'height' | 'position' | 'padding' + behavior?: "height" | "position" | "padding"; - /** - * The style of the content container(View) when behavior is 'position'. - */ - contentContainerStyle?: StyleProp + /** + * The style of the content container(View) when behavior is 'position'. + */ + contentContainerStyle?: StyleProp; - /** - * This is the distance between the top of the user screen and the react native view, - * may be non-zero in some use cases. - */ - keyboardVerticalOffset?: number + /** + * This is the distance between the top of the user screen and the react native view, + * may be non-zero in some use cases. + */ + keyboardVerticalOffset?: number; - /** - * Enables or disables the KeyboardAvoidingView. - * - * Default is true - */ - enabled?: boolean + /** + * Enables or disables the KeyboardAvoidingView. + * + * Default is true + */ + enabled?: boolean; } /** * //FIXME: No documentation extracted from code comment on WebView.ios.js */ export interface NavState { - url?: string - title?: string - loading?: boolean - canGoBack?: boolean - canGoForward?: boolean + url?: string; + title?: string; + loading?: boolean; + canGoBack?: boolean; + canGoForward?: boolean; - [key: string]: any + [key: string]: any; } /** * Passed data from WebView via window.postMessage. */ export interface WebViewMessageEventData { - /** - * The data sent from a WebView; can only be a string. - */ - data: string + /** + * The data sent from a WebView; can only be a string. + */ + data: string; } export interface WebViewPropsAndroid { - /** - * Used for android only, JS is enabled by default for WebView on iOS - */ - javaScriptEnabled?: boolean - - /** - * Used on Android only, controls whether DOM Storage is enabled - * or not android - */ - domStorageEnabled?: boolean - - /** - * Sets the user-agent for the WebView. - */ - userAgent?: string - - /** + /** + * Used for android only, JS is enabled by default for WebView on iOS + */ + javaScriptEnabled?: boolean; + + /** + * Used on Android only, controls whether DOM Storage is enabled + * or not android + */ + domStorageEnabled?: boolean; + + /** + * Sets the user-agent for the WebView. + */ + userAgent?: string; + + /** * Specifies the mixed content mode. i.e WebView will allow a secure origin to load content from any other origin. Possible values for mixedContentMode are: 'never' (default) - WebView will not allow a secure origin to load content from an insecure origin. 'always' - WebView will allow a secure origin to load content from any other origin, even if that origin is insecure. 'compatibility' - WebView will attempt to be compatible with the approach of a modern web browser with regard to mixed content. */ - mixedContentMode?: 'never' | 'always' | 'compatibility' + mixedContentMode?: "never" | "always" | "compatibility"; - /** - * Controls whether form autocomplete data should be saved - */ - saveFormDataDisabled?: boolean + /** + * Controls whether form autocomplete data should be saved + */ + saveFormDataDisabled?: boolean; - /** - * Sets whether the webview allows access to the file system. - */ - allowFileAccess?: boolean + /** + * Sets whether the webview allows access to the file system. + */ + allowFileAccess?: boolean; } export interface WebViewIOSLoadRequestEvent extends TargetedEvent { - canGoBack: boolean - lockIdentifier: number - loading: boolean - title: string - canGoForward: boolean - navigationType: 'click' | 'formsubmit' | 'backforward' | 'reload' | 'formresubmit' | 'other' - url: string + canGoBack: boolean; + lockIdentifier: number; + loading: boolean; + title: string; + canGoForward: boolean; + navigationType: "click" | "formsubmit" | "backforward" | "reload" | "formresubmit" | "other"; + url: string; } export interface WebViewPropsIOS { - /** - * Determines whether HTML5 videos play inline or use the native - * full-screen controller. default value false - * NOTE : "In order * for video to play inline, not only does - * this property need to be set to true, but the video element - * in the HTML document must also include the webkit-playsinline - * attribute." - */ - allowsInlineMediaPlayback?: boolean - - /** - * Boolean value that determines whether the web view bounces - * when it reaches the edge of the content. The default value is `true`. - * @platform ios - */ - bounces?: boolean - - /** - * Determines the types of data converted to clickable URLs in - * the web view’s content. By default only phone numbers are detected. - * - * You can provide one type or an array of many types. - * - * Possible values for `dataDetectorTypes` are: - * - * - `'phoneNumber'` - * - `'link'` - * - `'address'` - * - `'calendarEvent'` - * - `'none'` - * - `'all'` - */ - dataDetectorTypes?: DataDetectorTypes | DataDetectorTypes[] - - /** - * A floating-point number that determines how quickly the scroll - * view decelerates after the user lifts their finger. You may also - * use string shortcuts "normal" and "fast" which match the - * underlying iOS settings for UIScrollViewDecelerationRateNormal - * and UIScrollViewDecelerationRateFast respectively. - * - normal: 0.998 - fast: 0.99 (the default for iOS WebView) - */ - decelerationRate?: 'normal' | 'fast' | number - - /** - * Allows custom handling of any webview requests by a JS handler. - * Return true or false from this method to continue loading the - * request. - */ - onShouldStartLoadWithRequest?: (event: WebViewIOSLoadRequestEvent) => boolean - - /** - * Boolean value that determines whether scrolling is enabled in the - * `WebView`. The default value is `true`. - */ - scrollEnabled?: boolean - - /** - * If `true`, use WKWebView instead of UIWebView. - */ - useWebKit?: boolean -} + /** + * Determines whether HTML5 videos play inline or use the native + * full-screen controller. default value false + * NOTE : "In order * for video to play inline, not only does + * this property need to be set to true, but the video element + * in the HTML document must also include the webkit-playsinline + * attribute." + */ + allowsInlineMediaPlayback?: boolean; -export interface WebViewUriSource { - /* - * The URI to load in the WebView. Can be a local or remote file. - */ - uri?: string - - /* - * The HTTP Method to use. Defaults to GET if not specified. - * NOTE: On Android, only GET and POST are supported. - */ - method?: 'GET' | 'POST' - - /* - * Additional HTTP headers to send with the request. - * NOTE: On Android, this can only be used with GET requests. - */ - headers?: any - - /* - * The HTTP body to send with the request. This must be a valid - * UTF-8 string, and will be sent exactly as specified, with no - * additional encoding (e.g. URL-escaping or base64) applied. - * NOTE: On Android, this can only be used with POST requests. - */ - body?: string + /** + * Boolean value that determines whether the web view bounces + * when it reaches the edge of the content. The default value is `true`. + * @platform ios + */ + bounces?: boolean; + + /** + * Determines the types of data converted to clickable URLs in + * the web view’s content. By default only phone numbers are detected. + * + * You can provide one type or an array of many types. + * + * Possible values for `dataDetectorTypes` are: + * + * - `'phoneNumber'` + * - `'link'` + * - `'address'` + * - `'calendarEvent'` + * - `'none'` + * - `'all'` + */ + dataDetectorTypes?: DataDetectorTypes | DataDetectorTypes[]; + + /** + * A floating-point number that determines how quickly the scroll + * view decelerates after the user lifts their finger. You may also + * use string shortcuts "normal" and "fast" which match the + * underlying iOS settings for UIScrollViewDecelerationRateNormal + * and UIScrollViewDecelerationRateFast respectively. + * - normal: 0.998 - fast: 0.99 (the default for iOS WebView) + */ + decelerationRate?: "normal" | "fast" | number; + + /** + * Allows custom handling of any webview requests by a JS handler. + * Return true or false from this method to continue loading the + * request. + */ + onShouldStartLoadWithRequest?: (event: WebViewIOSLoadRequestEvent) => boolean; + + /** + * Boolean value that determines whether scrolling is enabled in the + * `WebView`. The default value is `true`. + */ + scrollEnabled?: boolean; + + /** + * If `true`, use WKWebView instead of UIWebView. + */ + useWebKit?: boolean; +} + +export interface WebViewUriSource { + /* + * The URI to load in the WebView. Can be a local or remote file. + */ + uri?: string; + + /* + * The HTTP Method to use. Defaults to GET if not specified. + * NOTE: On Android, only GET and POST are supported. + */ + method?: "GET" | "POST"; + + /* + * Additional HTTP headers to send with the request. + * NOTE: On Android, this can only be used with GET requests. + */ + headers?: any; + + /* + * The HTTP body to send with the request. This must be a valid + * UTF-8 string, and will be sent exactly as specified, with no + * additional encoding (e.g. URL-escaping or base64) applied. + * NOTE: On Android, this can only be used with POST requests. + */ + body?: string; } export interface WebViewHtmlSource { - /* - * A static HTML page to display in the WebView. - */ - html: string + /* + * A static HTML page to display in the WebView. + */ + html: string; - /* - * The base URL to be used for any relative links in the HTML. - */ - baseUrl?: string + /* + * The base URL to be used for any relative links in the HTML. + */ + baseUrl?: string; } export interface WebViewNativeConfig { - /* - * The native component used to render the WebView. - */ - component?: any + /* + * The native component used to render the WebView. + */ + component?: any; - /* - * Set props directly on the native component WebView. Enables custom props which the - * original WebView doesn't pass through. - */ - props?: object + /* + * Set props directly on the native component WebView. Enables custom props which the + * original WebView doesn't pass through. + */ + props?: object; - /* - * Set the ViewManager to use for communication with the native side. - * @platform ios - */ - viewManager?: object + /* + * Set the ViewManager to use for communication with the native side. + * @platform ios + */ + viewManager?: object; } /** * @see https://facebook.github.io/react-native/docs/webview.html#props */ export interface WebViewProps extends ViewProps, WebViewPropsAndroid, WebViewPropsIOS { - /** - * Controls whether to adjust the content inset for web views that are - * placed behind a navigation bar, tab bar, or toolbar. The default value - * is `true`. - */ - automaticallyAdjustContentInsets?: boolean - - /** - * The amount by which the web view content is inset from the edges of - * the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}. - */ - contentInset?: Insets - - /** - * @deprecated - */ - html?: string - - /** - * Set this to provide JavaScript that will be injected into the web page - * when the view loads. - */ - injectedJavaScript?: string - - /** - * Invoked when load fails - */ - onError?: (event: NavState) => void - - /** - * Invoked when load finish - */ - onLoad?: (event: NavState) => void - - /** - * Invoked when load either succeeds or fails - */ - onLoadEnd?: (event: NavState) => void - - /** - * Invoked on load start - */ - onLoadStart?: (event: NavState) => void - - /** - * Invoked when window.postMessage is called from WebView. - */ - onMessage?: (event: NativeSyntheticEvent) => void - - /** - * Function that is invoked when the `WebView` loading starts or ends. - */ - onNavigationStateChange?: (event: NavState) => void - - /** - * Function that returns a view to show if there's an error. - */ - renderError?: () => React.ReactElement - - /** - * Function that returns a loading indicator. - */ - renderLoading?: () => React.ReactElement - - /** - * Boolean value that forces the `WebView` to show the loading view - * on the first load. - */ - startInLoadingState?: boolean - - style?: StyleProp - - // Deprecated: Use the `source` prop instead. - url?: string - - source?: WebViewUriSource | WebViewHtmlSource | number - - /** - * Determines whether HTML5 audio & videos require the user to tap - * before they can start playing. The default value is false. - */ - mediaPlaybackRequiresUserAction?: boolean - - /** - * sets whether the webpage scales to fit the view and the user can change the scale - */ - scalesPageToFit?: boolean - - /** - * List of origin strings to allow being navigated to. - * The strings allow wildcards and get matched against just the origin (not the full URL). - * If the user taps to navigate to a new page but the new page is not in this whitelist, the URL will be handled by the OS. - * The default whitelisted origins are "http://" and "https://". - */ - originWhitelist?: string[] - - /** - * Override the native component used to render the WebView. Enables a custom native - * WebView which uses the same JavaScript as the original WebView. - */ - nativeConfig?: WebViewNativeConfig + /** + * Controls whether to adjust the content inset for web views that are + * placed behind a navigation bar, tab bar, or toolbar. The default value + * is `true`. + */ + automaticallyAdjustContentInsets?: boolean; + + /** + * The amount by which the web view content is inset from the edges of + * the scroll view. Defaults to {top: 0, left: 0, bottom: 0, right: 0}. + */ + contentInset?: Insets; + + /** + * @deprecated + */ + html?: string; + + /** + * Set this to provide JavaScript that will be injected into the web page + * when the view loads. + */ + injectedJavaScript?: string; + + /** + * Invoked when load fails + */ + onError?: (event: NavState) => void; + + /** + * Invoked when load finish + */ + onLoad?: (event: NavState) => void; + + /** + * Invoked when load either succeeds or fails + */ + onLoadEnd?: (event: NavState) => void; + + /** + * Invoked on load start + */ + onLoadStart?: (event: NavState) => void; + + /** + * Invoked when window.postMessage is called from WebView. + */ + onMessage?: (event: NativeSyntheticEvent) => void; + + /** + * Function that is invoked when the `WebView` loading starts or ends. + */ + onNavigationStateChange?: (event: NavState) => void; + + /** + * Function that returns a view to show if there's an error. + */ + renderError?: () => React.ReactElement; + + /** + * Function that returns a loading indicator. + */ + renderLoading?: () => React.ReactElement; + + /** + * Boolean value that forces the `WebView` to show the loading view + * on the first load. + */ + startInLoadingState?: boolean; + + style?: StyleProp; + + // Deprecated: Use the `source` prop instead. + url?: string; + + source?: WebViewUriSource | WebViewHtmlSource | number; + + /** + * Determines whether HTML5 audio & videos require the user to tap + * before they can start playing. The default value is false. + */ + mediaPlaybackRequiresUserAction?: boolean; + + /** + * sets whether the webpage scales to fit the view and the user can change the scale + */ + scalesPageToFit?: boolean; + + /** + * List of origin strings to allow being navigated to. + * The strings allow wildcards and get matched against just the origin (not the full URL). + * If the user taps to navigate to a new page but the new page is not in this whitelist, the URL will be handled by the OS. + * The default whitelisted origins are "http://" and "https://". + */ + originWhitelist?: string[]; + + /** + * Override the native component used to render the WebView. Enables a custom native + * WebView which uses the same JavaScript as the original WebView. + */ + nativeConfig?: WebViewNativeConfig; } export class WebView extends React.Component { - /** - * Go back one page in the webview's history. - */ - goBack: () => void - - /** - * Go forward one page in the webview's history. - */ - goForward: () => void - - /** - * Post a message to the WebView in the form of a string. - */ - postMessage: (message: string) => void - - /** - * Reloads the current page. - */ - reload: () => void - - /** - * Stop loading the current page. - */ - stopLoading(): void - - /** - * Returns the native webview node. - */ - getWebViewHandle: () => any - - /** - * Inject JavaScript to be executed immediately. - */ - injectJavaScript: (script: string) => void + /** + * Go back one page in the webview's history. + */ + goBack: () => void; + + /** + * Go forward one page in the webview's history. + */ + goForward: () => void; + + /** + * Post a message to the WebView in the form of a string. + */ + postMessage: (message: string) => void; + + /** + * Reloads the current page. + */ + reload: () => void; + + /** + * Stop loading the current page. + */ + stopLoading(): void; + + /** + * Returns the native webview node. + */ + getWebViewHandle: () => any; + + /** + * Inject JavaScript to be executed immediately. + */ + injectJavaScript: (script: string) => void; } /** @@ -2762,47 +2747,47 @@ export class WebView extends React.Component { * @see SegmentedControlIOS.ios.js */ export interface NativeSegmentedControlIOSChangeEvent extends TargetedEvent { - value: string - selectedSegmentIndex: number + value: string; + selectedSegmentIndex: number; } export interface SegmentedControlIOSProps extends ViewProps { - /** - * If false the user won't be able to interact with the control. Default value is true. - */ - enabled?: boolean - - /** - * If true, then selecting a segment won't persist visually. - * The onValueChange callback will still work as expected. - */ - momentary?: boolean - - /** - * Callback that is called when the user taps a segment; - * passes the event as an argument - */ - onChange?: (event: NativeSyntheticEvent) => void - - /** - * Callback that is called when the user taps a segment; passes the segment's value as an argument - */ - onValueChange?: (value: string) => void - - /** - * The index in props.values of the segment to be (pre)selected. - */ - selectedIndex?: number - - /** - * Accent color of the control. - */ - tintColor?: string - - /** - * The labels for the control's segment buttons, in order. - */ - values?: string[] + /** + * If false the user won't be able to interact with the control. Default value is true. + */ + enabled?: boolean; + + /** + * If true, then selecting a segment won't persist visually. + * The onValueChange callback will still work as expected. + */ + momentary?: boolean; + + /** + * Callback that is called when the user taps a segment; + * passes the event as an argument + */ + onChange?: (event: NativeSyntheticEvent) => void; + + /** + * Callback that is called when the user taps a segment; passes the segment's value as an argument + */ + onValueChange?: (value: string) => void; + + /** + * The index in props.values of the segment to be (pre)selected. + */ + selectedIndex?: number; + + /** + * Accent color of the control. + */ + tintColor?: string; + + /** + * The labels for the control's segment buttons, in order. + */ + values?: string[]; } /** @@ -2812,7 +2797,7 @@ export interface SegmentedControlIOSProps extends ViewProps { * such as rounded corners or camera notches (aka sensor housing area on iPhone X). */ declare class SafeAreaViewComponent extends React.Component {} -declare const SafeAreaViewBase: Constructor & typeof SafeAreaViewComponent +declare const SafeAreaViewBase: Constructor & typeof SafeAreaViewComponent; export class SafeAreaView extends SafeAreaViewBase {} /** @@ -2825,14 +2810,14 @@ export class SafeAreaView extends SafeAreaViewBase {} export class InputAccessoryView extends React.Component {} export interface InputAccessoryViewProps { - backgroundColor?: string + backgroundColor?: string; - /** - * An ID which is used to associate this InputAccessoryView to specified TextInput(s). - */ - nativeID?: string + /** + * An ID which is used to associate this InputAccessoryView to specified TextInput(s). + */ + nativeID?: string; - style?: StyleProp + style?: StyleProp; } /** @@ -2856,69 +2841,69 @@ export interface InputAccessoryViewProps { * ```` */ declare class SegmentedControlIOSComponent extends React.Component {} -declare const SegmentedControlIOSBase: Constructor & typeof SegmentedControlIOSComponent +declare const SegmentedControlIOSBase: Constructor & typeof SegmentedControlIOSComponent; export class SegmentedControlIOS extends SegmentedControlIOSBase {} export interface NavigatorIOSProps { - /** - * The default background color of the navigation bar. - */ - barTintColor?: string - - /** - * NavigatorIOS uses "route" objects to identify child views, their props, and navigation bar configuration. - * "push" and all the other navigation operations expect routes to be like this - */ - initialRoute: Route - - /** - * The default wrapper style for components in the navigator. - * A common use case is to set the backgroundColor for every page - */ - itemWrapperStyle?: StyleProp - - /** - * Boolean value that indicates whether the interactive pop gesture is - * enabled. This is useful for enabling/disabling the back swipe navigation - * gesture. - * - * If this prop is not provided, the default behavior is for the back swipe - * gesture to be enabled when the navigation bar is shown and disabled when - * the navigation bar is hidden. Once you've provided the - * `interactivePopGestureEnabled` prop, you can never restore the default - * behavior. - */ - interactivePopGestureEnabled?: boolean - - /** - * A Boolean value that indicates whether the navigation bar is hidden - */ - navigationBarHidden?: boolean - - /** - * A Boolean value that indicates whether to hide the 1px hairline shadow - */ - shadowHidden?: boolean - - /** - * The color used for buttons in the navigation bar - */ - tintColor?: string - - /** - * The text color of the navigation bar title - */ - titleTextColor?: string - - /** - * A Boolean value that indicates whether the navigation bar is translucent - */ - translucent?: boolean - - /** - * NOT IN THE DOC BUT IN THE EXAMPLES - */ - style?: StyleProp + /** + * The default background color of the navigation bar. + */ + barTintColor?: string; + + /** + * NavigatorIOS uses "route" objects to identify child views, their props, and navigation bar configuration. + * "push" and all the other navigation operations expect routes to be like this + */ + initialRoute: Route; + + /** + * The default wrapper style for components in the navigator. + * A common use case is to set the backgroundColor for every page + */ + itemWrapperStyle?: StyleProp; + + /** + * Boolean value that indicates whether the interactive pop gesture is + * enabled. This is useful for enabling/disabling the back swipe navigation + * gesture. + * + * If this prop is not provided, the default behavior is for the back swipe + * gesture to be enabled when the navigation bar is shown and disabled when + * the navigation bar is hidden. Once you've provided the + * `interactivePopGestureEnabled` prop, you can never restore the default + * behavior. + */ + interactivePopGestureEnabled?: boolean; + + /** + * A Boolean value that indicates whether the navigation bar is hidden + */ + navigationBarHidden?: boolean; + + /** + * A Boolean value that indicates whether to hide the 1px hairline shadow + */ + shadowHidden?: boolean; + + /** + * The color used for buttons in the navigation bar + */ + tintColor?: string; + + /** + * The text color of the navigation bar title + */ + titleTextColor?: string; + + /** + * A Boolean value that indicates whether the navigation bar is translucent + */ + translucent?: boolean; + + /** + * NOT IN THE DOC BUT IN THE EXAMPLES + */ + style?: StyleProp; } /** @@ -2930,119 +2915,119 @@ export interface NavigatorIOSProps { * @see https://facebook.github.io/react-native/docs/navigatorios.html#navigator */ export class NavigatorIOS extends React.Component { - /** - * Navigate forward to a new route - */ - push: (route: Route) => void - - /** - * Go back one page - */ - pop: () => void - - /** - * Go back N pages at once. When N=1, behavior matches pop() - */ - popN: (n: number) => void - - /** - * Replace the route for the current page and immediately load the view for the new route - */ - replace: (route: Route) => void - - /** - * Replace the route/view for the previous page - */ - replacePrevious: (route: Route) => void - - /** - * Replaces the previous route/view and transitions back to it - */ - replacePreviousAndPop: (route: Route) => void - - /** - * Replaces the top item and popToTop - */ - resetTo: (route: Route) => void - - /** - * Go back to the item for a particular route object - */ - popToRoute(route: Route): void - - /** - * Go back to the top item - */ - popToTop(): void + /** + * Navigate forward to a new route + */ + push: (route: Route) => void; + + /** + * Go back one page + */ + pop: () => void; + + /** + * Go back N pages at once. When N=1, behavior matches pop() + */ + popN: (n: number) => void; + + /** + * Replace the route for the current page and immediately load the view for the new route + */ + replace: (route: Route) => void; + + /** + * Replace the route/view for the previous page + */ + replacePrevious: (route: Route) => void; + + /** + * Replaces the previous route/view and transitions back to it + */ + replacePreviousAndPop: (route: Route) => void; + + /** + * Replaces the top item and popToTop + */ + resetTo: (route: Route) => void; + + /** + * Go back to the item for a particular route object + */ + popToRoute(route: Route): void; + + /** + * Go back to the top item + */ + popToTop(): void; } /** * @see https://facebook.github.io/react-native/docs/activityindicator.html#props */ export interface ActivityIndicatorProps extends ViewProps { - /** - * Whether to show the indicator (true, the default) or hide it (false). - */ - animating?: boolean + /** + * Whether to show the indicator (true, the default) or hide it (false). + */ + animating?: boolean; - /** - * The foreground color of the spinner (default is gray). - */ - color?: string + /** + * The foreground color of the spinner (default is gray). + */ + color?: string; - /** - * Whether the indicator should hide when not animating (true by default). - */ - hidesWhenStopped?: boolean + /** + * Whether the indicator should hide when not animating (true by default). + */ + hidesWhenStopped?: boolean; - /** - * Size of the indicator. - * Small has a height of 20, large has a height of 36. - * - * enum('small', 'large') - */ - size?: number | 'small' | 'large' + /** + * Size of the indicator. + * Small has a height of 20, large has a height of 36. + * + * enum('small', 'large') + */ + size?: number | "small" | "large"; - style?: StyleProp + style?: StyleProp; } declare class ActivityIndicatorComponent extends React.Component {} -declare const ActivityIndicatorBase: Constructor & typeof ActivityIndicatorComponent +declare const ActivityIndicatorBase: Constructor & typeof ActivityIndicatorComponent; export class ActivityIndicator extends ActivityIndicatorBase {} /** * @see https://facebook.github.io/react-native/docs/activityindicatorios.html#props */ export interface ActivityIndicatorIOSProps extends ViewProps { - /** - * Whether to show the indicator (true, the default) or hide it (false). - */ - animating?: boolean + /** + * Whether to show the indicator (true, the default) or hide it (false). + */ + animating?: boolean; - /** - * The foreground color of the spinner (default is gray). - */ - color?: string + /** + * The foreground color of the spinner (default is gray). + */ + color?: string; - /** - * Whether the indicator should hide when not animating (true by default). - */ - hidesWhenStopped?: boolean + /** + * Whether the indicator should hide when not animating (true by default). + */ + hidesWhenStopped?: boolean; - /** - * Invoked on mount and layout changes with - */ - onLayout?: (event: {nativeEvent: {layout: {x: number; y: number; width: number; height: number}}}) => void + /** + * Invoked on mount and layout changes with + */ + onLayout?: (event: { nativeEvent: { layout: { x: number; y: number; width: number; height: number } } }) => void; - /** - * Size of the indicator. - * Small has a height of 20, large has a height of 36. - * - * enum('small', 'large') - */ - size?: 'small' | 'large' + /** + * Size of the indicator. + * Small has a height of 20, large has a height of 36. + * + * enum('small', 'large') + */ + size?: "small" | "large"; - style?: StyleProp + style?: StyleProp; } /** @@ -3051,57 +3036,57 @@ export interface ActivityIndicatorIOSProps extends ViewProps { export class ActivityIndicatorIOS extends React.Component {} export interface DatePickerIOSProps extends ViewProps { - /** - * The currently selected date. - */ - date: Date - - /** - * The date picker locale. - */ - locale?: string - - /** - * Maximum date. - * Restricts the range of possible date/time values. - */ - maximumDate?: Date - - /** - * Maximum date. - * Restricts the range of possible date/time values. - */ - minimumDate?: Date - - /** - * enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30) - * The interval at which minutes can be selected. - */ - minuteInterval?: 1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30 - - /** - * enum('date', 'time', 'datetime') - * The date picker mode. - */ - mode?: 'date' | 'time' | 'datetime' - - /** - * Date change handler. - * This is called when the user changes the date or time in the UI. - * The first and only argument is a Date object representing the new date and time. - */ - onDateChange: (newDate: Date) => void - - /** - * Timezone offset in minutes. - * By default, the date picker will use the device's timezone. With this parameter, it is possible to force a certain timezone offset. - * For instance, to show times in Pacific Standard Time, pass -7 * 60. - */ - timeZoneOffsetInMinutes?: number + /** + * The currently selected date. + */ + date: Date; + + /** + * The date picker locale. + */ + locale?: string; + + /** + * Maximum date. + * Restricts the range of possible date/time values. + */ + maximumDate?: Date; + + /** + * Maximum date. + * Restricts the range of possible date/time values. + */ + minimumDate?: Date; + + /** + * enum(1, 2, 3, 4, 5, 6, 10, 12, 15, 20, 30) + * The interval at which minutes can be selected. + */ + minuteInterval?: 1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30; + + /** + * enum('date', 'time', 'datetime') + * The date picker mode. + */ + mode?: "date" | "time" | "datetime"; + + /** + * Date change handler. + * This is called when the user changes the date or time in the UI. + * The first and only argument is a Date object representing the new date and time. + */ + onDateChange: (newDate: Date) => void; + + /** + * Timezone offset in minutes. + * By default, the date picker will use the device's timezone. With this parameter, it is possible to force a certain timezone offset. + * For instance, to show times in Pacific Standard Time, pass -7 * 60. + */ + timeZoneOffsetInMinutes?: number; } declare class DatePickerIOSComponent extends React.Component {} -declare const DatePickerIOSBase: Constructor & typeof DatePickerIOSComponent +declare const DatePickerIOSBase: Constructor & typeof DatePickerIOSComponent; export class DatePickerIOS extends DatePickerIOSBase {} export interface DrawerSlideEvent extends NativeSyntheticEvent {} @@ -3110,127 +3095,127 @@ export interface DrawerSlideEvent extends NativeSyntheticEvent * @see DrawerLayoutAndroid.android.js */ export interface DrawerLayoutAndroidProps extends ViewProps { - /** - * Specifies the background color of the drawer. The default value - * is white. If you want to set the opacity of the drawer, use rgba. - * Example: - * return ( - * - * - *); - */ - drawerBackgroundColor?: string - - /** - * Specifies the lock mode of the drawer. The drawer can be locked - * in 3 states: - * - * - unlocked (default), meaning that the drawer will respond - * (open/close) to touch gestures. - * - * - locked-closed, meaning that the drawer will stay closed and not - * respond to gestures. - * - * - locked-open, meaning that the drawer will stay opened and - * not respond to gestures. The drawer may still be opened and - * closed programmatically (openDrawer/closeDrawer). - */ - drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open' - - /** - * Specifies the side of the screen from which the drawer will slide in. - * enum(DrawerLayoutAndroid.positions.Left, DrawerLayoutAndroid.positions.Right) - */ - drawerPosition?: number - - /** - * Specifies the width of the drawer, more precisely the width of the - * view that be pulled in from the edge of the window. - */ - drawerWidth?: number - - /** - * Determines whether the keyboard gets dismissed in response to a drag. - * - 'none' (the default), drags do not dismiss the keyboard. - * - 'on-drag', the keyboard is dismissed when a drag begins. - */ - keyboardDismissMode?: 'none' | 'on-drag' - - /** - * Function called whenever the navigation view has been closed. - */ - onDrawerClose?: () => void - - /** - * Function called whenever the navigation view has been opened. - */ - onDrawerOpen?: () => void - - /** - * Function called whenever there is an interaction with the navigation view. - */ - onDrawerSlide?: (event: DrawerSlideEvent) => void - - /** - * Function called when the drawer state has changed. - * The drawer can be in 3 states: - * - idle, meaning there is no interaction with the navigation - * view happening at the time - * - dragging, meaning there is currently an interaction with the - * navigation view - * - settling, meaning that there was an interaction with the - * navigation view, and the navigation view is now finishing - * it's closing or opening animation - */ - onDrawerStateChanged?: (event: 'Idle' | 'Dragging' | 'Settling') => void - - /** - * The navigation view that will be rendered to the side of the - * screen and can be pulled in. - */ - renderNavigationView: () => JSX.Element - - /** - * Make the drawer take the entire screen and draw the background of - * the status bar to allow it to open over the status bar. It will - * only have an effect on API 21+. - */ - statusBarBackgroundColor?: string -} + /** + * Specifies the background color of the drawer. The default value + * is white. If you want to set the opacity of the drawer, use rgba. + * Example: + * return ( + * + * + *); + */ + drawerBackgroundColor?: string; -interface DrawerPosition { - Left: number - Right: number -} + /** + * Specifies the lock mode of the drawer. The drawer can be locked + * in 3 states: + * + * - unlocked (default), meaning that the drawer will respond + * (open/close) to touch gestures. + * + * - locked-closed, meaning that the drawer will stay closed and not + * respond to gestures. + * + * - locked-open, meaning that the drawer will stay opened and + * not respond to gestures. The drawer may still be opened and + * closed programmatically (openDrawer/closeDrawer). + */ + drawerLockMode?: "unlocked" | "locked-closed" | "locked-open"; -declare class DrawerLayoutAndroidComponent extends React.Component {} -declare const DrawerLayoutAndroidBase: Constructor & typeof DrawerLayoutAndroidComponent -export class DrawerLayoutAndroid extends DrawerLayoutAndroidBase { - /** - * drawer's positions. - */ - positions: DrawerPosition + /** + * Specifies the side of the screen from which the drawer will slide in. + * enum(DrawerLayoutAndroid.positions.Left, DrawerLayoutAndroid.positions.Right) + */ + drawerPosition?: number; - /** - * Opens the drawer. - */ - openDrawer(): void + /** + * Specifies the width of the drawer, more precisely the width of the + * view that be pulled in from the edge of the window. + */ + drawerWidth?: number; - /** - * Closes the drawer. - */ - closeDrawer(): void -} + /** + * Determines whether the keyboard gets dismissed in response to a drag. + * - 'none' (the default), drags do not dismiss the keyboard. + * - 'on-drag', the keyboard is dismissed when a drag begins. + */ + keyboardDismissMode?: "none" | "on-drag"; -/** - * @see PickerIOS.ios.js - */ -export interface PickerIOSItemProps { - value?: string | number - label?: string -} + /** + * Function called whenever the navigation view has been closed. + */ + onDrawerClose?: () => void; -/** + /** + * Function called whenever the navigation view has been opened. + */ + onDrawerOpen?: () => void; + + /** + * Function called whenever there is an interaction with the navigation view. + */ + onDrawerSlide?: (event: DrawerSlideEvent) => void; + + /** + * Function called when the drawer state has changed. + * The drawer can be in 3 states: + * - idle, meaning there is no interaction with the navigation + * view happening at the time + * - dragging, meaning there is currently an interaction with the + * navigation view + * - settling, meaning that there was an interaction with the + * navigation view, and the navigation view is now finishing + * it's closing or opening animation + */ + onDrawerStateChanged?: (event: "Idle" | "Dragging" | "Settling") => void; + + /** + * The navigation view that will be rendered to the side of the + * screen and can be pulled in. + */ + renderNavigationView: () => JSX.Element; + + /** + * Make the drawer take the entire screen and draw the background of + * the status bar to allow it to open over the status bar. It will + * only have an effect on API 21+. + */ + statusBarBackgroundColor?: string; +} + +interface DrawerPosition { + Left: number; + Right: number; +} + +declare class DrawerLayoutAndroidComponent extends React.Component {} +declare const DrawerLayoutAndroidBase: Constructor & typeof DrawerLayoutAndroidComponent; +export class DrawerLayoutAndroid extends DrawerLayoutAndroidBase { + /** + * drawer's positions. + */ + positions: DrawerPosition; + + /** + * Opens the drawer. + */ + openDrawer(): void; + + /** + * Closes the drawer. + */ + closeDrawer(): void; +} + +/** + * @see PickerIOS.ios.js + */ +export interface PickerIOSItemProps { + value?: string | number; + label?: string; +} + +/** * @see PickerIOS.ios.js */ export class PickerIOSItem extends React.Component {} @@ -3239,45 +3224,45 @@ export class PickerIOSItem extends React.Component {} * @see Picker.js */ export interface PickerItemProps { - testID?: string - color?: string - label: string - value?: any + testID?: string; + color?: string; + label: string; + value?: any; } export class PickerItem extends React.Component {} export interface PickerPropsIOS extends ViewProps { - /** - * Style to apply to each of the item labels. - * @platform ios - */ - itemStyle?: StyleProp + /** + * Style to apply to each of the item labels. + * @platform ios + */ + itemStyle?: StyleProp; } export interface PickerPropsAndroid extends ViewProps { - /** - * If set to false, the picker will be disabled, i.e. the user will not be able to make a - * selection. - * @platform android - */ - enabled?: boolean - - /** - * On Android, specifies how to display the selection items when the user taps on the picker: - * - * - 'dialog': Show a modal dialog. This is the default. - * - 'dropdown': Shows a dropdown anchored to the picker view - * - * @platform android - */ - mode?: 'dialog' | 'dropdown' - - /** - * Prompt string for this picker, used on Android in dialog mode as the title of the dialog. - * @platform android - */ - prompt?: string + /** + * If set to false, the picker will be disabled, i.e. the user will not be able to make a + * selection. + * @platform android + */ + enabled?: boolean; + + /** + * On Android, specifies how to display the selection items when the user taps on the picker: + * + * - 'dialog': Show a modal dialog. This is the default. + * - 'dropdown': Shows a dropdown anchored to the picker view + * + * @platform android + */ + mode?: "dialog" | "dropdown"; + + /** + * Prompt string for this picker, used on Android in dialog mode as the title of the dialog. + * @platform android + */ + prompt?: string; } /** @@ -3285,26 +3270,26 @@ export interface PickerPropsAndroid extends ViewProps { * @see Picker.js */ export interface PickerProps extends PickerPropsIOS, PickerPropsAndroid { - /** - * Callback for when an item is selected. This is called with the - * following parameters: - * - itemValue: the value prop of the item that was selected - * - itemPosition: the index of the selected item in this picker - */ - onValueChange?: (itemValue: any, itemPosition: number) => void + /** + * Callback for when an item is selected. This is called with the + * following parameters: + * - itemValue: the value prop of the item that was selected + * - itemPosition: the index of the selected item in this picker + */ + onValueChange?: (itemValue: any, itemPosition: number) => void; - /** - * Value matching value of one of the items. - * Can be a string or an integer. - */ - selectedValue?: any + /** + * Value matching value of one of the items. + * Can be a string or an integer. + */ + selectedValue?: any; - style?: StyleProp + style?: StyleProp; - /** - * Used to locate this view in end-to-end tests. - */ - testId?: string + /** + * Used to locate this view in end-to-end tests. + */ + testId?: string; } /** @@ -3312,17 +3297,17 @@ export interface PickerProps extends PickerPropsIOS, PickerPropsAndroid { * @see Picker.js */ export class Picker extends React.Component { - /** - * On Android, display the options in a dialog. - */ - static MODE_DIALOG: string + /** + * On Android, display the options in a dialog. + */ + static MODE_DIALOG: string; - /** - * On Android, display the options in a dropdown (this is the default). - */ - static MODE_DROPDOWN: string + /** + * On Android, display the options in a dropdown (this is the default). + */ + static MODE_DROPDOWN: string; - static Item: typeof PickerItem + static Item: typeof PickerItem; } /** @@ -3330,9 +3315,9 @@ export class Picker extends React.Component { * @see PickerIOS.ios.js */ export interface PickerIOSProps extends ViewProps { - itemStyle?: StyleProp - onValueChange?: (value: string | number) => void - selectedValue?: string | number + itemStyle?: StyleProp; + onValueChange?: (value: string | number) => void; + selectedValue?: string | number; } /** @@ -3340,9 +3325,9 @@ export interface PickerIOSProps extends ViewProps { * @see PickerIOS.ios.js */ declare class PickerIOSComponent extends React.Component {} -declare const PickerIOSBase: Constructor & typeof PickerIOSComponent +declare const PickerIOSBase: Constructor & typeof PickerIOSComponent; export class PickerIOS extends PickerIOSBase { - static Item: typeof PickerIOSItem + static Item: typeof PickerIOSItem; } /** @@ -3350,7 +3335,7 @@ export class PickerIOS extends PickerIOSBase { * @see ProgressBarAndroid.android.js */ export interface ProgressBarAndroidProps extends ViewProps { - /** + /** * Style of the ProgressBar. One of: Horizontal Normal (default) @@ -3360,40 +3345,40 @@ export interface ProgressBarAndroidProps extends ViewProps { SmallInverse LargeInverse */ - styleAttr?: 'Horizontal' | 'Normal' | 'Small' | 'Large' | 'Inverse' | 'SmallInverse' | 'LargeInverse' + styleAttr?: "Horizontal" | "Normal" | "Small" | "Large" | "Inverse" | "SmallInverse" | "LargeInverse"; - /** - * If the progress bar will show indeterminate progress. - * Note that this can only be false if styleAttr is Horizontal. - */ - indeterminate?: boolean + /** + * If the progress bar will show indeterminate progress. + * Note that this can only be false if styleAttr is Horizontal. + */ + indeterminate?: boolean; - /** - * The progress value (between 0 and 1). - */ - progress?: number + /** + * The progress value (between 0 and 1). + */ + progress?: number; - /** - * Whether to show the ProgressBar (true, the default) or hide it (false). - */ - animating?: boolean + /** + * Whether to show the ProgressBar (true, the default) or hide it (false). + */ + animating?: boolean; - /** - * Color of the progress bar. - */ - color?: string + /** + * Color of the progress bar. + */ + color?: string; - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; } /** * React component that wraps the Android-only `ProgressBar`. This component is used to indicate * that the app is loading or there is some activity in the app. */ declare class ProgressBarAndroidComponent extends React.Component {} -declare const ProgressBarAndroidBase: Constructor & typeof ProgressBarAndroidComponent +declare const ProgressBarAndroidBase: Constructor & typeof ProgressBarAndroidComponent; export class ProgressBarAndroid extends ProgressBarAndroidBase {} /** @@ -3401,95 +3386,95 @@ export class ProgressBarAndroid extends ProgressBarAndroidBase {} * @see ProgressViewIOS.ios.js */ export interface ProgressViewIOSProps extends ViewProps { - /** - * The progress bar style. - */ - progressViewStyle?: 'default' | 'bar' - - /** - * The progress value (between 0 and 1). - */ - progress?: number - - /** - * The tint color of the progress bar itself. - */ - progressTintColor?: string - - /** - * The tint color of the progress bar track. - */ - trackTintColor?: string - - /** - * A stretchable image to display as the progress bar. - */ - progressImage?: ImageURISource | ImageURISource[] - - /** - * A stretchable image to display behind the progress bar. - */ - trackImage?: ImageURISource | ImageURISource[] + /** + * The progress bar style. + */ + progressViewStyle?: "default" | "bar"; + + /** + * The progress value (between 0 and 1). + */ + progress?: number; + + /** + * The tint color of the progress bar itself. + */ + progressTintColor?: string; + + /** + * The tint color of the progress bar track. + */ + trackTintColor?: string; + + /** + * A stretchable image to display as the progress bar. + */ + progressImage?: ImageURISource | ImageURISource[]; + + /** + * A stretchable image to display behind the progress bar. + */ + trackImage?: ImageURISource | ImageURISource[]; } declare class ProgressViewIOSComponent extends React.Component {} -declare const ProgressViewIOSBase: Constructor & typeof ProgressViewIOSComponent +declare const ProgressViewIOSBase: Constructor & typeof ProgressViewIOSComponent; export class ProgressViewIOS extends ProgressViewIOSBase {} export interface RefreshControlPropsIOS extends ViewProps { - /** - * The color of the refresh indicator. - */ - tintColor?: string + /** + * The color of the refresh indicator. + */ + tintColor?: string; - /** - * The title displayed under the refresh indicator. - */ - title?: string + /** + * The title displayed under the refresh indicator. + */ + title?: string; - /** - * Title color. - */ - titleColor?: string + /** + * Title color. + */ + titleColor?: string; } export interface RefreshControlPropsAndroid extends ViewProps { - /** - * The colors (at least one) that will be used to draw the refresh indicator. - */ - colors?: string[] + /** + * The colors (at least one) that will be used to draw the refresh indicator. + */ + colors?: string[]; - /** - * Whether the pull to refresh functionality is enabled. - */ - enabled?: boolean + /** + * Whether the pull to refresh functionality is enabled. + */ + enabled?: boolean; - /** - * The background color of the refresh indicator. - */ - progressBackgroundColor?: string + /** + * The background color of the refresh indicator. + */ + progressBackgroundColor?: string; - /** - * Size of the refresh indicator, see RefreshControl.SIZE. - */ - size?: number + /** + * Size of the refresh indicator, see RefreshControl.SIZE. + */ + size?: number; - /** - * Progress view top offset - * @platform android - */ - progressViewOffset?: number + /** + * Progress view top offset + * @platform android + */ + progressViewOffset?: number; } export interface RefreshControlProps extends RefreshControlPropsIOS, RefreshControlPropsAndroid { - /** - * Called when the view starts refreshing. - */ - onRefresh?: () => void + /** + * Called when the view starts refreshing. + */ + onRefresh?: () => void; - /** - * Whether the view should be indicating an active refresh. - */ - refreshing: boolean + /** + * Whether the view should be indicating an active refresh. + */ + refreshing: boolean; } /** @@ -3501,9 +3486,9 @@ export interface RefreshControlProps extends RefreshControlPropsIOS, RefreshCont * in the `onRefresh` function otherwise the refresh indicator will stop immediately. */ declare class RefreshControlComponent extends React.Component {} -declare const RefreshControlBase: Constructor & typeof RefreshControlComponent +declare const RefreshControlBase: Constructor & typeof RefreshControlComponent; export class RefreshControl extends RefreshControlBase { - static SIZE: Object // Undocumented + static SIZE: Object; // Undocumented } export interface RecyclerViewBackedScrollViewProps extends ScrollViewProps {} @@ -3522,172 +3507,170 @@ export interface RecyclerViewBackedScrollViewProps extends ScrollViewProps {} * use it pass this component as `renderScrollComponent` to the list view. For * now only horizontal scrolling is supported. */ -declare class RecyclerViewBackedScrollViewComponent extends React.Component< - RecyclerViewBackedScrollViewProps -> {} +declare class RecyclerViewBackedScrollViewComponent extends React.Component {} declare const RecyclerViewBackedScrollViewBase: Constructor & - typeof RecyclerViewBackedScrollViewComponent + typeof RecyclerViewBackedScrollViewComponent; export class RecyclerViewBackedScrollView extends RecyclerViewBackedScrollViewBase { - /** - * A helper function to scroll to a specific point in the scrollview. - * This is currently used to help focus on child textviews, but can also - * be used to quickly scroll to any element we want to focus. Syntax: - * - * scrollResponderScrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) - * - * Note: The weird argument signature is due to the fact that, for historical reasons, - * the function also accepts separate arguments as as alternative to the options object. - * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. - */ - scrollTo(y?: number | {x?: number; y?: number; animated?: boolean}, x?: number, animated?: boolean): void - - /** - * Returns a reference to the underlying scroll responder, which supports - * operations like `scrollTo`. All ScrollView-like components should - * implement this method so that they can be composed while providing access - * to the underlying scroll responder's methods. - */ - getScrollResponder(): JSX.Element + /** + * A helper function to scroll to a specific point in the scrollview. + * This is currently used to help focus on child textviews, but can also + * be used to quickly scroll to any element we want to focus. Syntax: + * + * scrollResponderScrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) + * + * Note: The weird argument signature is due to the fact that, for historical reasons, + * the function also accepts separate arguments as as alternative to the options object. + * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. + */ + scrollTo(y?: number | { x?: number; y?: number; animated?: boolean }, x?: number, animated?: boolean): void; + + /** + * Returns a reference to the underlying scroll responder, which supports + * operations like `scrollTo`. All ScrollView-like components should + * implement this method so that they can be composed while providing access + * to the underlying scroll responder's methods. + */ + getScrollResponder(): JSX.Element; } export interface SliderPropsAndroid extends ViewProps { - /** - * Color of the foreground switch grip. - */ - thumbTintColor?: string + /** + * Color of the foreground switch grip. + */ + thumbTintColor?: string; } export interface SliderPropsIOS extends ViewProps { - /** - * Assigns a maximum track image. Only static images are supported. - * The leftmost pixel of the image will be stretched to fill the track. - */ - maximumTrackImage?: ImageURISource - - /** - * Assigns a minimum track image. Only static images are supported. - * The rightmost pixel of the image will be stretched to fill the track. - */ - minimumTrackImage?: ImageURISource - - /** - * Sets an image for the thumb. Only static images are supported. - */ - thumbImage?: ImageURISource - - /** - * Assigns a single image for the track. Only static images - * are supported. The center pixel of the image will be stretched - * to fill the track. - */ - trackImage?: ImageURISource + /** + * Assigns a maximum track image. Only static images are supported. + * The leftmost pixel of the image will be stretched to fill the track. + */ + maximumTrackImage?: ImageURISource; + + /** + * Assigns a minimum track image. Only static images are supported. + * The rightmost pixel of the image will be stretched to fill the track. + */ + minimumTrackImage?: ImageURISource; + + /** + * Sets an image for the thumb. Only static images are supported. + */ + thumbImage?: ImageURISource; + + /** + * Assigns a single image for the track. Only static images + * are supported. The center pixel of the image will be stretched + * to fill the track. + */ + trackImage?: ImageURISource; } export interface SliderProps extends SliderPropsIOS, SliderPropsAndroid { - /** - * If true the user won't be able to move the slider. - * Default value is false. - */ - disabled?: boolean - - /** - * The color used for the track to the right of the button. - * Overrides the default blue gradient image. - */ - maximumTrackTintColor?: string - - /** - * Initial maximum value of the slider. Default value is 1. - */ - maximumValue?: number - - /** - * The color used for the track to the left of the button. - * Overrides the default blue gradient image. - */ - minimumTrackTintColor?: string - - /** - * Initial minimum value of the slider. Default value is 0. - */ - minimumValue?: number - - /** - * Callback called when the user finishes changing the value (e.g. when the slider is released). - */ - onSlidingComplete?: (value: number) => void - - /** - * Callback continuously called while the user is dragging the slider. - */ - onValueChange?: (value: number) => void - - /** - * Step value of the slider. The value should be between 0 and (maximumValue - minimumValue). Default value is 0. - */ - step?: number - - /** - * Used to style and layout the Slider. See StyleSheet.js and ViewStylePropTypes.js for more info. - */ - style?: StyleProp - - /** - * Used to locate this view in UI automation tests. - */ - testID?: string - - /** - * Initial value of the slider. The value should be between minimumValue - * and maximumValue, which default to 0 and 1 respectively. - * Default value is 0. - * This is not a controlled component, you don't need to update - * the value during dragging. - */ - value?: number + /** + * If true the user won't be able to move the slider. + * Default value is false. + */ + disabled?: boolean; + + /** + * The color used for the track to the right of the button. + * Overrides the default blue gradient image. + */ + maximumTrackTintColor?: string; + + /** + * Initial maximum value of the slider. Default value is 1. + */ + maximumValue?: number; + + /** + * The color used for the track to the left of the button. + * Overrides the default blue gradient image. + */ + minimumTrackTintColor?: string; + + /** + * Initial minimum value of the slider. Default value is 0. + */ + minimumValue?: number; + + /** + * Callback called when the user finishes changing the value (e.g. when the slider is released). + */ + onSlidingComplete?: (value: number) => void; + + /** + * Callback continuously called while the user is dragging the slider. + */ + onValueChange?: (value: number) => void; + + /** + * Step value of the slider. The value should be between 0 and (maximumValue - minimumValue). Default value is 0. + */ + step?: number; + + /** + * Used to style and layout the Slider. See StyleSheet.js and ViewStylePropTypes.js for more info. + */ + style?: StyleProp; + + /** + * Used to locate this view in UI automation tests. + */ + testID?: string; + + /** + * Initial value of the slider. The value should be between minimumValue + * and maximumValue, which default to 0 and 1 respectively. + * Default value is 0. + * This is not a controlled component, you don't need to update + * the value during dragging. + */ + value?: number; } /** * A component used to select a single value from a range of values. */ declare class SliderComponent extends React.Component {} -declare const SliderBase: Constructor & typeof SliderComponent +declare const SliderBase: Constructor & typeof SliderComponent; export class Slider extends SliderBase {} -export type SliderIOS = Slider +export type SliderIOS = Slider; /** * https://facebook.github.io/react-native/docs/switchios.html#props */ export interface SwitchIOSProps extends ViewProps { - /** - * If true the user won't be able to toggle the switch. Default value is false. - */ - disabled?: boolean + /** + * If true the user won't be able to toggle the switch. Default value is false. + */ + disabled?: boolean; - /** - * Background color when the switch is turned on. - */ - onTintColor?: string + /** + * Background color when the switch is turned on. + */ + onTintColor?: string; - /** - * Callback that is called when the user toggles the switch. - */ - onValueChange?: (value: boolean) => void + /** + * Callback that is called when the user toggles the switch. + */ + onValueChange?: (value: boolean) => void; - /** - * Background color for the switch round button. - */ - thumbTintColor?: string + /** + * Background color for the switch round button. + */ + thumbTintColor?: string; - /** - * Background color when the switch is turned off. - */ - tintColor?: string + /** + * Background color when the switch is turned off. + */ + tintColor?: string; - /** - * The value of the switch, if true the switch will be turned on. Default value is false. - */ - value?: boolean + /** + * The value of the switch, if true the switch will be turned on. Default value is false. + */ + value?: boolean; } /** @@ -3701,47 +3684,47 @@ export interface SwitchIOSProps extends ViewProps { */ export class SwitchIOS extends React.Component {} -export type ImageResizeMode = 'cover' | 'contain' | 'stretch' | 'repeat' | 'center' +export type ImageResizeMode = "cover" | "contain" | "stretch" | "repeat" | "center"; /** * @see ImageResizeMode.js */ export interface ImageResizeModeStatic { - /** - * contain - The image will be resized such that it will be completely - * visible, contained within the frame of the View. - */ - contain: ImageResizeMode - /** - * cover - The image will be resized such that the entire area of the view - * is covered by the image, potentially clipping parts of the image. - */ - cover: ImageResizeMode - /** - * stretch - The image will be stretched to fill the entire frame of the - * view without clipping. This may change the aspect ratio of the image, - * distoring it. Only supported on iOS. - */ - stretch: ImageResizeMode - /** - * center - The image will be scaled down such that it is completely visible, - * if bigger than the area of the view. - * The image will not be scaled up. - */ - center: ImageResizeMode - - /** - * repeat - The image will be repeated to cover the frame of the View. The - * image will keep it's size and aspect ratio. - */ - repeat: ImageResizeMode + /** + * contain - The image will be resized such that it will be completely + * visible, contained within the frame of the View. + */ + contain: ImageResizeMode; + /** + * cover - The image will be resized such that the entire area of the view + * is covered by the image, potentially clipping parts of the image. + */ + cover: ImageResizeMode; + /** + * stretch - The image will be stretched to fill the entire frame of the + * view without clipping. This may change the aspect ratio of the image, + * distoring it. Only supported on iOS. + */ + stretch: ImageResizeMode; + /** + * center - The image will be scaled down such that it is completely visible, + * if bigger than the area of the view. + * The image will not be scaled up. + */ + center: ImageResizeMode; + + /** + * repeat - The image will be repeated to cover the frame of the View. The + * image will keep it's size and aspect ratio. + */ + repeat: ImageResizeMode; } export interface ShadowStyleIOS { - shadowColor?: string - shadowOffset?: {width: number; height: number} - shadowOpacity?: number - shadowRadius?: number + shadowColor?: string; + shadowOffset?: { width: number; height: number }; + shadowOpacity?: number; + shadowRadius?: number; } /** @@ -3750,3001 +3733,2998 @@ export interface ShadowStyleIOS { * @see https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageStylePropTypes.js */ export interface ImageStyle extends FlexStyle, ShadowStyleIOS, TransformsStyle { - resizeMode?: ImageResizeMode - backfaceVisibility?: 'visible' | 'hidden' - borderBottomLeftRadius?: number - borderBottomRightRadius?: number - backgroundColor?: string - borderColor?: string - borderWidth?: number - borderRadius?: number - borderTopLeftRadius?: number - borderTopRightRadius?: number - overflow?: 'visible' | 'hidden' - overlayColor?: string - tintColor?: string - opacity?: number + resizeMode?: ImageResizeMode; + backfaceVisibility?: "visible" | "hidden"; + borderBottomLeftRadius?: number; + borderBottomRightRadius?: number; + backgroundColor?: string; + borderColor?: string; + borderWidth?: number; + borderRadius?: number; + borderTopLeftRadius?: number; + borderTopRightRadius?: number; + overflow?: "visible" | "hidden"; + overlayColor?: string; + tintColor?: string; + opacity?: number; } /* * @see https://github.com/facebook/react-native/blob/master/Libraries/Image/ImageSourcePropType.js */ export interface ImageURISource { - /** - * `uri` is a string representing the resource identifier for the image, which - * could be an http address, a local file path, or the name of a static image - * resource (which should be wrapped in the `require('./path/to/image.png')` - * function). - */ - uri?: string - /** - * `bundle` is the iOS asset bundle which the image is included in. This - * will default to [NSBundle mainBundle] if not set. - * @platform ios - */ - bundle?: string - /** - * `method` is the HTTP Method to use. Defaults to GET if not specified. - */ - method?: string - /** - * `headers` is an object representing the HTTP headers to send along with the - * request for a remote image. - */ - headers?: {[key: string]: string} - /** - * `cache` determines how the requests handles potentially cached - * responses. - * - * - `default`: Use the native platforms default strategy. `useProtocolCachePolicy` on iOS. - * - * - `reload`: The data for the URL will be loaded from the originating source. - * No existing cache data should be used to satisfy a URL load request. - * - * - `force-cache`: The existing cached data will be used to satisfy the request, - * regardless of its age or expiration date. If there is no existing data in the cache - * corresponding the request, the data is loaded from the originating source. - * - * - `only-if-cached`: The existing cache data will be used to satisfy a request, regardless of - * its age or expiration date. If there is no existing data in the cache corresponding - * to a URL load request, no attempt is made to load the data from the originating source, - * and the load is considered to have failed. - * - * @platform ios - */ - cache?: 'default' | 'reload' | 'force-cache' | 'only-if-cached' - /** - * `body` is the HTTP body to send with the request. This must be a valid - * UTF-8 string, and will be sent exactly as specified, with no - * additional encoding (e.g. URL-escaping or base64) applied. - */ - body?: string - /** - * `width` and `height` can be specified if known at build time, in which case - * these will be used to set the default `` component dimensions. - */ - width?: number - height?: number - /** - * `scale` is used to indicate the scale factor of the image. Defaults to 1.0 if - * unspecified, meaning that one image pixel equates to one display point / DIP. - */ - scale?: number -} - -export type ImageRequireSource = number + /** + * `uri` is a string representing the resource identifier for the image, which + * could be an http address, a local file path, or the name of a static image + * resource (which should be wrapped in the `require('./path/to/image.png')` + * function). + */ + uri?: string; + /** + * `bundle` is the iOS asset bundle which the image is included in. This + * will default to [NSBundle mainBundle] if not set. + * @platform ios + */ + bundle?: string; + /** + * `method` is the HTTP Method to use. Defaults to GET if not specified. + */ + method?: string; + /** + * `headers` is an object representing the HTTP headers to send along with the + * request for a remote image. + */ + headers?: { [key: string]: string }; + /** + * `cache` determines how the requests handles potentially cached + * responses. + * + * - `default`: Use the native platforms default strategy. `useProtocolCachePolicy` on iOS. + * + * - `reload`: The data for the URL will be loaded from the originating source. + * No existing cache data should be used to satisfy a URL load request. + * + * - `force-cache`: The existing cached data will be used to satisfy the request, + * regardless of its age or expiration date. If there is no existing data in the cache + * corresponding the request, the data is loaded from the originating source. + * + * - `only-if-cached`: The existing cache data will be used to satisfy a request, regardless of + * its age or expiration date. If there is no existing data in the cache corresponding + * to a URL load request, no attempt is made to load the data from the originating source, + * and the load is considered to have failed. + * + * @platform ios + */ + cache?: "default" | "reload" | "force-cache" | "only-if-cached"; + /** + * `body` is the HTTP body to send with the request. This must be a valid + * UTF-8 string, and will be sent exactly as specified, with no + * additional encoding (e.g. URL-escaping or base64) applied. + */ + body?: string; + /** + * `width` and `height` can be specified if known at build time, in which case + * these will be used to set the default `` component dimensions. + */ + width?: number; + height?: number; + /** + * `scale` is used to indicate the scale factor of the image. Defaults to 1.0 if + * unspecified, meaning that one image pixel equates to one display point / DIP. + */ + scale?: number; +} + +export type ImageRequireSource = number; /** * @see ImagePropsIOS.onProgress */ export interface ImageProgressEventDataIOS { - loaded: number - total: number + loaded: number; + total: number; } export interface ImagePropsIOS { - /** - * blurRadius: the blur radius of the blur filter added to the image - * @platform ios - */ - blurRadius?: number - - /** - * When the image is resized, the corners of the size specified by capInsets will stay a fixed size, - * but the center content and borders of the image will be stretched. - * This is useful for creating resizable rounded buttons, shadows, and other resizable assets. - * More info on Apple documentation - */ - capInsets?: Insets - - /** - * Invoked on download progress with {nativeEvent: {loaded, total}} - */ - onProgress?: (event: NativeSyntheticEvent) => void - - /** - * Invoked when a partial load of the image is complete. The definition of - * what constitutes a "partial load" is loader specific though this is meant - * for progressive JPEG loads. - * @platform ios - */ - onPartialLoad?: () => void + /** + * blurRadius: the blur radius of the blur filter added to the image + * @platform ios + */ + blurRadius?: number; + + /** + * When the image is resized, the corners of the size specified by capInsets will stay a fixed size, + * but the center content and borders of the image will be stretched. + * This is useful for creating resizable rounded buttons, shadows, and other resizable assets. + * More info on Apple documentation + */ + capInsets?: Insets; + + /** + * Invoked on download progress with {nativeEvent: {loaded, total}} + */ + onProgress?: (event: NativeSyntheticEvent) => void; + + /** + * Invoked when a partial load of the image is complete. The definition of + * what constitutes a "partial load" is loader specific though this is meant + * for progressive JPEG loads. + * @platform ios + */ + onPartialLoad?: () => void; } interface ImagePropsAndroid { - /** - * The mechanism that should be used to resize the image when the image's dimensions - * differ from the image view's dimensions. Defaults to auto. - * - * 'auto': Use heuristics to pick between resize and scale. - * - * 'resize': A software operation which changes the encoded image in memory before it gets decoded. - * This should be used instead of scale when the image is much larger than the view. - * - * 'scale': The image gets drawn downscaled or upscaled. Compared to resize, scale is faster (usually hardware accelerated) - * and produces higher quality images. This should be used if the image is smaller than the view. - * It should also be used if the image is slightly bigger than the view. - */ - resizeMethod?: 'auto' | 'resize' | 'scale' - - /** - * Duration of fade in animation. - */ - fadeDuration?: number - - /** - * Required if loading images via 'uri' from drawable folder on Android. - * Explanation: https://medium.com/@adamjacobb/react-native-performance-images-adf5843e120 - */ - width?: number - - /** - * Required if loading images via 'uri' from drawable folder on Android - * Explanation: https://medium.com/@adamjacobb/react-native-performance-images-adf5843e120 - */ - height?: number + /** + * The mechanism that should be used to resize the image when the image's dimensions + * differ from the image view's dimensions. Defaults to auto. + * + * 'auto': Use heuristics to pick between resize and scale. + * + * 'resize': A software operation which changes the encoded image in memory before it gets decoded. + * This should be used instead of scale when the image is much larger than the view. + * + * 'scale': The image gets drawn downscaled or upscaled. Compared to resize, scale is faster (usually hardware accelerated) + * and produces higher quality images. This should be used if the image is smaller than the view. + * It should also be used if the image is slightly bigger than the view. + */ + resizeMethod?: "auto" | "resize" | "scale"; + + /** + * Duration of fade in animation in ms. Defaults to 300 + * + * @platform android + */ + fadeDuration?: number; + + /** + * Required if loading images via 'uri' from drawable folder on Android. + * Explanation: https://medium.com/@adamjacobb/react-native-performance-images-adf5843e120 + */ + width?: number; + + /** + * Required if loading images via 'uri' from drawable folder on Android + * Explanation: https://medium.com/@adamjacobb/react-native-performance-images-adf5843e120 + */ + height?: number; } /** * @see https://facebook.github.io/react-native/docs/image.html#source */ -export type ImageSourcePropType = ImageURISource | ImageURISource[] | ImageRequireSource +export type ImageSourcePropType = ImageURISource | ImageURISource[] | ImageRequireSource; /** * @see ImagePropsBase.onLoad */ export interface ImageLoadEventDataAndroid { - uri?: string + uri?: string; } export interface ImageLoadEventData extends ImageLoadEventDataAndroid { - source: { - height: number - width: number - url: string - } + source: { + height: number; + width: number; + url: string; + }; } export interface ImageErrorEventData { - error: any + error: any; } /** * @see https://facebook.github.io/react-native/docs/image.html#resolveassetsource */ export interface ImageResolvedAssetSource { - height: number - width: number - scale: number - uri: string + height: number; + width: number; + scale: number; + uri: string; } /** * @see https://facebook.github.io/react-native/docs/image.html */ export interface ImagePropsBase extends ImagePropsIOS, ImagePropsAndroid, AccessibilityProps { - /** - * onLayout function - * - * Invoked on mount and layout changes with - * - * {nativeEvent: { layout: {x, y, width, height} }}. - */ - onLayout?: (event: LayoutChangeEvent) => void - - /** - * Invoked on load error with {nativeEvent: {error}} - */ - onError?: (error: NativeSyntheticEvent) => void - - /** - * Invoked when load completes successfully - * { source: { url, height, width } }. - */ - onLoad?: (event: NativeSyntheticEvent) => void - - /** - * Invoked when load either succeeds or fails - */ - onLoadEnd?: () => void - - /** - * Invoked on load start - */ - onLoadStart?: () => void - - progressiveRenderingEnabled?: boolean - - borderRadius?: number - - borderTopLeftRadius?: number - - borderTopRightRadius?: number - - borderBottomLeftRadius?: number - - borderBottomRightRadius?: number - - /** - * Determines how to resize the image when the frame doesn't match the raw - * image dimensions. - * - * 'cover': Scale the image uniformly (maintain the image's aspect ratio) - * so that both dimensions (width and height) of the image will be equal - * to or larger than the corresponding dimension of the view (minus padding). - * - * 'contain': Scale the image uniformly (maintain the image's aspect ratio) - * so that both dimensions (width and height) of the image will be equal to - * or less than the corresponding dimension of the view (minus padding). - * - * 'stretch': Scale width and height independently, This may change the - * aspect ratio of the src. - * - * 'repeat': Repeat the image to cover the frame of the view. - * The image will keep it's size and aspect ratio. (iOS only) - * - * 'center': Scale the image down so that it is completely visible, - * if bigger than the area of the view. - * The image will not be scaled up. - */ - resizeMode?: ImageResizeMode - - /** - * The mechanism that should be used to resize the image when the image's dimensions - * differ from the image view's dimensions. Defaults to `auto`. - * - * - `auto`: Use heuristics to pick between `resize` and `scale`. - * - * - `resize`: A software operation which changes the encoded image in memory before it - * gets decoded. This should be used instead of `scale` when the image is much larger - * than the view. - * - * - `scale`: The image gets drawn downscaled or upscaled. Compared to `resize`, `scale` is - * faster (usually hardware accelerated) and produces higher quality images. This - * should be used if the image is smaller than the view. It should also be used if the - * image is slightly bigger than the view. - * - * More details about `resize` and `scale` can be found at http://frescolib.org/docs/resizing-rotating.html. - * - * @platform android - */ - resizeMethod?: 'auto' | 'resize' | 'scale' - - /** - * The image source (either a remote URL or a local file resource). - * - * This prop can also contain several remote URLs, specified together with their width and height and potentially with scale/other URI arguments. - * The native side will then choose the best uri to display based on the measured size of the image container. - * A cache property can be added to control how networked request interacts with the local cache. - * - * The currently supported formats are png, jpg, jpeg, bmp, gif, webp (Android only), psd (iOS only). - */ - source: ImageSourcePropType - - /** - * similarly to `source`, this property represents the resource used to render - * the loading indicator for the image, displayed until image is ready to be - * displayed, typically after when it got downloaded from network. - */ - loadingIndicatorSource?: ImageURISource - - /** - * A unique identifier for this element to be used in UI Automation testing scripts. - */ - testID?: string - - /** - * A static image to display while downloading the final image off the network. - */ - defaultSource?: ImageURISource | number -} + /** + * onLayout function + * + * Invoked on mount and layout changes with + * + * {nativeEvent: { layout: {x, y, width, height} }}. + */ + onLayout?: (event: LayoutChangeEvent) => void; -export interface ImageProps extends ImagePropsBase { - /** - * - * Style - */ - style?: StyleProp -} + /** + * Invoked on load error with {nativeEvent: {error}} + */ + onError?: (error: NativeSyntheticEvent) => void; -declare class ImageComponent extends React.Component {} -declare const ImageBase: Constructor & typeof ImageComponent -export class Image extends ImageBase { - static getSize( - uri: string, - success: (width: number, height: number) => void, - failure: (error: any) => void - ): any - static prefetch(url: string): any - static abortPrefetch?(requestId: number): void - static queryCache?(urls: string[]): Promise<{[url: string]: 'memory' | 'disk' | 'disk/memory'}> + /** + * Invoked when load completes successfully + * { source: { url, height, width } }. + */ + onLoad?: (event: NativeSyntheticEvent) => void; - /** - * @see https://facebook.github.io/react-native/docs/image.html#resolveassetsource - */ - static resolveAssetSource(source: ImageSourcePropType): ImageResolvedAssetSource -} + /** + * Invoked when load either succeeds or fails + */ + onLoadEnd?: () => void; -export interface ImageBackgroundProps extends ImagePropsBase { - imageStyle?: StyleProp - style?: StyleProp - imageRef?(image: Image): void -} + /** + * Invoked on load start + */ + onLoadStart?: () => void; -declare class ImageBackgroundComponent extends React.Component {} -declare const ImageBackgroundBase: Constructor & typeof ImageBackgroundComponent -export class ImageBackground extends ImageBackgroundBase { - resizeMode: ImageResizeMode - getSize(uri: string, success: (width: number, height: number) => void, failure: (error: any) => void): any - prefetch(url: string): any - abortPrefetch?(requestId: number): void - queryCache?(urls: string[]): Promise<{[url: string]: 'memory' | 'disk' | 'disk/memory'}> -} + progressiveRenderingEnabled?: boolean; -export interface ViewToken { - item: any - key: string - index: number | null - isViewable: boolean - section?: any + borderRadius?: number; + + borderTopLeftRadius?: number; + + borderTopRightRadius?: number; + + borderBottomLeftRadius?: number; + + borderBottomRightRadius?: number; + + /** + * Determines how to resize the image when the frame doesn't match the raw + * image dimensions. + * + * 'cover': Scale the image uniformly (maintain the image's aspect ratio) + * so that both dimensions (width and height) of the image will be equal + * to or larger than the corresponding dimension of the view (minus padding). + * + * 'contain': Scale the image uniformly (maintain the image's aspect ratio) + * so that both dimensions (width and height) of the image will be equal to + * or less than the corresponding dimension of the view (minus padding). + * + * 'stretch': Scale width and height independently, This may change the + * aspect ratio of the src. + * + * 'repeat': Repeat the image to cover the frame of the view. + * The image will keep it's size and aspect ratio. (iOS only) + * + * 'center': Scale the image down so that it is completely visible, + * if bigger than the area of the view. + * The image will not be scaled up. + */ + resizeMode?: ImageResizeMode; + + /** + * The mechanism that should be used to resize the image when the image's dimensions + * differ from the image view's dimensions. Defaults to `auto`. + * + * - `auto`: Use heuristics to pick between `resize` and `scale`. + * + * - `resize`: A software operation which changes the encoded image in memory before it + * gets decoded. This should be used instead of `scale` when the image is much larger + * than the view. + * + * - `scale`: The image gets drawn downscaled or upscaled. Compared to `resize`, `scale` is + * faster (usually hardware accelerated) and produces higher quality images. This + * should be used if the image is smaller than the view. It should also be used if the + * image is slightly bigger than the view. + * + * More details about `resize` and `scale` can be found at http://frescolib.org/docs/resizing-rotating.html. + * + * @platform android + */ + resizeMethod?: "auto" | "resize" | "scale"; + + /** + * The image source (either a remote URL or a local file resource). + * + * This prop can also contain several remote URLs, specified together with their width and height and potentially with scale/other URI arguments. + * The native side will then choose the best uri to display based on the measured size of the image container. + * A cache property can be added to control how networked request interacts with the local cache. + * + * The currently supported formats are png, jpg, jpeg, bmp, gif, webp (Android only), psd (iOS only). + */ + source: ImageSourcePropType; + + /** + * similarly to `source`, this property represents the resource used to render + * the loading indicator for the image, displayed until image is ready to be + * displayed, typically after when it got downloaded from network. + */ + loadingIndicatorSource?: ImageURISource; + + /** + * A unique identifier for this element to be used in UI Automation testing scripts. + */ + testID?: string; + + /** + * A static image to display while downloading the final image off the network. + */ + defaultSource?: ImageURISource | number; +} + +export interface ImageProps extends ImagePropsBase { + /** + * + * Style + */ + style?: StyleProp; +} + +declare class ImageComponent extends React.Component {} +declare const ImageBase: Constructor & typeof ImageComponent; +export class Image extends ImageBase { + static getSize(uri: string, success: (width: number, height: number) => void, failure: (error: any) => void): any; + static prefetch(url: string): any; + static abortPrefetch?(requestId: number): void; + static queryCache?(urls: string[]): Promise<{[url: string]: "memory" | "disk" | "disk/memory"}>; + + /** + * @see https://facebook.github.io/react-native/docs/image.html#resolveassetsource + */ + static resolveAssetSource(source: ImageSourcePropType): ImageResolvedAssetSource; +} + +export interface ImageBackgroundProps extends ImagePropsBase { + imageStyle?: StyleProp; + style?: StyleProp; + imageRef?(image: Image): void; +} + +declare class ImageBackgroundComponent extends React.Component {} +declare const ImageBackgroundBase: Constructor & typeof ImageBackgroundComponent; +export class ImageBackground extends ImageBackgroundBase { + resizeMode: ImageResizeMode; + getSize(uri: string, success: (width: number, height: number) => void, failure: (error: any) => void): any; + prefetch(url: string): any; + abortPrefetch?(requestId: number): void; + queryCache?(urls: string[]): Promise<{[url: string]: "memory" | "disk" | "disk/memory"}>; +} + +export interface ViewToken { + item: any; + key: string; + index: number | null; + isViewable: boolean; + section?: any; } export interface ViewabilityConfig { - /** - * Minimum amount of time (in milliseconds) that an item must be physically viewable before the - * viewability callback will be fired. A high number means that scrolling through content without - * stopping will not mark the content as viewable. - */ - minimumViewTime?: number - - /** - * Percent of viewport that must be covered for a partially occluded item to count as - * "viewable", 0-100. Fully visible items are always considered viewable. A value of 0 means - * that a single pixel in the viewport makes the item viewable, and a value of 100 means that - * an item must be either entirely visible or cover the entire viewport to count as viewable. - */ - viewAreaCoveragePercentThreshold?: number - - /** - * Similar to `viewAreaCoveragePercentThreshold`, but considers the percent of the item that is visible, - * rather than the fraction of the viewable area it covers. - */ - itemVisiblePercentThreshold?: number - - /** - * Nothing is considered viewable until the user scrolls or `recordInteraction` is called after - * render. - */ - waitForInteraction?: boolean + /** + * Minimum amount of time (in milliseconds) that an item must be physically viewable before the + * viewability callback will be fired. A high number means that scrolling through content without + * stopping will not mark the content as viewable. + */ + minimumViewTime?: number; + + /** + * Percent of viewport that must be covered for a partially occluded item to count as + * "viewable", 0-100. Fully visible items are always considered viewable. A value of 0 means + * that a single pixel in the viewport makes the item viewable, and a value of 100 means that + * an item must be either entirely visible or cover the entire viewport to count as viewable. + */ + viewAreaCoveragePercentThreshold?: number; + + /** + * Similar to `viewAreaCoveragePercentThreshold`, but considers the percent of the item that is visible, + * rather than the fraction of the viewable area it covers. + */ + itemVisiblePercentThreshold?: number; + + /** + * Nothing is considered viewable until the user scrolls or `recordInteraction` is called after + * render. + */ + waitForInteraction?: boolean; } export interface ViewabilityConfigCallbackPair { - viewabilityConfig: ViewabilityConfig - onViewableItemsChanged: - | ((info: {viewableItems: Array; changed: Array}) => void) - | null + viewabilityConfig: ViewabilityConfig; + onViewableItemsChanged: ((info: { viewableItems: Array; changed: Array }) => void) | null; } -export type ViewabilityConfigCallbackPairs = ViewabilityConfigCallbackPair[] +export type ViewabilityConfigCallbackPairs = ViewabilityConfigCallbackPair[]; /** * @see https://facebook.github.io/react-native/docs/flatlist.html#props */ export interface ListRenderItemInfo { - item: ItemT + item: ItemT; - index: number + index: number; - separators: { - highlight: () => void - unhighlight: () => void - updateProps: (select: 'leading' | 'trailing', newProps: any) => void - } + separators: { + highlight: () => void; + unhighlight: () => void; + updateProps: (select: "leading" | "trailing", newProps: any) => void; + }; } -export type ListRenderItem = (info: ListRenderItemInfo) => React.ReactElement | null +export type ListRenderItem = (info: ListRenderItemInfo) => React.ReactElement | null; export interface FlatListProps extends VirtualizedListProps { - /** - * Rendered in between each item, but not at the top or bottom - */ - ItemSeparatorComponent?: React.ComponentType | null - - /** - * Rendered when the list is empty. - */ - ListEmptyComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the very end of the list. - */ - ListFooterComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the very beginning of the list. - */ - ListHeaderComponent?: React.ComponentType | React.ReactElement | null - - /** - * Optional custom style for multi-item rows generated when numColumns > 1 - */ - columnWrapperStyle?: StyleProp - - /** - * Determines when the keyboard should stay visible after a tap. - * - 'never' (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap. - * - 'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps. - * - 'handled', the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor). - * - false, deprecated, use 'never' instead - * - true, deprecated, use 'always' instead - */ - keyboardShouldPersistTaps?: boolean | 'always' | 'never' | 'handled' - - /** - * For simplicity, data is just a plain array. If you want to use something else, - * like an immutable list, use the underlying VirtualizedList directly. - */ - data: ReadonlyArray | null - - /** - * A marker property for telling the list to re-render (since it implements PureComponent). - * If any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the `data` prop, - * stick it here and treat it immutably. - */ - extraData?: any - - /** - * `getItemLayout` is an optional optimization that lets us skip measurement of dynamic - * content if you know the height of items a priori. getItemLayout is the most efficient, - * and is easy to use if you have fixed height items, for example: - * ``` - * getItemLayout={(data, index) => ( - * {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index} - * )} - * ``` - * Remember to include separator length (height or width) in your offset calculation if you specify - * `ItemSeparatorComponent`. - */ - getItemLayout?: ( - data: Array | null, - index: number - ) => {length: number; offset: number; index: number} - - /** - * If true, renders items next to each other horizontally instead of stacked vertically. - */ - horizontal?: boolean - - /** - * How many items to render in the initial batch - */ - initialNumToRender?: number - - /** - * Instead of starting at the top with the first item, start at initialScrollIndex - */ - initialScrollIndex?: number - - /** - * Used to extract a unique key for a given item at the specified index. Key is used for caching - * and as the react key to track item re-ordering. The default extractor checks `item.key`, then - * falls back to using the index, like React does. - */ - keyExtractor?: (item: ItemT, index: number) => string - - /** - * Uses legacy MetroListView instead of default VirtualizedSectionList - */ - legacyImplementation?: boolean - - /** - * Multiple columns can only be rendered with `horizontal={false}` and will zig-zag like a `flexWrap` layout. - * Items should all be the same height - masonry layouts are not supported. - */ - numColumns?: number - - /** - * Called once when the scroll position gets within onEndReachedThreshold of the rendered content. - */ - onEndReached?: ((info: {distanceFromEnd: number}) => void) | null - - /** - * How far from the end (in units of visible length of the list) the bottom edge of the - * list must be from the end of the content to trigger the `onEndReached` callback. - * Thus a value of 0.5 will trigger `onEndReached` when the end of the content is - * within half the visible length of the list. - */ - onEndReachedThreshold?: number | null - - /** - * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. - * Make sure to also set the refreshing prop correctly. - */ - onRefresh?: (() => void) | null - - /** - * Called when the viewability of rows changes, as defined by the `viewablePercentThreshold` prop. - */ - onViewableItemsChanged?: - | ((info: {viewableItems: Array; changed: Array}) => void) - | null - - /** - * Set this true while waiting for new data from a refresh. - */ - refreshing?: boolean | null - - /** - * Takes an item from data and renders it into the list. Typical usage: - * ``` - * _renderItem = ({item}) => ( - * this._onPress(item)}> - * {item.title} - * - * ); - * ... - * - * ``` - * Provides additional metadata like `index` if you need it. - */ - renderItem: ListRenderItem - - /** - * See `ViewabilityHelper` for flow type and further documentation. - */ - viewabilityConfig?: any - - /** - * Note: may have bugs (missing content) in some circumstances - use at your own risk. - * - * This may improve scroll performance for large lists. - */ - removeClippedSubviews?: boolean -} + /** + * Rendered in between each item, but not at the top or bottom + */ + ItemSeparatorComponent?: React.ComponentType | null; -export class FlatList extends React.Component> { - /** - * Exports some data, e.g. for perf investigations or analytics. - */ - getMetrics: () => { - contentLength: number - totalRows: number - renderedRows: number - visibleRows: number - } - - /** - * Scrolls to the end of the content. May be janky without `getItemLayout` prop. - */ - scrollToEnd: (params?: {animated?: boolean}) => void - - /** - * Scrolls to the item at the specified index such that it is positioned in the viewable area - * such that viewPosition 0 places it at the top, 1 at the bottom, and 0.5 centered in the middle. - * Cannot scroll to locations outside the render window without specifying the getItemLayout prop. - */ - scrollToIndex: (params: { - animated?: boolean - index: number - viewOffset?: number - viewPosition?: number - }) => void - - /** - * Requires linear scan through data - use `scrollToIndex` instead if possible. - * May be janky without `getItemLayout` prop. - */ - scrollToItem: (params: {animated?: boolean; item: ItemT; viewPosition?: number}) => void - - /** - * Scroll to a specific content pixel offset, like a normal `ScrollView`. - */ - scrollToOffset: (params: {animated?: boolean; offset: number}) => void - - /** - * Tells the list an interaction has occured, which should trigger viewability calculations, - * e.g. if waitForInteractions is true and the user has not scrolled. This is typically called - * by taps on items or by navigation actions. - */ - recordInteraction: () => void - - /** - * Displays the scroll indicators momentarily. - */ - flashScrollIndicators: () => void -} + /** + * Rendered when the list is empty. + */ + ListEmptyComponent?: React.ComponentType | React.ReactElement | null; -/** - * @see https://facebook.github.io/react-native/docs/sectionlist.html - */ -export interface SectionBase { - data: ReadonlyArray + /** + * Rendered at the very end of the list. + */ + ListFooterComponent?: React.ComponentType | React.ReactElement | null; - key?: string + /** + * Styling for internal View for ListFooterComponent + */ + ListFooterComponentStyle?: ViewStyle | null; - renderItem?: SectionListRenderItem + /** + * Rendered at the very beginning of the list. + */ + ListHeaderComponent?: React.ComponentType | React.ReactElement | null; - ItemSeparatorComponent?: React.ComponentType | null + /** + * Styling for internal View for ListHeaderComponent + */ + ListHeaderComponentStyle?: ViewStyle | null; - keyExtractor?: (item: ItemT, index: number) => string -} + /** + * Optional custom style for multi-item rows generated when numColumns > 1 + */ + columnWrapperStyle?: StyleProp; -export interface SectionListData extends SectionBase { - [key: string]: any -} + /** + * Determines when the keyboard should stay visible after a tap. + * - 'never' (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap. + * - 'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps. + * - 'handled', the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor). + * - false, deprecated, use 'never' instead + * - true, deprecated, use 'always' instead + */ + keyboardShouldPersistTaps?: boolean | "always" | "never" | "handled"; -/** - * @see https://facebook.github.io/react-native/docs/sectionlist.html#props - */ + /** + * For simplicity, data is just a plain array. If you want to use something else, + * like an immutable list, use the underlying VirtualizedList directly. + */ + data: ReadonlyArray | null; -export interface SectionListRenderItemInfo extends ListRenderItemInfo { - section: SectionListData -} + /** + * A marker property for telling the list to re-render (since it implements PureComponent). + * If any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the `data` prop, + * stick it here and treat it immutably. + */ + extraData?: any; -export type SectionListRenderItem = ( - info: SectionListRenderItemInfo -) => React.ReactElement | null + /** + * `getItemLayout` is an optional optimization that lets us skip measurement of dynamic + * content if you know the height of items a priori. getItemLayout is the most efficient, + * and is easy to use if you have fixed height items, for example: + * ``` + * getItemLayout={(data, index) => ( + * {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index} + * )} + * ``` + * Remember to include separator length (height or width) in your offset calculation if you specify + * `ItemSeparatorComponent`. + */ + getItemLayout?: (data: Array | null, index: number) => { length: number; offset: number; index: number }; -export interface SectionListProps extends VirtualizedListWithoutRenderItemProps { - /** - * Rendered in between adjacent Items within each section. - */ - ItemSeparatorComponent?: React.ComponentType | null - - /** - * Rendered when the list is empty. - */ - ListEmptyComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the very end of the list. - */ - ListFooterComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the very beginning of the list. - */ - ListHeaderComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered in between each section. - */ - SectionSeparatorComponent?: React.ComponentType | React.ReactElement | null - - /** - * A marker property for telling the list to re-render (since it implements PureComponent). - * If any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the `data` prop, - * stick it here and treat it immutably. - */ - extraData?: any - - /** - * `getItemLayout` is an optional optimization that lets us skip measurement of dynamic - * content if you know the height of items a priori. getItemLayout is the most efficient, - * and is easy to use if you have fixed height items, for example: - * ``` - * getItemLayout={(data, index) => ( - * {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index} - * )} - * ``` - */ - getItemLayout?: ( - data: SectionListData[] | null, - index: number - ) => {length: number; offset: number; index: number} - - /** - * How many items to render in the initial batch - */ - initialNumToRender?: number - - /** - * Reverses the direction of scroll. Uses scale transforms of -1. - */ - inverted?: boolean - - /** - * Used to extract a unique key for a given item at the specified index. Key is used for caching - * and as the react key to track item re-ordering. The default extractor checks `item.key`, then - * falls back to using the index, like React does. - */ - keyExtractor?: (item: ItemT, index: number) => string - - /** - * Called once when the scroll position gets within onEndReachedThreshold of the rendered content. - */ - onEndReached?: ((info: {distanceFromEnd: number}) => void) | null - - /** - * How far from the end (in units of visible length of the list) the bottom edge of the - * list must be from the end of the content to trigger the `onEndReached` callback. - * Thus a value of 0.5 will trigger `onEndReached` when the end of the content is - * within half the visible length of the list. - */ - onEndReachedThreshold?: number | null - - /** - * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. - * Make sure to also set the refreshing prop correctly. - */ - onRefresh?: (() => void) | null - - /** - * Used to handle failures when scrolling to an index that has not been measured yet. - * Recommended action is to either compute your own offset and `scrollTo` it, or scroll as far - * as possible and then try again after more items have been rendered. - */ - onScrollToIndexFailed?: (info: { - index: number - highestMeasuredFrameIndex: number - averageItemLength: number - }) => void - - /** - * Set this true while waiting for new data from a refresh. - */ - refreshing?: boolean | null - - /** - * Default renderer for every item in every section. Can be over-ridden on a per-section basis. - */ - renderItem?: SectionListRenderItem - - /** - * Rendered at the top of each section. Sticky headers are not yet supported. - */ - renderSectionHeader?: (info: {section: SectionListData}) => React.ReactElement | null - - /** - * Rendered at the bottom of each section. - */ - renderSectionFooter?: (info: {section: SectionListData}) => React.ReactElement | null - - /** - * An array of objects with data for each section. - */ - sections: ReadonlyArray> - - /** - * Render a custom scroll component, e.g. with a differently styled `RefreshControl`. - */ - renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement - - /** - * Note: may have bugs (missing content) in some circumstances - use at your own risk. - * - * This may improve scroll performance for large lists. - */ - removeClippedSubviews?: boolean - - /** - * Makes section headers stick to the top of the screen until the next one pushes it off. - * Only enabled by default on iOS because that is the platform standard there. - */ - stickySectionHeadersEnabled?: boolean - - /** - * Uses legacy MetroListView instead of default VirtualizedSectionList - */ - legacyImplementation?: boolean -} + /** + * If true, renders items next to each other horizontally instead of stacked vertically. + */ + horizontal?: boolean; -export interface SectionListScrollParams { - animated?: boolean - itemIndex: number - sectionIndex: number - viewOffset?: number - viewPosition?: number -} + /** + * How many items to render in the initial batch + */ + initialNumToRender?: number; -export interface SectionListStatic extends React.ComponentClass> { - /** - * Scrolls to the item at the specified sectionIndex and itemIndex (within the section) - * positioned in the viewable area such that viewPosition 0 places it at the top - * (and may be covered by a sticky header), 1 at the bottom, and 0.5 centered in the middle. - */ - scrollToLocation?(params: SectionListScrollParams): void -} + /** + * Instead of starting at the top with the first item, start at initialScrollIndex + */ + initialScrollIndex?: number; -/** - * @see https://facebook.github.io/react-native/docs/virtualizedlist.html#props - */ -export interface VirtualizedListProps extends VirtualizedListWithoutRenderItemProps { - renderItem: ListRenderItem -} + /** + * Used to extract a unique key for a given item at the specified index. Key is used for caching + * and as the react key to track item re-ordering. The default extractor checks `item.key`, then + * falls back to using the index, like React does. + */ + keyExtractor?: (item: ItemT, index: number) => string; -export interface VirtualizedListWithoutRenderItemProps extends ScrollViewProps { - /** - * Rendered when the list is empty. Can be a React Component Class, a render function, or - * a rendered element. - */ - ListEmptyComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the bottom of all the items. Can be a React Component Class, a render function, or - * a rendered element. - */ - ListFooterComponent?: React.ComponentType | React.ReactElement | null - - /** - * Rendered at the top of all the items. Can be a React Component Class, a render function, or - * a rendered element. - */ - ListHeaderComponent?: React.ComponentType | React.ReactElement | null - - /** - * The default accessor functions assume this is an Array<{key: string}> but you can override - * getItem, getItemCount, and keyExtractor to handle any type of index-based data. - */ - data?: any - - /** - * `debug` will turn on extra logging and visual overlays to aid with debugging both usage and - * implementation, but with a significant perf hit. - */ - debug?: boolean - - /** - * DEPRECATED: Virtualization provides significant performance and memory optimizations, but fully - * unmounts react instances that are outside of the render window. You should only need to disable - * this for debugging purposes. - */ - disableVirtualization?: boolean - - /** - * A marker property for telling the list to re-render (since it implements `PureComponent`). If - * any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the - * `data` prop, stick it here and treat it immutably. - */ - extraData?: any - - /** - * A generic accessor for extracting an item from any sort of data blob. - */ - getItem?: (data: any, index: number) => ItemT - - /** - * Determines how many items are in the data blob. - */ - getItemCount?: (data: any) => number - - getItemLayout?: ( - data: any, - index: number - ) => { - length: number - offset: number - index: number - } - - horizontal?: boolean - - /** - * How many items to render in the initial batch. This should be enough to fill the screen but not - * much more. Note these items will never be unmounted as part of the windowed rendering in order - * to improve perceived performance of scroll-to-top actions. - */ - initialNumToRender?: number - - /** - * Instead of starting at the top with the first item, start at `initialScrollIndex`. This - * disables the "scroll to top" optimization that keeps the first `initialNumToRender` items - * always rendered and immediately renders the items starting at this initial index. Requires - * `getItemLayout` to be implemented. - */ - initialScrollIndex?: number - - /** - * Reverses the direction of scroll. Uses scale transforms of -1. - */ - inverted?: boolean - - keyExtractor?: (item: ItemT, index: number) => string - - listKey?: string - - /** - * The maximum number of items to render in each incremental render batch. The more rendered at - * once, the better the fill rate, but responsiveness my suffer because rendering content may - * interfere with responding to button taps or other interactions. - */ - maxToRenderPerBatch?: number - - onEndReached?: ((info: {distanceFromEnd: number}) => void) | null - - onEndReachedThreshold?: number | null - - onLayout?: (event: LayoutChangeEvent) => void - - /** - * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. Make - * sure to also set the `refreshing` prop correctly. - */ - onRefresh?: (() => void) | null - - /** - * Used to handle failures when scrolling to an index that has not been measured yet. - * Recommended action is to either compute your own offset and `scrollTo` it, or scroll as far - * as possible and then try again after more items have been rendered. - */ - onScrollToIndexFailed?: (info: { - index: number - highestMeasuredFrameIndex: number - averageItemLength: number - }) => void - - /** - * Called when the viewability of rows changes, as defined by the - * `viewabilityConfig` prop. - */ - onViewableItemsChanged?: - | ((info: {viewableItems: Array; changed: Array}) => void) - | null - - /** - * Set this when offset is needed for the loading indicator to show correctly. - * @platform android - */ - progressViewOffset?: number - - /** - * Set this true while waiting for new data from a refresh. - */ - refreshing?: boolean | null - - /** - * Note: may have bugs (missing content) in some circumstances - use at your own risk. - * - * This may improve scroll performance for large lists. - */ - removeClippedSubviews?: boolean - - /** - * Render a custom scroll component, e.g. with a differently styled `RefreshControl`. - */ - renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement - - /** - * Amount of time between low-pri item render batches, e.g. for rendering items quite a ways off - * screen. Similar fill rate/responsiveness tradeoff as `maxToRenderPerBatch`. - */ - updateCellsBatchingPeriod?: number - - viewabilityConfig?: ViewabilityConfig - - viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs - - /** - * Determines the maximum number of items rendered outside of the visible area, in units of - * visible lengths. So if your list fills the screen, then `windowSize={21}` (the default) will - * render the visible screen area plus up to 10 screens above and 10 below the viewport. Reducing - * this number will reduce memory consumption and may improve performance, but will increase the - * chance that fast scrolling may reveal momentary blank areas of unrendered content. - */ - windowSize?: number -} + /** + * Uses legacy MetroListView instead of default VirtualizedSectionList + */ + legacyImplementation?: boolean; -/** - * @see https://facebook.github.io/react-native/docs/listview.html#props - */ -export interface ListViewProps extends ScrollViewProps { - /** - * An instance of [ListView.DataSource](docs/listviewdatasource.html) to use - */ - dataSource: ListViewDataSource - - /** - * Flag indicating whether empty section headers should be rendered. - * In the future release empty section headers will be rendered by - * default, and the flag will be deprecated. If empty sections are not - * desired to be rendered their indices should be excluded from - * sectionID object. - */ - enableEmptySections?: boolean - - /** - * How many rows to render on initial component mount. Use this to make - * it so that the first screen worth of data apears at one time instead of - * over the course of multiple frames. - */ - initialListSize?: number - - /** - * (visibleRows, changedRows) => void - * - * Called when the set of visible rows changes. `visibleRows` maps - * { sectionID: { rowID: true }} for all the visible rows, and - * `changedRows` maps { sectionID: { rowID: true | false }} for the rows - * that have changed their visibility, with true indicating visible, and - * false indicating the view has moved out of view. - */ - onChangeVisibleRows?: ( - visibleRows: Array<{[sectionId: string]: {[rowID: string]: boolean}}>, - changedRows: Array<{[sectionId: string]: {[rowID: string]: boolean}}> - ) => void - - /** - * Called when all rows have been rendered and the list has been scrolled - * to within onEndReachedThreshold of the bottom. The native scroll - * event is provided. - */ - onEndReached?: () => void - - /** - * Threshold in pixels for onEndReached. - */ - onEndReachedThreshold?: number - - /** - * Number of rows to render per event loop. - */ - pageSize?: number - - /** - * A performance optimization for improving scroll perf of - * large lists, used in conjunction with overflow: 'hidden' on the row - * containers. Use at your own risk. - */ - removeClippedSubviews?: boolean - - /** - * () => renderable - * - * The header and footer are always rendered (if these props are provided) - * on every render pass. If they are expensive to re-render, wrap them - * in StaticContainer or other mechanism as appropriate. Footer is always - * at the bottom of the list, and header at the top, on every render pass. - */ - renderFooter?: () => React.ReactElement - - /** - * () => renderable - * - * The header and footer are always rendered (if these props are provided) - * on every render pass. If they are expensive to re-render, wrap them - * in StaticContainer or other mechanism as appropriate. Footer is always - * at the bottom of the list, and header at the top, on every render pass. - */ - renderHeader?: () => React.ReactElement - - /** - * (rowData, sectionID, rowID) => renderable - * Takes a data entry from the data source and its ids and should return - * a renderable component to be rendered as the row. By default the data - * is exactly what was put into the data source, but it's also possible to - * provide custom extractors. - */ - renderRow: ( - rowData: any, - sectionID: string | number, - rowID: string | number, - highlightRow?: boolean - ) => React.ReactElement - - /** - * A function that returns the scrollable component in which the list rows are rendered. - * Defaults to returning a ScrollView with the given props. - */ - renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement - - /** - * (sectionData, sectionID) => renderable - * - * If provided, a sticky header is rendered for this section. The sticky - * behavior means that it will scroll with the content at the top of the - * section until it reaches the top of the screen, at which point it will - * stick to the top until it is pushed off the screen by the next section - * header. - */ - renderSectionHeader?: (sectionData: any, sectionId: string | number) => React.ReactElement - - /** - * (sectionID, rowID, adjacentRowHighlighted) => renderable - * If provided, a renderable component to be rendered as the separator below each row - * but not the last row if there is a section header below. - * Take a sectionID and rowID of the row above and whether its adjacent row is highlighted. - */ - renderSeparator?: ( - sectionID: string | number, - rowID: string | number, - adjacentRowHighlighted?: boolean - ) => React.ReactElement - - /** - * How early to start rendering rows before they come on screen, in - * pixels. - */ - scrollRenderAheadDistance?: number - - /** - * An array of child indices determining which children get docked to the - * top of the screen when scrolling. For example, passing - * `stickyHeaderIndices={[0]}` will cause the first child to be fixed to the - * top of the scroll view. This property is not supported in conjunction - * with `horizontal={true}`. - * @platform ios - */ - stickyHeaderIndices?: number[] - - /** - * Makes the sections headers sticky. The sticky behavior means that it will scroll with the - * content at the top of the section until it reaches the top of the screen, at which point it - * will stick to the top until it is pushed off the screen by the next section header. This - * property is not supported in conjunction with `horizontal={true}`. Only enabled by default - * on iOS because of typical platform standards. - */ - stickySectionHeadersEnabled?: boolean -} + /** + * Multiple columns can only be rendered with `horizontal={false}` and will zig-zag like a `flexWrap` layout. + * Items should all be the same height - masonry layouts are not supported. + */ + numColumns?: number; -interface TimerMixin { - setTimeout: typeof setTimeout - clearTimeout: typeof clearTimeout - setInterval: typeof setInterval - clearInterval: typeof clearInterval - setImmediate: typeof setImmediate - clearImmediate: typeof clearImmediate - requestAnimationFrame: typeof requestAnimationFrame - cancelAnimationFrame: typeof cancelAnimationFrame -} + /** + * Called once when the scroll position gets within onEndReachedThreshold of the rendered content. + */ + onEndReached?: ((info: { distanceFromEnd: number }) => void) | null; -declare class ListViewComponent extends React.Component {} -declare const ListViewBase: Constructor & - Constructor & - typeof ListViewComponent -export class ListView extends ListViewBase { - static DataSource: ListViewDataSource - - /** - * Exports some data, e.g. for perf investigations or analytics. - */ - getMetrics: () => { - contentLength: number - totalRows: number - renderedRows: number - visibleRows: number - } - - /** - * Provides a handle to the underlying scroll responder. - */ - getScrollResponder: () => any - - /** - * Scrolls to a given x, y offset, either immediately or with a smooth animation. - * - * See `ScrollView#scrollTo`. - */ - scrollTo: ( - y?: number | {x?: number; y?: number; animated?: boolean}, - x?: number, - animated?: boolean - ) => void -} + /** + * How far from the end (in units of visible length of the list) the bottom edge of the + * list must be from the end of the content to trigger the `onEndReached` callback. + * Thus a value of 0.5 will trigger `onEndReached` when the end of the content is + * within half the visible length of the list. + */ + onEndReachedThreshold?: number | null; -interface MaskedViewIOSProps extends ViewProps { - maskElement: React.ReactElement -} + /** + * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. + * Make sure to also set the refreshing prop correctly. + */ + onRefresh?: (() => void) | null; -/** - * @see https://facebook.github.io/react-native/docs/maskedviewios.html - */ -declare class MaskedViewComponent extends React.Component {} -declare const MaskedViewBase: Constructor & typeof MaskedViewComponent -export class MaskedViewIOS extends MaskedViewBase {} + /** + * Called when the viewability of rows changes, as defined by the `viewablePercentThreshold` prop. + */ + onViewableItemsChanged?: ((info: { viewableItems: Array; changed: Array }) => void) | null; -export interface ModalBaseProps { - // Only `animated` is documented. The JS code says `animated` is - // deprecated and `animationType` is preferred. - animated?: boolean - /** - * The `animationType` prop controls how the modal animates. - * - * - `slide` slides in from the bottom - * - `fade` fades into view - * - `none` appears without an animation - */ - animationType?: 'none' | 'slide' | 'fade' - /** - * The `transparent` prop determines whether your modal will fill the entire view. - * Setting this to `true` will render the modal over a transparent background. - */ - transparent?: boolean - /** - * The `visible` prop determines whether your modal is visible. - */ - visible?: boolean - /** - * The `onRequestClose` prop allows passing a function that will be called once the modal has been dismissed. - * _On the Android platform, this is a required function._ - */ - onRequestClose?: () => void - /** - * The `onShow` prop allows passing a function that will be called once the modal has been shown. - */ - onShow?: (event: NativeSyntheticEvent) => void -} + /** + * Set this true while waiting for new data from a refresh. + */ + refreshing?: boolean | null; -export interface ModalPropsIOS { - /** - * The `presentationStyle` determines the style of modal to show - */ - presentationStyle?: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen' - - /** - * The `supportedOrientations` prop allows the modal to be rotated to any of the specified orientations. - * On iOS, the modal is still restricted by what's specified in your app's Info.plist's UISupportedInterfaceOrientations field. - */ - supportedOrientations?: Array< - 'portrait' | 'portrait-upside-down' | 'landscape' | 'landscape-left' | 'landscape-right' - > - - /** - * The `onDismiss` prop allows passing a function that will be called once the modal has been dismissed. - */ - onDismiss?: () => void - - /** - * The `onOrientationChange` callback is called when the orientation changes while the modal is being displayed. - * The orientation provided is only 'portrait' or 'landscape'. This callback is also called on initial render, regardless of the current orientation. - */ - onOrientationChange?: (event: NativeSyntheticEvent) => void -} + /** + * Takes an item from data and renders it into the list. Typical usage: + * ``` + * _renderItem = ({item}) => ( + * this._onPress(item)}> + * {item.title} + * + * ); + * ... + * + * ``` + * Provides additional metadata like `index` if you need it. + */ + renderItem: ListRenderItem; -export interface ModalPropsAndroid { - /** - * Controls whether to force hardware acceleration for the underlying window. - */ - hardwareAccelerated?: boolean + /** + * See `ViewabilityHelper` for flow type and further documentation. + */ + viewabilityConfig?: any; + + /** + * Note: may have bugs (missing content) in some circumstances - use at your own risk. + * + * This may improve scroll performance for large lists. + */ + removeClippedSubviews?: boolean; } -export type ModalProps = ModalBaseProps & ModalPropsIOS & ModalPropsAndroid +export class FlatList extends React.Component> { + /** + * Exports some data, e.g. for perf investigations or analytics. + */ + getMetrics: () => { + contentLength: number; + totalRows: number; + renderedRows: number; + visibleRows: number; + }; -export class Modal extends React.Component {} + /** + * Scrolls to the end of the content. May be janky without `getItemLayout` prop. + */ + scrollToEnd: (params?: { animated?: boolean }) => void; -/** - * @see https://github.com/facebook/react-native/blob/0.34-stable\Libraries\Components\Touchable\Touchable.js - */ -interface TouchableMixin { - /** - * Invoked when the item should be highlighted. Mixers should implement this - * to visually distinguish the `VisualRect` so that the user knows that - * releasing a touch will result in a "selection" (analog to click). - */ - touchableHandleActivePressIn(e: GestureResponderEvent): void - - /** - * Invoked when the item is "active" (in that it is still eligible to become - * a "select") but the touch has left the `PressRect`. Usually the mixer will - * want to unhighlight the `VisualRect`. If the user (while pressing) moves - * back into the `PressRect` `touchableHandleActivePressIn` will be invoked - * again and the mixer should probably highlight the `VisualRect` again. This - * event will not fire on an `touchEnd/mouseUp` event, only move events while - * the user is depressing the mouse/touch. - */ - touchableHandleActivePressOut(e: GestureResponderEvent): void - - /** - * Invoked when the item is "selected" - meaning the interaction ended by - * letting up while the item was either in the state - * `RESPONDER_ACTIVE_PRESS_IN` or `RESPONDER_INACTIVE_PRESS_IN`. - */ - touchableHandlePress(e: GestureResponderEvent): void - - /** - * Invoked when the item is long pressed - meaning the interaction ended by - * letting up while the item was in `RESPONDER_ACTIVE_LONG_PRESS_IN`. If - * `touchableHandleLongPress` is *not* provided, `touchableHandlePress` will - * be called as it normally is. If `touchableHandleLongPress` is provided, by - * default any `touchableHandlePress` callback will not be invoked. To - * override this default behavior, override `touchableLongPressCancelsPress` - * to return false. As a result, `touchableHandlePress` will be called when - * lifting up, even if `touchableHandleLongPress` has also been called. - */ - touchableHandleLongPress(e: GestureResponderEvent): void - - /** - * Returns the amount to extend the `HitRect` into the `PressRect`. Positive - * numbers mean the size expands outwards. - */ - touchableGetPressRectOffset(): Insets - - /** - * Returns the number of millis to wait before triggering a highlight. - */ - touchableGetHighlightDelayMS(): number - - // These methods are undocumented but still being used by TouchableMixin internals - touchableGetLongPressDelayMS(): number - touchableGetPressOutDelayMS(): number - touchableGetHitSlop(): Insets -} + /** + * Scrolls to the item at the specified index such that it is positioned in the viewable area + * such that viewPosition 0 places it at the top, 1 at the bottom, and 0.5 centered in the middle. + * Cannot scroll to locations outside the render window without specifying the getItemLayout prop. + */ + scrollToIndex: (params: { animated?: boolean; index: number; viewOffset?: number; viewPosition?: number }) => void; -export interface TouchableWithoutFeedbackPropsIOS { - /** - * *(Apple TV only)* TV preferred focus (see documentation for the View component). - * - * @platform ios - */ - hasTVPreferredFocus?: boolean - - /** - * *(Apple TV only)* Object with properties to control Apple TV parallax effects. - * - * enabled: If true, parallax effects are enabled. Defaults to true. - * shiftDistanceX: Defaults to 2.0. - * shiftDistanceY: Defaults to 2.0. - * tiltAngle: Defaults to 0.05. - * magnification: Defaults to 1.0. - * pressMagnification: Defaults to 1.0. - * pressDuration: Defaults to 0.3. - * pressDelay: Defaults to 0.0. - * - * @platform ios - */ - tvParallaxProperties?: TVParallaxProperties -} + /** + * Requires linear scan through data - use `scrollToIndex` instead if possible. + * May be janky without `getItemLayout` prop. + */ + scrollToItem: (params: { animated?: boolean; item: ItemT; viewPosition?: number }) => void; -/** - * @see https://facebook.github.io/react-native/docs/touchablewithoutfeedback.html#props - */ -export interface TouchableWithoutFeedbackProps extends TouchableWithoutFeedbackPropsIOS, AccessibilityProps { - /** - * Delay in ms, from onPressIn, before onLongPress is called. - */ - delayLongPress?: number - - /** - * Delay in ms, from the start of the touch, before onPressIn is called. - */ - delayPressIn?: number - - /** - * Delay in ms, from the release of the touch, before onPressOut is called. - */ - delayPressOut?: number - - /** - * If true, disable all interactions for this component. - */ - disabled?: boolean - - /** - * This defines how far your touch can start away from the button. - * This is added to pressRetentionOffset when moving off of the button. - * NOTE The touch area never extends past the parent view bounds and - * the Z-index of sibling views always takes precedence if a touch hits - * two overlapping views. - */ - hitSlop?: Insets - - /** - * When `accessible` is true (which is the default) this may be called when - * the OS-specific concept of "blur" occurs, meaning the element lost focus. - * Some platforms may not have the concept of blur. - */ - onBlur?: (e: NativeSyntheticEvent) => void - - /** - * When `accessible` is true (which is the default) this may be called when - * the OS-specific concept of "focus" occurs. Some platforms may not have - * the concept of focus. - */ - onFocus?: (e: NativeSyntheticEvent) => void - - /** - * Invoked on mount and layout changes with - * {nativeEvent: {layout: {x, y, width, height}}} - */ - onLayout?: (event: LayoutChangeEvent) => void - - onLongPress?: (event: GestureResponderEvent) => void - - /** - * Called when the touch is released, - * but not if cancelled (e.g. by a scroll that steals the responder lock). - */ - onPress?: (event: GestureResponderEvent) => void - - onPressIn?: (event: GestureResponderEvent) => void - - onPressOut?: (event: GestureResponderEvent) => void - - /** - * //FIXME: not in doc but available in examples - */ - style?: StyleProp - - /** - * When the scroll view is disabled, this defines how far your - * touch may move off of the button, before deactivating the button. - * Once deactivated, try moving it back and you'll see that the button - * is once again reactivated! Move it back and forth several times - * while the scroll view is disabled. Ensure you pass in a constant - * to reduce memory allocations. - */ - pressRetentionOffset?: Insets - - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string -} + /** + * Scroll to a specific content pixel offset, like a normal `ScrollView`. + */ + scrollToOffset: (params: { animated?: boolean; offset: number }) => void; -/** - * Do not use unless you have a very good reason. - * All the elements that respond to press should have a visual feedback when touched. - * This is one of the primary reason a "web" app doesn't feel "native". - * - * @see https://facebook.github.io/react-native/docs/touchablewithoutfeedback.html - */ -declare class TouchableWithoutFeedbackComponent extends React.Component {} -declare const TouchableWithoutFeedbackBase: Constructor & - Constructor & - typeof TouchableWithoutFeedbackComponent -export class TouchableWithoutFeedback extends TouchableWithoutFeedbackBase {} + /** + * Tells the list an interaction has occured, which should trigger viewability calculations, + * e.g. if waitForInteractions is true and the user has not scrolled. This is typically called + * by taps on items or by navigation actions. + */ + recordInteraction: () => void; + + /** + * Displays the scroll indicators momentarily. + */ + flashScrollIndicators: () => void; +} /** - * @see https://facebook.github.io/react-native/docs/touchablehighlight.html#props + * @see https://facebook.github.io/react-native/docs/sectionlist.html */ -export interface TouchableHighlightProps extends TouchableWithoutFeedbackProps { - /** - * Determines what the opacity of the wrapped view should be when touch is active. - */ - activeOpacity?: number +export interface SectionBase { + data: ReadonlyArray; - /** - * - * Called immediately after the underlay is hidden - */ - onHideUnderlay?: () => void + key?: string; - /** - * Called immediately after the underlay is shown - */ - onShowUnderlay?: () => void + renderItem?: SectionListRenderItem; - /** - * @see https://facebook.github.io/react-native/docs/view.html#style - */ - style?: StyleProp + ItemSeparatorComponent?: React.ComponentType | null; - /** - * The color of the underlay that will show through when the touch is active. - */ - underlayColor?: string + keyExtractor?: (item: ItemT, index: number) => string; } -/** - * A wrapper for making views respond properly to touches. - * On press down, the opacity of the wrapped view is decreased, - * which allows the underlay color to show through, darkening or tinting the view. - * The underlay comes from adding a view to the view hierarchy, - * which can sometimes cause unwanted visual artifacts if not used correctly, - * for example if the backgroundColor of the wrapped view isn't explicitly set to an opaque color. - * - * NOTE: TouchableHighlight supports only one child - * If you wish to have several child components, wrap them in a View. - * - * @see https://facebook.github.io/react-native/docs/touchablehighlight.html - */ -declare class TouchableHighlightComponent extends React.Component {} -declare const TouchableHighlightBase: Constructor & - Constructor & - Constructor & - typeof TouchableHighlightComponent -export class TouchableHighlight extends TouchableHighlightBase {} - -/** - * @see https://facebook.github.io/react-native/docs/touchableopacity.html#props - */ -export interface TouchableOpacityProps extends TouchableWithoutFeedbackProps { - /** - * Determines what the opacity of the wrapped view should be when touch is active. - * Defaults to 0.2 - */ - activeOpacity?: number +export interface SectionListData extends SectionBase { + [key: string]: any; } /** - * A wrapper for making views respond properly to touches. - * On press down, the opacity of the wrapped view is decreased, dimming it. - * This is done without actually changing the view hierarchy, - * and in general is easy to add to an app without weird side-effects. - * - * @see https://facebook.github.io/react-native/docs/touchableopacity.html + * @see https://facebook.github.io/react-native/docs/sectionlist.html#props */ -declare class TouchableOpacityComponent extends React.Component {} -declare const TouchableOpacityBase: Constructor & - Constructor & - Constructor & - typeof TouchableOpacityComponent -export class TouchableOpacity extends TouchableOpacityBase { - /** - * Animate the touchable to a new opacity. - */ - setOpacityTo: (value: number) => void -} -interface BaseBackgroundPropType { - type: string +export interface SectionListRenderItemInfo extends ListRenderItemInfo { + section: SectionListData; } -interface RippleBackgroundPropType extends BaseBackgroundPropType { - type: 'RippleAndroid' - color?: number - borderless?: boolean -} +export type SectionListRenderItem = (info: SectionListRenderItemInfo) => React.ReactElement | null; -interface ThemeAttributeBackgroundPropType extends BaseBackgroundPropType { - type: 'ThemeAttrAndroid' - attribute: string -} +export interface SectionListProps extends VirtualizedListWithoutRenderItemProps { + /** + * Rendered in between adjacent Items within each section. + */ + ItemSeparatorComponent?: React.ComponentType | null; -type BackgroundPropType = RippleBackgroundPropType | ThemeAttributeBackgroundPropType + /** + * Rendered when the list is empty. + */ + ListEmptyComponent?: React.ComponentType | React.ReactElement | null; -/** - * @see https://facebook.github.io/react-native/docs/touchableopacity.html#props - */ -export interface TouchableNativeFeedbackProps extends TouchableWithoutFeedbackProps { - /** - * Determines the type of background drawable that's going to be used to display feedback. - * It takes an object with type property and extra data depending on the type. - * It's recommended to use one of the following static methods to generate that dictionary: - * 1) TouchableNativeFeedback.SelectableBackground() - will create object that represents android theme's - * default background for selectable elements (?android:attr/selectableItemBackground) - * 2) TouchableNativeFeedback.SelectableBackgroundBorderless() - will create object that represent android - * theme's default background for borderless selectable elements - * (?android:attr/selectableItemBackgroundBorderless). Available on android API level 21+ - * 3) TouchableNativeFeedback.Ripple(color, borderless) - will create object that represents ripple drawable - * with specified color (as a string). If property borderless evaluates to true the ripple will render - * outside of the view bounds (see native actionbar buttons as an example of that behavior). This background - * type is available on Android API level 21+ - */ - background?: BackgroundPropType - useForeground?: boolean -} + /** + * Rendered at the very end of the list. + */ + ListFooterComponent?: React.ComponentType | React.ReactElement | null; -/** - * A wrapper for making views respond properly to touches (Android only). - * On Android this component uses native state drawable to display touch feedback. - * At the moment it only supports having a single View instance as a child node, - * as it's implemented by replacing that View with another instance of RCTView node with some additional properties set. - * - * Background drawable of native feedback touchable can be customized with background property. - * - * @see https://facebook.github.io/react-native/docs/touchablenativefeedback.html#content - */ -declare class TouchableNativeFeedbackComponent extends React.Component {} -declare const TouchableNativeFeedbackBase: Constructor & - typeof TouchableNativeFeedbackComponent -export class TouchableNativeFeedback extends TouchableNativeFeedbackBase { - /** - * Creates an object that represents android theme's default background for - * selectable elements (?android:attr/selectableItemBackground). - */ - static SelectableBackground(): ThemeAttributeBackgroundPropType - - /** - * Creates an object that represent android theme's default background for borderless - * selectable elements (?android:attr/selectableItemBackgroundBorderless). - * Available on android API level 21+. - */ - static SelectableBackgroundBorderless(): ThemeAttributeBackgroundPropType - - /** - * Creates an object that represents ripple drawable with specified color (as a - * string). If property `borderless` evaluates to true the ripple will - * render outside of the view bounds (see native actionbar buttons as an - * example of that behavior). This background type is available on Android - * API level 21+. - * - * @param color The ripple color - * @param borderless If the ripple can render outside it's bounds - */ - static Ripple(color: string, borderless?: boolean): RippleBackgroundPropType - static canUseNativeForeground(): boolean -} + /** + * Rendered at the very beginning of the list. + */ + ListHeaderComponent?: React.ComponentType | React.ReactElement | null; -export interface Route { - component?: React.ComponentType - id?: string - title?: string - passProps?: Object + /** + * Rendered in between each section. + */ + SectionSeparatorComponent?: React.ComponentType | React.ReactElement | null; - //anything else - [key: string]: any + /** + * A marker property for telling the list to re-render (since it implements PureComponent). + * If any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the `data` prop, + * stick it here and treat it immutably. + */ + extraData?: any; - //Commonly found properties - backButtonTitle?: string - content?: string - message?: string - index?: number - onRightButtonPress?: () => void - rightButtonTitle?: string - wrapperStyle?: any -} + /** + * `getItemLayout` is an optional optimization that lets us skip measurement of dynamic + * content if you know the height of items a priori. getItemLayout is the most efficient, + * and is easy to use if you have fixed height items, for example: + * ``` + * getItemLayout={(data, index) => ( + * {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index} + * )} + * ``` + */ + getItemLayout?: ( + data: SectionListData[] | null, + index: number + ) => { length: number; offset: number; index: number }; -interface InteractionMixin { - createInteractionHandle(): number - clearInteractionHandle(clearHandle: number): void - /** - * Schedule work for after all interactions have completed. - * - */ - runAfterInteractions(callback: () => any): void -} + /** + * How many items to render in the initial batch + */ + initialNumToRender?: number; -interface SubscribableMixin { - /** - * Special form of calling `addListener` that *guarantees* that a - * subscription *must* be tied to a component instance, and therefore will - * be cleaned up when the component is unmounted. It is impossible to create - * the subscription and pass it in - this method must be the one to create - * the subscription and therefore can guarantee it is retained in a way that - * will be cleaned up. - * - * @param eventEmitter emitter to subscribe to. - * @param eventType Type of event to listen to. - * @param listener Function to invoke when event occurs. - * @param context Object to use as listener context. - */ - addListenerOn(eventEmitter: any, eventType: string, listener: () => any, context: any): void -} + /** + * Reverses the direction of scroll. Uses scale transforms of -1. + */ + inverted?: boolean; -// @see https://github.com/facebook/react-native/blob/0.34-stable\Libraries\StyleSheet\StyleSheetTypes.js -export namespace StyleSheet { - type NamedStyles = {[P in keyof T]: ViewStyle | TextStyle | ImageStyle} - - /** - * Creates a StyleSheet style reference from the given object. - */ - export function create | NamedStyles>(styles: T | NamedStyles): T - - /** - * Flattens an array of style objects, into one aggregated style object. - * Alternatively, this method can be used to lookup IDs, returned by - * StyleSheet.register. - * - * > **NOTE**: Exercise caution as abusing this can tax you in terms of - * > optimizations. - * > - * > IDs enable optimizations through the bridge and memory in general. Refering - * > to style objects directly will deprive you of these optimizations. - * - * Example: - * ``` - * const styles = StyleSheet.create({ - * listItem: { - * flex: 1, - * fontSize: 16, - * color: 'white' - * }, - * selectedListItem: { - * color: 'green' - * } - * }); - * - * StyleSheet.flatten([styles.listItem, styles.selectedListItem]) - * // returns { flex: 1, fontSize: 16, color: 'green' } - * ``` - * Alternative use: - * ``` - * StyleSheet.flatten(styles.listItem); - * // return { flex: 1, fontSize: 16, color: 'white' } - * // Simply styles.listItem would return its ID (number) - * ``` - * This method internally uses `StyleSheetRegistry.getStyleByID(style)` - * to resolve style objects represented by IDs. Thus, an array of style - * objects (instances of StyleSheet.create), are individually resolved to, - * their respective objects, merged as one and then returned. This also explains - * the alternative use. - */ - export function flatten(style?: RegisteredStyle): T - export function flatten(style?: StyleProp): TextStyle - export function flatten(style?: StyleProp): ImageStyle - export function flatten(style?: StyleProp): ViewStyle - - /** - * WARNING: EXPERIMENTAL. Breaking changes will probably happen a lot and will - * not be reliably announced. The whole thing might be deleted, who knows? Use - * at your own risk. - * - * Sets a function to use to pre-process a style property value. This is used - * internally to process color and transform values. You should not use this - * unless you really know what you are doing and have exhausted other options. - */ - export function setStyleAttributePreprocessor(property: string, process: (nextProp: any) => any): void - - /** - * This is defined as the width of a thin line on the platform. It can be - * used as the thickness of a border or division between two elements. - * Example: - * ``` - * { - * borderBottomColor: '#bbb', - * borderBottomWidth: StyleSheet.hairlineWidth - * } - * ``` - * - * This constant will always be a round number of pixels (so a line defined - * by it look crisp) and will try to match the standard width of a thin line - * on the underlying platform. However, you should not rely on it being a - * constant size, because on different platforms and screen densities its - * value may be calculated differently. - */ - export const hairlineWidth: number - - interface AbsoluteFillStyle { - position: 'absolute' - left: 0 - right: 0 - top: 0 - bottom: 0 - } - - /** - * Sometimes you may want `absoluteFill` but with a couple tweaks - `absoluteFillObject` can be - * used to create a customized entry in a `StyleSheet`, e.g.: - * - * const styles = StyleSheet.create({ - * wrapper: { - * ...StyleSheet.absoluteFillObject, - * top: 10, - * backgroundColor: 'transparent', - * }, - * }); - */ - export const absoluteFillObject: AbsoluteFillStyle - - /** - * A very common pattern is to create overlays with position absolute and zero positioning, - * so `absoluteFill` can be used for convenience and to reduce duplication of these repeated - * styles. - */ - export const absoluteFill: RegisteredStyle -} + /** + * Used to extract a unique key for a given item at the specified index. Key is used for caching + * and as the react key to track item re-ordering. The default extractor checks `item.key`, then + * falls back to using the index, like React does. + */ + keyExtractor?: (item: ItemT, index: number) => string; -export interface RelayProfiler { - attachProfileHandler(name: string, handler: (name: string, state?: any) => () => void): void + /** + * Called once when the scroll position gets within onEndReachedThreshold of the rendered content. + */ + onEndReached?: ((info: { distanceFromEnd: number }) => void) | null; - attachAggregateHandler(name: string, handler: (name: string, callback: () => void) => void): void -} + /** + * How far from the end (in units of visible length of the list) the bottom edge of the + * list must be from the end of the content to trigger the `onEndReached` callback. + * Thus a value of 0.5 will trigger `onEndReached` when the end of the content is + * within half the visible length of the list. + */ + onEndReachedThreshold?: number | null; -export interface SystraceStatic { - setEnabled(enabled: boolean): void - - /** - * beginEvent/endEvent for starting and then ending a profile within the same call stack frame - **/ - beginEvent(profileName?: any, args?: any): void - endEvent(): void - - /** - * beginAsyncEvent/endAsyncEvent for starting and then ending a profile where the end can either - * occur on another thread or out of the current stack frame, eg await - * the returned cookie variable should be used as input into the endAsyncEvent call to end the profile - **/ - beginAsyncEvent(profileName?: any): any - endAsyncEvent(profileName?: any, cookie?: any): void - - /** - * counterEvent registers the value to the profileName on the systrace timeline - **/ - counterEvent(profileName?: any, value?: any): void - - /** - * Relay profiles use await calls, so likely occur out of current stack frame - * therefore async variant of profiling is used - **/ - attachToRelayProfiler(relayProfiler: RelayProfiler): void - - /* This is not called by default due to perf overhead but it's useful - if you want to find traces which spend too much time in JSON. */ - swizzleJSON(): void + /** + * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. + * Make sure to also set the refreshing prop correctly. + */ + onRefresh?: (() => void) | null; + + /** + * Used to handle failures when scrolling to an index that has not been measured yet. + * Recommended action is to either compute your own offset and `scrollTo` it, or scroll as far + * as possible and then try again after more items have been rendered. + */ + onScrollToIndexFailed?: ( + info: { + index: number; + highestMeasuredFrameIndex: number; + averageItemLength: number; + } + ) => void; + + /** + * Set this true while waiting for new data from a refresh. + */ + refreshing?: boolean | null; + + /** + * Default renderer for every item in every section. Can be over-ridden on a per-section basis. + */ + renderItem?: SectionListRenderItem; - /** - * Measures multiple methods of a class. For example, you can do: - * Systrace.measureMethods(JSON, 'JSON', ['parse', 'stringify']); - * - * @param methodNames Map from method names to method display names. - */ - measureMethods(object: any, objectName: string, methodNames: Array): void + /** + * Rendered at the top of each section. Sticky headers are not yet supported. + */ + renderSectionHeader?: (info: { section: SectionListData }) => React.ReactElement | null; + + /** + * Rendered at the bottom of each section. + */ + renderSectionFooter?: (info: { section: SectionListData }) => React.ReactElement | null; + + /** + * An array of objects with data for each section. + */ + sections: ReadonlyArray>; + + /** + * Render a custom scroll component, e.g. with a differently styled `RefreshControl`. + */ + renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement; + + /** + * Note: may have bugs (missing content) in some circumstances - use at your own risk. + * + * This may improve scroll performance for large lists. + */ + removeClippedSubviews?: boolean; + + /** + * Makes section headers stick to the top of the screen until the next one pushes it off. + * Only enabled by default on iOS because that is the platform standard there. + */ + stickySectionHeadersEnabled?: boolean; - /** - * Returns an profiled version of the input function. For example, you can: - * JSON.parse = Systrace.measure('JSON', 'parse', JSON.parse); - * - * @return replacement function - */ - measure(objName: string, fnName: string, func: T): T + /** + * Uses legacy MetroListView instead of default VirtualizedSectionList + */ + legacyImplementation?: boolean; } -/** - * //FIXME: Could not find docs. Inferred from examples and jscode : ListViewDataSource.js - */ -export interface DataSourceAssetCallback { - rowHasChanged?: (r1: any, r2: any) => boolean - sectionHeaderHasChanged?: (h1: any, h2: any) => boolean - getRowData?: (dataBlob: any, sectionID: number | string, rowID: number | string) => any - getSectionHeaderData?: (dataBlob: any, sectionID: number | string) => any +export interface SectionListScrollParams { + animated?: boolean; + itemIndex: number; + sectionIndex: number; + viewOffset?: number; + viewPosition?: number; } -/** - * Provides efficient data processing and access to the - * `ListView` component. A `ListViewDataSource` is created with functions for - * extracting data from the input blob, and comparing elements (with default - * implementations for convenience). The input blob can be as simple as an - * array of strings, or an object with rows nested inside section objects. - * - * To update the data in the datasource, use `cloneWithRows` (or - * `cloneWithRowsAndSections` if you care about sections). The data in the - * data source is immutable, so you can't modify it directly. The clone methods - * suck in the new data and compute a diff for each row so ListView knows - * whether to re-render it or not. - */ -export interface ListViewDataSource { - /** - * You can provide custom extraction and `hasChanged` functions for section - * headers and rows. If absent, data will be extracted with the - * `defaultGetRowData` and `defaultGetSectionHeaderData` functions. - * - * The default extractor expects data of one of the following forms: - * - * { sectionID_1: { rowID_1: , ... }, ... } - * - * or - * - * { sectionID_1: [ , , ... ], ... } - * - * or - * - * [ [ , , ... ], ... ] - * - * The constructor takes in a params argument that can contain any of the - * following: - * - * - getRowData(dataBlob, sectionID, rowID); - * - getSectionHeaderData(dataBlob, sectionID); - * - rowHasChanged(prevRowData, nextRowData); - * - sectionHeaderHasChanged(prevSectionData, nextSectionData); - */ - new (onAsset: DataSourceAssetCallback): ListViewDataSource - - /** - * Clones this `ListViewDataSource` with the specified `dataBlob` and - * `rowIdentities`. The `dataBlob` is just an aribitrary blob of data. At - * construction an extractor to get the interesting informatoin was defined - * (or the default was used). - * - * The `rowIdentities` is is a 2D array of identifiers for rows. - * ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's - * assumed that the keys of the section data are the row identities. - * - * Note: This function does NOT clone the data in this data source. It simply - * passes the functions defined at construction to a new data source with - * the data specified. If you wish to maintain the existing data you must - * handle merging of old and new data separately and then pass that into - * this function as the `dataBlob`. - */ - cloneWithRows( - dataBlob: Array | {[key: string]: any}, - rowIdentities?: Array - ): ListViewDataSource - - /** - * This performs the same function as the `cloneWithRows` function but here - * you also specify what your `sectionIdentities` are. If you don't care - * about sections you should safely be able to use `cloneWithRows`. - * - * `sectionIdentities` is an array of identifiers for sections. - * ie. ['s1', 's2', ...]. If not provided, it's assumed that the - * keys of dataBlob are the section identities. - * - * Note: this returns a new object! - */ - cloneWithRowsAndSections( - dataBlob: Array | {[key: string]: any}, - sectionIdentities?: Array, - rowIdentities?: Array> - ): ListViewDataSource - - getRowCount(): number - getRowAndSectionCount(): number - - /** - * Returns if the row is dirtied and needs to be rerendered - */ - rowShouldUpdate(sectionIndex: number, rowIndex: number): boolean - - /** - * Gets the data required to render the row. - */ - getRowData(sectionIndex: number, rowIndex: number): any - - /** - * Gets the rowID at index provided if the dataSource arrays were flattened, - * or null of out of range indexes. - */ - getRowIDForFlatIndex(index: number): string - - /** - * Gets the sectionID at index provided if the dataSource arrays were flattened, - * or null for out of range indexes. - */ - getSectionIDForFlatIndex(index: number): string - - /** - * Returns an array containing the number of rows in each section - */ - getSectionLengths(): Array - - /** - * Returns if the section header is dirtied and needs to be rerendered - */ - sectionHeaderShouldUpdate(sectionIndex: number): boolean - - /** - * Gets the data required to render the section header - */ - getSectionHeaderData(sectionIndex: number): any +export interface SectionListStatic extends React.ComponentClass> { + /** + * Scrolls to the item at the specified sectionIndex and itemIndex (within the section) + * positioned in the viewable area such that viewPosition 0 places it at the top + * (and may be covered by a sticky header), 1 at the bottom, and 0.5 centered in the middle. + */ + scrollToLocation?(params: SectionListScrollParams): void; } /** - * @see https://facebook.github.io/react-native/docs/tabbarios-item.html#props + * @see https://facebook.github.io/react-native/docs/virtualizedlist.html#props */ -export interface TabBarIOSItemProps extends ViewProps { - /** - * Little red bubble that sits at the top right of the icon. - */ - badge?: string | number - - /** - * Background color for the badge. Available since iOS 10. - */ - badgeColor?: string - - /** - * A custom icon for the tab. It is ignored when a system icon is defined. - */ - icon?: ImageURISource - - /** - * Callback when this tab is being selected, - * you should change the state of your component to set selected={true}. - */ - onPress?: () => void - - /** - * If set to true it renders the image as original, - * it defaults to being displayed as a template - */ - renderAsOriginal?: boolean - - /** - * It specifies whether the children are visible or not. If you see a blank content, you probably forgot to add a selected one. - */ - selected?: boolean - - /** - * A custom icon when the tab is selected. - * It is ignored when a system icon is defined. If left empty, the icon will be tinted in blue. - */ - selectedIcon?: ImageURISource - - /** - * React style object. - */ - style?: StyleProp - - /** - * Items comes with a few predefined system icons. - * Note that if you are using them, the title and selectedIcon will be overriden with the system ones. - * - * enum('bookmarks', 'contacts', 'downloads', 'favorites', 'featured', 'history', 'more', 'most-recent', 'most-viewed', 'recents', 'search', 'top-rated') - */ - systemIcon?: - | 'bookmarks' - | 'contacts' - | 'downloads' - | 'favorites' - | 'featured' - | 'history' - | 'more' - | 'most-recent' - | 'most-viewed' - | 'recents' - | 'search' - | 'top-rated' - - /** - * Text that appears under the icon. It is ignored when a system icon is defined. - */ - title?: string +export interface VirtualizedListProps extends VirtualizedListWithoutRenderItemProps { + renderItem: ListRenderItem; } -export class TabBarIOSItem extends React.Component {} +export interface VirtualizedListWithoutRenderItemProps extends ScrollViewProps { + /** + * Rendered when the list is empty. Can be a React Component Class, a render function, or + * a rendered element. + */ + ListEmptyComponent?: React.ComponentType | React.ReactElement | null; + + /** + * Rendered at the bottom of all the items. Can be a React Component Class, a render function, or + * a rendered element. + */ + ListFooterComponent?: React.ComponentType | React.ReactElement | null; + + /** + * Rendered at the top of all the items. Can be a React Component Class, a render function, or + * a rendered element. + */ + ListHeaderComponent?: React.ComponentType | React.ReactElement | null; + + /** + * The default accessor functions assume this is an Array<{key: string}> but you can override + * getItem, getItemCount, and keyExtractor to handle any type of index-based data. + */ + data?: any; + + /** + * `debug` will turn on extra logging and visual overlays to aid with debugging both usage and + * implementation, but with a significant perf hit. + */ + debug?: boolean; + + /** + * DEPRECATED: Virtualization provides significant performance and memory optimizations, but fully + * unmounts react instances that are outside of the render window. You should only need to disable + * this for debugging purposes. + */ + disableVirtualization?: boolean; + + /** + * A marker property for telling the list to re-render (since it implements `PureComponent`). If + * any of your `renderItem`, Header, Footer, etc. functions depend on anything outside of the + * `data` prop, stick it here and treat it immutably. + */ + extraData?: any; + + /** + * A generic accessor for extracting an item from any sort of data blob. + */ + getItem?: (data: any, index: number) => ItemT; + + /** + * Determines how many items are in the data blob. + */ + getItemCount?: (data: any) => number; + + getItemLayout?: ( + data: any, + index: number + ) => { + length: number; + offset: number; + index: number; + }; + + horizontal?: boolean; + + /** + * How many items to render in the initial batch. This should be enough to fill the screen but not + * much more. Note these items will never be unmounted as part of the windowed rendering in order + * to improve perceived performance of scroll-to-top actions. + */ + initialNumToRender?: number; + + /** + * Instead of starting at the top with the first item, start at `initialScrollIndex`. This + * disables the "scroll to top" optimization that keeps the first `initialNumToRender` items + * always rendered and immediately renders the items starting at this initial index. Requires + * `getItemLayout` to be implemented. + */ + initialScrollIndex?: number; + + /** + * Reverses the direction of scroll. Uses scale transforms of -1. + */ + inverted?: boolean; + + keyExtractor?: (item: ItemT, index: number) => string; + + listKey?: string; + + /** + * The maximum number of items to render in each incremental render batch. The more rendered at + * once, the better the fill rate, but responsiveness my suffer because rendering content may + * interfere with responding to button taps or other interactions. + */ + maxToRenderPerBatch?: number; + + onEndReached?: ((info: { distanceFromEnd: number }) => void) | null; + + onEndReachedThreshold?: number | null; + + onLayout?: (event: LayoutChangeEvent) => void; + + /** + * If provided, a standard RefreshControl will be added for "Pull to Refresh" functionality. Make + * sure to also set the `refreshing` prop correctly. + */ + onRefresh?: (() => void) | null; + + /** + * Used to handle failures when scrolling to an index that has not been measured yet. + * Recommended action is to either compute your own offset and `scrollTo` it, or scroll as far + * as possible and then try again after more items have been rendered. + */ + onScrollToIndexFailed?: ( + info: { + index: number; + highestMeasuredFrameIndex: number; + averageItemLength: number; + } + ) => void; + + /** + * Called when the viewability of rows changes, as defined by the + * `viewabilityConfig` prop. + */ + onViewableItemsChanged?: ((info: { viewableItems: Array; changed: Array }) => void) | null; + + /** + * Set this when offset is needed for the loading indicator to show correctly. + * @platform android + */ + progressViewOffset?: number; + + /** + * Set this true while waiting for new data from a refresh. + */ + refreshing?: boolean | null; + + /** + * Note: may have bugs (missing content) in some circumstances - use at your own risk. + * + * This may improve scroll performance for large lists. + */ + removeClippedSubviews?: boolean; + + /** + * Render a custom scroll component, e.g. with a differently styled `RefreshControl`. + */ + renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement; + + /** + * Amount of time between low-pri item render batches, e.g. for rendering items quite a ways off + * screen. Similar fill rate/responsiveness tradeoff as `maxToRenderPerBatch`. + */ + updateCellsBatchingPeriod?: number; + + viewabilityConfig?: ViewabilityConfig; + + viewabilityConfigCallbackPairs?: ViewabilityConfigCallbackPairs; + + /** + * Determines the maximum number of items rendered outside of the visible area, in units of + * visible lengths. So if your list fills the screen, then `windowSize={21}` (the default) will + * render the visible screen area plus up to 10 screens above and 10 below the viewport. Reducing + * this number will reduce memory consumption and may improve performance, but will increase the + * chance that fast scrolling may reveal momentary blank areas of unrendered content. + */ + windowSize?: number; +} /** - * @see https://facebook.github.io/react-native/docs/tabbarios.html#props + * @see https://facebook.github.io/react-native/docs/listview.html#props */ -export interface TabBarIOSProps extends ViewProps { - /** - * Background color of the tab bar - */ - barTintColor?: string - - /** - * Specifies tab bar item positioning. Available values are: - * - fill - distributes items across the entire width of the tab bar - * - center - centers item in the available tab bar space - * - auto (default) - distributes items dynamically according to the - * user interface idiom. In a horizontally compact environment (e.g. iPhone 5) - * this value defaults to `fill`, in a horizontally regular one (e.g. iPad) - * it defaults to center. - */ - itemPositioning?: 'fill' | 'center' | 'auto' - - /** - * Color of the currently selected tab icon - */ - tintColor?: string - - /** - * A Boolean value that indicates whether the tab bar is translucent - */ - translucent?: boolean - - /** - * Color of text on unselected tabs - */ - unselectedTintColor?: string - - /** - * Color of unselected tab icons. Available since iOS 10. - */ - unselectedItemTintColor?: string -} +export interface ListViewProps extends ScrollViewProps { + /** + * An instance of [ListView.DataSource](docs/listviewdatasource.html) to use + */ + dataSource: ListViewDataSource; -export class TabBarIOS extends React.Component { - static Item: typeof TabBarIOSItem -} + /** + * Flag indicating whether empty section headers should be rendered. + * In the future release empty section headers will be rendered by + * default, and the flag will be deprecated. If empty sections are not + * desired to be rendered their indices should be excluded from + * sectionID object. + */ + enableEmptySections?: boolean; -export interface PixelRatioStatic { - /* - Returns the device pixel density. Some examples: - PixelRatio.get() === 1 - mdpi Android devices (160 dpi) - PixelRatio.get() === 1.5 - hdpi Android devices (240 dpi) - PixelRatio.get() === 2 - iPhone 4, 4S - iPhone 5, 5c, 5s - iPhone 6 - xhdpi Android devices (320 dpi) - PixelRatio.get() === 3 - iPhone 6 plus - xxhdpi Android devices (480 dpi) - PixelRatio.get() === 3.5 - Nexus 6 - */ - get(): number + /** + * How many rows to render on initial component mount. Use this to make + * it so that the first screen worth of data apears at one time instead of + * over the course of multiple frames. + */ + initialListSize?: number; - /* - Returns the scaling factor for font sizes. This is the ratio that is - used to calculate the absolute font size, so any elements that - heavily depend on that should use this to do calculations. + /** + * (visibleRows, changedRows) => void + * + * Called when the set of visible rows changes. `visibleRows` maps + * { sectionID: { rowID: true }} for all the visible rows, and + * `changedRows` maps { sectionID: { rowID: true | false }} for the rows + * that have changed their visibility, with true indicating visible, and + * false indicating the view has moved out of view. + */ + onChangeVisibleRows?: ( + visibleRows: Array<{ [sectionId: string]: { [rowID: string]: boolean } }>, + changedRows: Array<{ [sectionId: string]: { [rowID: string]: boolean } }> + ) => void; - If a font scale is not set, this returns the device pixel ratio. + /** + * Called when all rows have been rendered and the list has been scrolled + * to within onEndReachedThreshold of the bottom. The native scroll + * event is provided. + */ + onEndReached?: () => void; - Currently this is only implemented on Android and reflects the user - preference set in Settings > Display > Font size, - on iOS it will always return the default pixel ratio. - */ - getFontScale(): number + /** + * Threshold in pixels for onEndReached. + */ + onEndReachedThreshold?: number; + + /** + * Number of rows to render per event loop. + */ + pageSize?: number; + + /** + * A performance optimization for improving scroll perf of + * large lists, used in conjunction with overflow: 'hidden' on the row + * containers. Use at your own risk. + */ + removeClippedSubviews?: boolean; + + /** + * () => renderable + * + * The header and footer are always rendered (if these props are provided) + * on every render pass. If they are expensive to re-render, wrap them + * in StaticContainer or other mechanism as appropriate. Footer is always + * at the bottom of the list, and header at the top, on every render pass. + */ + renderFooter?: () => React.ReactElement; + + /** + * () => renderable + * + * The header and footer are always rendered (if these props are provided) + * on every render pass. If they are expensive to re-render, wrap them + * in StaticContainer or other mechanism as appropriate. Footer is always + * at the bottom of the list, and header at the top, on every render pass. + */ + renderHeader?: () => React.ReactElement; + + /** + * (rowData, sectionID, rowID) => renderable + * Takes a data entry from the data source and its ids and should return + * a renderable component to be rendered as the row. By default the data + * is exactly what was put into the data source, but it's also possible to + * provide custom extractors. + */ + renderRow: ( + rowData: any, + sectionID: string | number, + rowID: string | number, + highlightRow?: boolean + ) => React.ReactElement; + + /** + * A function that returns the scrollable component in which the list rows are rendered. + * Defaults to returning a ScrollView with the given props. + */ + renderScrollComponent?: (props: ScrollViewProps) => React.ReactElement; + + /** + * (sectionData, sectionID) => renderable + * + * If provided, a sticky header is rendered for this section. The sticky + * behavior means that it will scroll with the content at the top of the + * section until it reaches the top of the screen, at which point it will + * stick to the top until it is pushed off the screen by the next section + * header. + */ + renderSectionHeader?: (sectionData: any, sectionId: string | number) => React.ReactElement; + + /** + * (sectionID, rowID, adjacentRowHighlighted) => renderable + * If provided, a renderable component to be rendered as the separator below each row + * but not the last row if there is a section header below. + * Take a sectionID and rowID of the row above and whether its adjacent row is highlighted. + */ + renderSeparator?: ( + sectionID: string | number, + rowID: string | number, + adjacentRowHighlighted?: boolean + ) => React.ReactElement; + + /** + * How early to start rendering rows before they come on screen, in + * pixels. + */ + scrollRenderAheadDistance?: number; + + /** + * An array of child indices determining which children get docked to the + * top of the screen when scrolling. For example, passing + * `stickyHeaderIndices={[0]}` will cause the first child to be fixed to the + * top of the scroll view. This property is not supported in conjunction + * with `horizontal={true}`. + * @platform ios + */ + stickyHeaderIndices?: number[]; + + /** + * Makes the sections headers sticky. The sticky behavior means that it will scroll with the + * content at the top of the section until it reaches the top of the screen, at which point it + * will stick to the top until it is pushed off the screen by the next section header. This + * property is not supported in conjunction with `horizontal={true}`. Only enabled by default + * on iOS because of typical platform standards. + */ + stickySectionHeadersEnabled?: boolean; +} + +interface TimerMixin { + setTimeout: typeof setTimeout; + clearTimeout: typeof clearTimeout; + setInterval: typeof setInterval; + clearInterval: typeof clearInterval; + setImmediate: typeof setImmediate; + clearImmediate: typeof clearImmediate; + requestAnimationFrame: typeof requestAnimationFrame; + cancelAnimationFrame: typeof cancelAnimationFrame; +} + +declare class ListViewComponent extends React.Component {} +declare const ListViewBase: Constructor & Constructor & typeof ListViewComponent; +export class ListView extends ListViewBase { + static DataSource: ListViewDataSource; + + /** + * Exports some data, e.g. for perf investigations or analytics. + */ + getMetrics: () => { + contentLength: number; + totalRows: number; + renderedRows: number; + visibleRows: number; + }; + + /** + * Provides a handle to the underlying scroll responder. + */ + getScrollResponder: () => any; + + /** + * Scrolls to a given x, y offset, either immediately or with a smooth animation. + * + * See `ScrollView#scrollTo`. + */ + scrollTo: (y?: number | { x?: number; y?: number; animated?: boolean }, x?: number, animated?: boolean) => void; +} + +interface MaskedViewIOSProps extends ViewProps { + maskElement: React.ReactElement; +} + +/** + * @see https://facebook.github.io/react-native/docs/maskedviewios.html + */ +declare class MaskedViewComponent extends React.Component {} +declare const MaskedViewBase: Constructor & typeof MaskedViewComponent; +export class MaskedViewIOS extends MaskedViewBase {} + +export interface ModalBaseProps { + // Only `animated` is documented. The JS code says `animated` is + // deprecated and `animationType` is preferred. + animated?: boolean; + /** + * The `animationType` prop controls how the modal animates. + * + * - `slide` slides in from the bottom + * - `fade` fades into view + * - `none` appears without an animation + */ + animationType?: "none" | "slide" | "fade"; + /** + * The `transparent` prop determines whether your modal will fill the entire view. + * Setting this to `true` will render the modal over a transparent background. + */ + transparent?: boolean; + /** + * The `visible` prop determines whether your modal is visible. + */ + visible?: boolean; + /** + * The `onRequestClose` prop allows passing a function that will be called once the modal has been dismissed. + * _On the Android platform, this is a required function._ + */ + onRequestClose?: () => void; + /** + * The `onShow` prop allows passing a function that will be called once the modal has been shown. + */ + onShow?: (event: NativeSyntheticEvent) => void; +} + +export interface ModalPropsIOS { + /** + * The `presentationStyle` determines the style of modal to show + */ + presentationStyle?: "fullScreen" | "pageSheet" | "formSheet" | "overFullScreen"; + + /** + * The `supportedOrientations` prop allows the modal to be rotated to any of the specified orientations. + * On iOS, the modal is still restricted by what's specified in your app's Info.plist's UISupportedInterfaceOrientations field. + */ + supportedOrientations?: Array< + "portrait" | "portrait-upside-down" | "landscape" | "landscape-left" | "landscape-right" + >; + + /** + * The `onDismiss` prop allows passing a function that will be called once the modal has been dismissed. + */ + onDismiss?: () => void; + + /** + * The `onOrientationChange` callback is called when the orientation changes while the modal is being displayed. + * The orientation provided is only 'portrait' or 'landscape'. This callback is also called on initial render, regardless of the current orientation. + */ + onOrientationChange?: (event: NativeSyntheticEvent) => void; +} + +export interface ModalPropsAndroid { + /** + * Controls whether to force hardware acceleration for the underlying window. + */ + hardwareAccelerated?: boolean; +} + +export type ModalProps = ModalBaseProps & ModalPropsIOS & ModalPropsAndroid; + +export class Modal extends React.Component {} + +/** + * @see https://github.com/facebook/react-native/blob/0.34-stable\Libraries\Components\Touchable\Touchable.js + */ +interface TouchableMixin { + /** + * Invoked when the item should be highlighted. Mixers should implement this + * to visually distinguish the `VisualRect` so that the user knows that + * releasing a touch will result in a "selection" (analog to click). + */ + touchableHandleActivePressIn(e: GestureResponderEvent): void; + + /** + * Invoked when the item is "active" (in that it is still eligible to become + * a "select") but the touch has left the `PressRect`. Usually the mixer will + * want to unhighlight the `VisualRect`. If the user (while pressing) moves + * back into the `PressRect` `touchableHandleActivePressIn` will be invoked + * again and the mixer should probably highlight the `VisualRect` again. This + * event will not fire on an `touchEnd/mouseUp` event, only move events while + * the user is depressing the mouse/touch. + */ + touchableHandleActivePressOut(e: GestureResponderEvent): void; + + /** + * Invoked when the item is "selected" - meaning the interaction ended by + * letting up while the item was either in the state + * `RESPONDER_ACTIVE_PRESS_IN` or `RESPONDER_INACTIVE_PRESS_IN`. + */ + touchableHandlePress(e: GestureResponderEvent): void; + + /** + * Invoked when the item is long pressed - meaning the interaction ended by + * letting up while the item was in `RESPONDER_ACTIVE_LONG_PRESS_IN`. If + * `touchableHandleLongPress` is *not* provided, `touchableHandlePress` will + * be called as it normally is. If `touchableHandleLongPress` is provided, by + * default any `touchableHandlePress` callback will not be invoked. To + * override this default behavior, override `touchableLongPressCancelsPress` + * to return false. As a result, `touchableHandlePress` will be called when + * lifting up, even if `touchableHandleLongPress` has also been called. + */ + touchableHandleLongPress(e: GestureResponderEvent): void; + + /** + * Returns the amount to extend the `HitRect` into the `PressRect`. Positive + * numbers mean the size expands outwards. + */ + touchableGetPressRectOffset(): Insets; + + /** + * Returns the number of millis to wait before triggering a highlight. + */ + touchableGetHighlightDelayMS(): number; + + // These methods are undocumented but still being used by TouchableMixin internals + touchableGetLongPressDelayMS(): number; + touchableGetPressOutDelayMS(): number; + touchableGetHitSlop(): Insets; +} + +export interface TouchableWithoutFeedbackPropsIOS { + /** + * *(Apple TV only)* TV preferred focus (see documentation for the View component). + * + * @platform ios + */ + hasTVPreferredFocus?: boolean; + + /** + * *(Apple TV only)* Object with properties to control Apple TV parallax effects. + * + * enabled: If true, parallax effects are enabled. Defaults to true. + * shiftDistanceX: Defaults to 2.0. + * shiftDistanceY: Defaults to 2.0. + * tiltAngle: Defaults to 0.05. + * magnification: Defaults to 1.0. + * pressMagnification: Defaults to 1.0. + * pressDuration: Defaults to 0.3. + * pressDelay: Defaults to 0.0. + * + * @platform ios + */ + tvParallaxProperties?: TVParallaxProperties; +} + +/** + * @see https://facebook.github.io/react-native/docs/touchablewithoutfeedback.html#props + */ +export interface TouchableWithoutFeedbackProps extends TouchableWithoutFeedbackPropsIOS, AccessibilityProps { + /** + * Delay in ms, from onPressIn, before onLongPress is called. + */ + delayLongPress?: number; + + /** + * Delay in ms, from the start of the touch, before onPressIn is called. + */ + delayPressIn?: number; + + /** + * Delay in ms, from the release of the touch, before onPressOut is called. + */ + delayPressOut?: number; + + /** + * If true, disable all interactions for this component. + */ + disabled?: boolean; + + /** + * This defines how far your touch can start away from the button. + * This is added to pressRetentionOffset when moving off of the button. + * NOTE The touch area never extends past the parent view bounds and + * the Z-index of sibling views always takes precedence if a touch hits + * two overlapping views. + */ + hitSlop?: Insets; + + /** + * When `accessible` is true (which is the default) this may be called when + * the OS-specific concept of "blur" occurs, meaning the element lost focus. + * Some platforms may not have the concept of blur. + */ + onBlur?: (e: NativeSyntheticEvent) => void; + + /** + * When `accessible` is true (which is the default) this may be called when + * the OS-specific concept of "focus" occurs. Some platforms may not have + * the concept of focus. + */ + onFocus?: (e: NativeSyntheticEvent) => void; + + /** + * Invoked on mount and layout changes with + * {nativeEvent: {layout: {x, y, width, height}}} + */ + onLayout?: (event: LayoutChangeEvent) => void; + + onLongPress?: (event: GestureResponderEvent) => void; + + /** + * Called when the touch is released, + * but not if cancelled (e.g. by a scroll that steals the responder lock). + */ + onPress?: (event: GestureResponderEvent) => void; + + onPressIn?: (event: GestureResponderEvent) => void; + + onPressOut?: (event: GestureResponderEvent) => void; + + /** + * //FIXME: not in doc but available in examples + */ + style?: StyleProp; + + /** + * When the scroll view is disabled, this defines how far your + * touch may move off of the button, before deactivating the button. + * Once deactivated, try moving it back and you'll see that the button + * is once again reactivated! Move it back and forth several times + * while the scroll view is disabled. Ensure you pass in a constant + * to reduce memory allocations. + */ + pressRetentionOffset?: Insets; + + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; +} + +/** + * Do not use unless you have a very good reason. + * All the elements that respond to press should have a visual feedback when touched. + * This is one of the primary reason a "web" app doesn't feel "native". + * + * @see https://facebook.github.io/react-native/docs/touchablewithoutfeedback.html + */ +declare class TouchableWithoutFeedbackComponent extends React.Component {} +declare const TouchableWithoutFeedbackBase: Constructor & + Constructor & + typeof TouchableWithoutFeedbackComponent; +export class TouchableWithoutFeedback extends TouchableWithoutFeedbackBase {} + +/** + * @see https://facebook.github.io/react-native/docs/touchablehighlight.html#props + */ +export interface TouchableHighlightProps extends TouchableWithoutFeedbackProps { + /** + * Determines what the opacity of the wrapped view should be when touch is active. + */ + activeOpacity?: number; + + /** + * + * Called immediately after the underlay is hidden + */ + onHideUnderlay?: () => void; + + /** + * Called immediately after the underlay is shown + */ + onShowUnderlay?: () => void; + + /** + * @see https://facebook.github.io/react-native/docs/view.html#style + */ + style?: StyleProp; + + /** + * The color of the underlay that will show through when the touch is active. + */ + underlayColor?: string; +} + +/** + * A wrapper for making views respond properly to touches. + * On press down, the opacity of the wrapped view is decreased, + * which allows the underlay color to show through, darkening or tinting the view. + * The underlay comes from adding a view to the view hierarchy, + * which can sometimes cause unwanted visual artifacts if not used correctly, + * for example if the backgroundColor of the wrapped view isn't explicitly set to an opaque color. + * + * NOTE: TouchableHighlight supports only one child + * If you wish to have several child components, wrap them in a View. + * + * @see https://facebook.github.io/react-native/docs/touchablehighlight.html + */ +declare class TouchableHighlightComponent extends React.Component {} +declare const TouchableHighlightBase: Constructor & + Constructor & + Constructor & + typeof TouchableHighlightComponent; +export class TouchableHighlight extends TouchableHighlightBase {} + +/** + * @see https://facebook.github.io/react-native/docs/touchableopacity.html#props + */ +export interface TouchableOpacityProps extends TouchableWithoutFeedbackProps { + /** + * Determines what the opacity of the wrapped view should be when touch is active. + * Defaults to 0.2 + */ + activeOpacity?: number; +} + +/** + * A wrapper for making views respond properly to touches. + * On press down, the opacity of the wrapped view is decreased, dimming it. + * This is done without actually changing the view hierarchy, + * and in general is easy to add to an app without weird side-effects. + * + * @see https://facebook.github.io/react-native/docs/touchableopacity.html + */ +declare class TouchableOpacityComponent extends React.Component {} +declare const TouchableOpacityBase: Constructor & + Constructor & + Constructor & + typeof TouchableOpacityComponent; +export class TouchableOpacity extends TouchableOpacityBase { + /** + * Animate the touchable to a new opacity. + */ + setOpacityTo: (value: number) => void; +} + +interface BaseBackgroundPropType { + type: string; +} + +interface RippleBackgroundPropType extends BaseBackgroundPropType { + type: "RippleAndroid"; + color?: number; + borderless?: boolean; +} + +interface ThemeAttributeBackgroundPropType extends BaseBackgroundPropType { + type: "ThemeAttrAndroid"; + attribute: string; +} + +type BackgroundPropType = RippleBackgroundPropType | ThemeAttributeBackgroundPropType; + +/** + * @see https://facebook.github.io/react-native/docs/touchableopacity.html#props + */ +export interface TouchableNativeFeedbackProps extends TouchableWithoutFeedbackProps { + /** + * Determines the type of background drawable that's going to be used to display feedback. + * It takes an object with type property and extra data depending on the type. + * It's recommended to use one of the following static methods to generate that dictionary: + * 1) TouchableNativeFeedback.SelectableBackground() - will create object that represents android theme's + * default background for selectable elements (?android:attr/selectableItemBackground) + * 2) TouchableNativeFeedback.SelectableBackgroundBorderless() - will create object that represent android + * theme's default background for borderless selectable elements + * (?android:attr/selectableItemBackgroundBorderless). Available on android API level 21+ + * 3) TouchableNativeFeedback.Ripple(color, borderless) - will create object that represents ripple drawable + * with specified color (as a string). If property borderless evaluates to true the ripple will render + * outside of the view bounds (see native actionbar buttons as an example of that behavior). This background + * type is available on Android API level 21+ + */ + background?: BackgroundPropType; + useForeground?: boolean; +} + +/** + * A wrapper for making views respond properly to touches (Android only). + * On Android this component uses native state drawable to display touch feedback. + * At the moment it only supports having a single View instance as a child node, + * as it's implemented by replacing that View with another instance of RCTView node with some additional properties set. + * + * Background drawable of native feedback touchable can be customized with background property. + * + * @see https://facebook.github.io/react-native/docs/touchablenativefeedback.html#content + */ +declare class TouchableNativeFeedbackComponent extends React.Component {} +declare const TouchableNativeFeedbackBase: Constructor & typeof TouchableNativeFeedbackComponent; +export class TouchableNativeFeedback extends TouchableNativeFeedbackBase { + /** + * Creates an object that represents android theme's default background for + * selectable elements (?android:attr/selectableItemBackground). + */ + static SelectableBackground(): ThemeAttributeBackgroundPropType; + + /** + * Creates an object that represent android theme's default background for borderless + * selectable elements (?android:attr/selectableItemBackgroundBorderless). + * Available on android API level 21+. + */ + static SelectableBackgroundBorderless(): ThemeAttributeBackgroundPropType; + + /** + * Creates an object that represents ripple drawable with specified color (as a + * string). If property `borderless` evaluates to true the ripple will + * render outside of the view bounds (see native actionbar buttons as an + * example of that behavior). This background type is available on Android + * API level 21+. + * + * @param color The ripple color + * @param borderless If the ripple can render outside it's bounds + */ + static Ripple(color: string, borderless?: boolean): RippleBackgroundPropType; + static canUseNativeForeground(): boolean; +} + +export interface Route { + component?: React.ComponentType; + id?: string; + title?: string; + passProps?: Object; + + //anything else + [key: string]: any; + + //Commonly found properties + backButtonTitle?: string; + content?: string; + message?: string; + index?: number; + onRightButtonPress?: () => void; + rightButtonTitle?: string; + wrapperStyle?: any; +} + +interface InteractionMixin { + createInteractionHandle(): number; + clearInteractionHandle(clearHandle: number): void; + /** + * Schedule work for after all interactions have completed. + * + */ + runAfterInteractions(callback: () => any): void; +} + +interface SubscribableMixin { + /** + * Special form of calling `addListener` that *guarantees* that a + * subscription *must* be tied to a component instance, and therefore will + * be cleaned up when the component is unmounted. It is impossible to create + * the subscription and pass it in - this method must be the one to create + * the subscription and therefore can guarantee it is retained in a way that + * will be cleaned up. + * + * @param eventEmitter emitter to subscribe to. + * @param eventType Type of event to listen to. + * @param listener Function to invoke when event occurs. + * @param context Object to use as listener context. + */ + addListenerOn(eventEmitter: any, eventType: string, listener: () => any, context: any): void; +} + +// @see https://github.com/facebook/react-native/blob/0.34-stable\Libraries\StyleSheet\StyleSheetTypes.js +export namespace StyleSheet { + type NamedStyles = { [P in keyof T]: ViewStyle | TextStyle | ImageStyle }; + + /** + * Creates a StyleSheet style reference from the given object. + */ + export function create | NamedStyles>(styles: T | NamedStyles): T; + + /** + * Flattens an array of style objects, into one aggregated style object. + * Alternatively, this method can be used to lookup IDs, returned by + * StyleSheet.register. + * + * > **NOTE**: Exercise caution as abusing this can tax you in terms of + * > optimizations. + * > + * > IDs enable optimizations through the bridge and memory in general. Refering + * > to style objects directly will deprive you of these optimizations. + * + * Example: + * ``` + * const styles = StyleSheet.create({ + * listItem: { + * flex: 1, + * fontSize: 16, + * color: 'white' + * }, + * selectedListItem: { + * color: 'green' + * } + * }); + * + * StyleSheet.flatten([styles.listItem, styles.selectedListItem]) + * // returns { flex: 1, fontSize: 16, color: 'green' } + * ``` + * Alternative use: + * ``` + * StyleSheet.flatten(styles.listItem); + * // return { flex: 1, fontSize: 16, color: 'white' } + * // Simply styles.listItem would return its ID (number) + * ``` + * This method internally uses `StyleSheetRegistry.getStyleByID(style)` + * to resolve style objects represented by IDs. Thus, an array of style + * objects (instances of StyleSheet.create), are individually resolved to, + * their respective objects, merged as one and then returned. This also explains + * the alternative use. + */ + export function flatten(style?: StyleProp): T; + + /** + * WARNING: EXPERIMENTAL. Breaking changes will probably happen a lot and will + * not be reliably announced. The whole thing might be deleted, who knows? Use + * at your own risk. + * + * Sets a function to use to pre-process a style property value. This is used + * internally to process color and transform values. You should not use this + * unless you really know what you are doing and have exhausted other options. + */ + export function setStyleAttributePreprocessor(property: string, process: (nextProp: any) => any): void; + + /** + * This is defined as the width of a thin line on the platform. It can be + * used as the thickness of a border or division between two elements. + * Example: + * ``` + * { + * borderBottomColor: '#bbb', + * borderBottomWidth: StyleSheet.hairlineWidth + * } + * ``` + * + * This constant will always be a round number of pixels (so a line defined + * by it look crisp) and will try to match the standard width of a thin line + * on the underlying platform. However, you should not rely on it being a + * constant size, because on different platforms and screen densities its + * value may be calculated differently. + */ + export const hairlineWidth: number; + + interface AbsoluteFillStyle { + position: "absolute"; + left: 0; + right: 0; + top: 0; + bottom: 0; + } + + /** + * Sometimes you may want `absoluteFill` but with a couple tweaks - `absoluteFillObject` can be + * used to create a customized entry in a `StyleSheet`, e.g.: + * + * const styles = StyleSheet.create({ + * wrapper: { + * ...StyleSheet.absoluteFillObject, + * top: 10, + * backgroundColor: 'transparent', + * }, + * }); + */ + export const absoluteFillObject: AbsoluteFillStyle; + + /** + * A very common pattern is to create overlays with position absolute and zero positioning, + * so `absoluteFill` can be used for convenience and to reduce duplication of these repeated + * styles. + */ + export const absoluteFill: RegisteredStyle; +} + +export interface RelayProfiler { + attachProfileHandler(name: string, handler: (name: string, state?: any) => () => void): void; + + attachAggregateHandler(name: string, handler: (name: string, callback: () => void) => void): void; +} + +export interface SystraceStatic { + setEnabled(enabled: boolean): void; + + /** + * beginEvent/endEvent for starting and then ending a profile within the same call stack frame + **/ + beginEvent(profileName?: any, args?: any): void; + endEvent(): void; + + /** + * beginAsyncEvent/endAsyncEvent for starting and then ending a profile where the end can either + * occur on another thread or out of the current stack frame, eg await + * the returned cookie variable should be used as input into the endAsyncEvent call to end the profile + **/ + beginAsyncEvent(profileName?: any): any; + endAsyncEvent(profileName?: any, cookie?: any): void; + + /** + * counterEvent registers the value to the profileName on the systrace timeline + **/ + counterEvent(profileName?: any, value?: any): void; + + /** + * Relay profiles use await calls, so likely occur out of current stack frame + * therefore async variant of profiling is used + **/ + attachToRelayProfiler(relayProfiler: RelayProfiler): void; + + /* This is not called by default due to perf overhead but it's useful + if you want to find traces which spend too much time in JSON. */ + swizzleJSON(): void; + + /** + * Measures multiple methods of a class. For example, you can do: + * Systrace.measureMethods(JSON, 'JSON', ['parse', 'stringify']); + * + * @param methodNames Map from method names to method display names. + */ + measureMethods(object: any, objectName: string, methodNames: Array): void; + + /** + * Returns an profiled version of the input function. For example, you can: + * JSON.parse = Systrace.measure('JSON', 'parse', JSON.parse); + * + * @return replacement function + */ + measure(objName: string, fnName: string, func: T): T; +} + +/** + * //FIXME: Could not find docs. Inferred from examples and jscode : ListViewDataSource.js + */ +export interface DataSourceAssetCallback { + rowHasChanged?: (r1: any, r2: any) => boolean; + sectionHeaderHasChanged?: (h1: any, h2: any) => boolean; + getRowData?: (dataBlob: any, sectionID: number | string, rowID: number | string) => any; + getSectionHeaderData?: (dataBlob: any, sectionID: number | string) => any; +} + +/** + * Provides efficient data processing and access to the + * `ListView` component. A `ListViewDataSource` is created with functions for + * extracting data from the input blob, and comparing elements (with default + * implementations for convenience). The input blob can be as simple as an + * array of strings, or an object with rows nested inside section objects. + * + * To update the data in the datasource, use `cloneWithRows` (or + * `cloneWithRowsAndSections` if you care about sections). The data in the + * data source is immutable, so you can't modify it directly. The clone methods + * suck in the new data and compute a diff for each row so ListView knows + * whether to re-render it or not. + */ +export interface ListViewDataSource { + /** + * You can provide custom extraction and `hasChanged` functions for section + * headers and rows. If absent, data will be extracted with the + * `defaultGetRowData` and `defaultGetSectionHeaderData` functions. + * + * The default extractor expects data of one of the following forms: + * + * { sectionID_1: { rowID_1: , ... }, ... } + * + * or + * + * { sectionID_1: [ , , ... ], ... } + * + * or + * + * [ [ , , ... ], ... ] + * + * The constructor takes in a params argument that can contain any of the + * following: + * + * - getRowData(dataBlob, sectionID, rowID); + * - getSectionHeaderData(dataBlob, sectionID); + * - rowHasChanged(prevRowData, nextRowData); + * - sectionHeaderHasChanged(prevSectionData, nextSectionData); + */ + new (onAsset: DataSourceAssetCallback): ListViewDataSource; + + /** + * Clones this `ListViewDataSource` with the specified `dataBlob` and + * `rowIdentities`. The `dataBlob` is just an aribitrary blob of data. At + * construction an extractor to get the interesting informatoin was defined + * (or the default was used). + * + * The `rowIdentities` is is a 2D array of identifiers for rows. + * ie. [['a1', 'a2'], ['b1', 'b2', 'b3'], ...]. If not provided, it's + * assumed that the keys of the section data are the row identities. + * + * Note: This function does NOT clone the data in this data source. It simply + * passes the functions defined at construction to a new data source with + * the data specified. If you wish to maintain the existing data you must + * handle merging of old and new data separately and then pass that into + * this function as the `dataBlob`. + */ + cloneWithRows( + dataBlob: Array | { [key: string]: any }, + rowIdentities?: Array + ): ListViewDataSource; + + /** + * This performs the same function as the `cloneWithRows` function but here + * you also specify what your `sectionIdentities` are. If you don't care + * about sections you should safely be able to use `cloneWithRows`. + * + * `sectionIdentities` is an array of identifiers for sections. + * ie. ['s1', 's2', ...]. If not provided, it's assumed that the + * keys of dataBlob are the section identities. + * + * Note: this returns a new object! + */ + cloneWithRowsAndSections( + dataBlob: Array | { [key: string]: any }, + sectionIdentities?: Array, + rowIdentities?: Array> + ): ListViewDataSource; + + getRowCount(): number; + getRowAndSectionCount(): number; + + /** + * Returns if the row is dirtied and needs to be rerendered + */ + rowShouldUpdate(sectionIndex: number, rowIndex: number): boolean; + + /** + * Gets the data required to render the row. + */ + getRowData(sectionIndex: number, rowIndex: number): any; + + /** + * Gets the rowID at index provided if the dataSource arrays were flattened, + * or null of out of range indexes. + */ + getRowIDForFlatIndex(index: number): string; + + /** + * Gets the sectionID at index provided if the dataSource arrays were flattened, + * or null for out of range indexes. + */ + getSectionIDForFlatIndex(index: number): string; + + /** + * Returns an array containing the number of rows in each section + */ + getSectionLengths(): Array; + + /** + * Returns if the section header is dirtied and needs to be rerendered + */ + sectionHeaderShouldUpdate(sectionIndex: number): boolean; + + /** + * Gets the data required to render the section header + */ + getSectionHeaderData(sectionIndex: number): any; +} + +/** + * @see https://facebook.github.io/react-native/docs/tabbarios-item.html#props + */ +export interface TabBarIOSItemProps extends ViewProps { + /** + * Little red bubble that sits at the top right of the icon. + */ + badge?: string | number; + + /** + * Background color for the badge. Available since iOS 10. + */ + badgeColor?: string; + + /** + * A custom icon for the tab. It is ignored when a system icon is defined. + */ + icon?: ImageURISource; + + /** + * Callback when this tab is being selected, + * you should change the state of your component to set selected={true}. + */ + onPress?: () => void; + + /** + * If set to true it renders the image as original, + * it defaults to being displayed as a template + */ + renderAsOriginal?: boolean; + + /** + * It specifies whether the children are visible or not. If you see a blank content, you probably forgot to add a selected one. + */ + selected?: boolean; + + /** + * A custom icon when the tab is selected. + * It is ignored when a system icon is defined. If left empty, the icon will be tinted in blue. + */ + selectedIcon?: ImageURISource; + + /** + * React style object. + */ + style?: StyleProp; + + /** + * Items comes with a few predefined system icons. + * Note that if you are using them, the title and selectedIcon will be overriden with the system ones. + * + * enum('bookmarks', 'contacts', 'downloads', 'favorites', 'featured', 'history', 'more', 'most-recent', 'most-viewed', 'recents', 'search', 'top-rated') + */ + systemIcon?: + | "bookmarks" + | "contacts" + | "downloads" + | "favorites" + | "featured" + | "history" + | "more" + | "most-recent" + | "most-viewed" + | "recents" + | "search" + | "top-rated"; + + /** + * Text that appears under the icon. It is ignored when a system icon is defined. + */ + title?: string; +} + +export class TabBarIOSItem extends React.Component {} + +/** + * @see https://facebook.github.io/react-native/docs/tabbarios.html#props + */ +export interface TabBarIOSProps extends ViewProps { + /** + * Background color of the tab bar + */ + barTintColor?: string; + + /** + * Specifies tab bar item positioning. Available values are: + * - fill - distributes items across the entire width of the tab bar + * - center - centers item in the available tab bar space + * - auto (default) - distributes items dynamically according to the + * user interface idiom. In a horizontally compact environment (e.g. iPhone 5) + * this value defaults to `fill`, in a horizontally regular one (e.g. iPad) + * it defaults to center. + */ + itemPositioning?: "fill" | "center" | "auto"; + + /** + * Color of the currently selected tab icon + */ + tintColor?: string; + + /** + * A Boolean value that indicates whether the tab bar is translucent + */ + translucent?: boolean; + + /** + * Color of text on unselected tabs + */ + unselectedTintColor?: string; + + /** + * Color of unselected tab icons. Available since iOS 10. + */ + unselectedItemTintColor?: string; +} + +export class TabBarIOS extends React.Component { + static Item: typeof TabBarIOSItem; +} + +export interface PixelRatioStatic { + /* + Returns the device pixel density. Some examples: + PixelRatio.get() === 1 + mdpi Android devices (160 dpi) + PixelRatio.get() === 1.5 + hdpi Android devices (240 dpi) + PixelRatio.get() === 2 + iPhone 4, 4S + iPhone 5, 5c, 5s + iPhone 6 + xhdpi Android devices (320 dpi) + PixelRatio.get() === 3 + iPhone 6 plus + xxhdpi Android devices (480 dpi) + PixelRatio.get() === 3.5 + Nexus 6 + */ + get(): number; + + /* + Returns the scaling factor for font sizes. This is the ratio that is + used to calculate the absolute font size, so any elements that + heavily depend on that should use this to do calculations. + + If a font scale is not set, this returns the device pixel ratio. + + Currently this is only implemented on Android and reflects the user + preference set in Settings > Display > Font size, + on iOS it will always return the default pixel ratio. + */ + getFontScale(): number; + + /** + * Converts a layout size (dp) to pixel size (px). + * Guaranteed to return an integer number. + */ + getPixelSizeForLayoutSize(layoutSize: number): number; + + /** + * Rounds a layout size (dp) to the nearest layout size that + * corresponds to an integer number of pixels. For example, + * on a device with a PixelRatio of 3, + * PixelRatio.roundToNearestPixel(8.4) = 8.33, + * which corresponds to exactly (8.33 * 3) = 25 pixels. + */ + roundToNearestPixel(layoutSize: number): number; + + /** + * No-op for iOS, but used on the web. Should not be documented. [sic] + */ + startDetecting(): void; +} + +/** + * @see https://facebook.github.io/react-native/docs/platform-specific-code.html#content + */ +export type PlatformOSType = "ios" | "android" | "macos" | "windows" | "web"; + +interface PlatformStatic { + isTV: boolean; + Version: number | string; + + /** + * @see https://facebook.github.io/react-native/docs/platform-specific-code.html#content + */ + select(specifics: { [platform in PlatformOSType | "default"]?: T }): T; +} + +interface PlatformIOSStatic extends PlatformStatic { + OS: 'ios'; + isPad: boolean; + isTVOS: boolean; +} + +interface PlatformAndroidStatic extends PlatformStatic { + OS: 'android'; +} + +interface PlatformMacOSStatic extends PlatformStatic { + OS: 'macos'; +} + +interface PlatformWindowsOSStatic extends PlatformStatic { + OS: 'windows'; +} + +interface PlatformWebStatic extends PlatformStatic { + OS: 'web'; +} + +/** + * Deprecated - subclass NativeEventEmitter to create granular event modules instead of + * adding all event listeners directly to RCTDeviceEventEmitter. + */ +interface DeviceEventEmitterStatic extends EventEmitter { + sharedSubscriber: EventSubscriptionVendor; + new (): DeviceEventEmitterStatic; + addListener(type: string, listener: (data: any) => void, context?: any): EmitterSubscription; +} + +// Used by Dimensions below +export interface ScaledSize { + width: number; + height: number; + scale: number; + fontScale: number; +} + +/** + * Initial dimensions are set before `runApplication` is called so they should + * be available before any other require's are run, but may be updated later. + * + * Note: Although dimensions are available immediately, they may change (e.g + * due to device rotation) so any rendering logic or styles that depend on + * these constants should try to call this function on every render, rather + * than caching the value (for example, using inline styles rather than + * setting a value in a `StyleSheet`). + * + * Example: `const {height, width} = Dimensions.get('window');` + * + * @param dim Name of dimension as defined when calling `set`. + * @returns Value for the dimension. + * @see https://facebook.github.io/react-native/docs/dimensions.html#content + */ +export interface Dimensions { + /** + * Initial dimensions are set before runApplication is called so they + * should be available before any other require's are run, but may be + * updated later. + * Note: Although dimensions are available immediately, they may + * change (e.g due to device rotation) so any rendering logic or + * styles that depend on these constants should try to call this + * function on every render, rather than caching the value (for + * example, using inline styles rather than setting a value in a + * StyleSheet). + * Example: const {height, width} = Dimensions.get('window'); + @param dim Name of dimension as defined when calling set. + @returns Value for the dimension. + */ + get(dim: "window" | "screen"): ScaledSize; + + /** + * This should only be called from native code by sending the didUpdateDimensions event. + * @param dims Simple string-keyed object of dimensions to set + */ + set(dims: { [key: string]: any }): void; + + /** + * Add an event listener for dimension changes + * + * @param type the type of event to listen to + * @param handler the event handler + */ + addEventListener( + type: "change", + handler: ({ window, screen }: { window: ScaledSize; screen: ScaledSize }) => void + ): void; + + /** + * Remove an event listener + * + * @param type the type of event + * @param handler the event handler + */ + removeEventListener( + type: "change", + handler: ({ window, screen }: { window: ScaledSize; screen: ScaledSize }) => void + ): void; +} + +export type SimpleTask = { + name: string; + gen: () => void; +}; +export type PromiseTask = { + name: string; + gen: () => Promise; +}; + +export type Handle = number; + +export interface InteractionManagerStatic extends EventEmitterListener { + Events: { + interactionStart: string; + interactionComplete: string; + }; + + /** + * Schedule a function to run after all interactions have completed. + * Returns a cancellable + */ + runAfterInteractions( + task?: (() => any) | SimpleTask | PromiseTask + ): { + then: (onfulfilled?: () => any, onrejected?: () => any) => Promise; + done: (...args: any[]) => any; + cancel: () => void; + }; + + /** + * Notify manager that an interaction has started. + */ + createInteractionHandle(): Handle; + + /** + * Notify manager that an interaction has completed. + */ + clearInteractionHandle(handle: Handle): void; + + /** + * A positive number will use setTimeout to schedule any tasks after + * the eventLoopRunningTime hits the deadline value, otherwise all + * tasks will be executed in one setImmediate batch (default). + */ + setDeadline(deadline: number): void; +} + +export interface ScrollResponderEvent extends NativeSyntheticEvent {} + +interface ScrollResponderMixin extends SubscribableMixin { + /** + * Invoke this from an `onScroll` event. + */ + scrollResponderHandleScrollShouldSetResponder(): boolean; + + /** + * Merely touch starting is not sufficient for a scroll view to become the + * responder. Being the "responder" means that the very next touch move/end + * event will result in an action/movement. + * + * Invoke this from an `onStartShouldSetResponder` event. + * + * `onStartShouldSetResponder` is used when the next move/end will trigger + * some UI movement/action, but when you want to yield priority to views + * nested inside of the view. + * + * There may be some cases where scroll views actually should return `true` + * from `onStartShouldSetResponder`: Any time we are detecting a standard tap + * that gives priority to nested views. + * + * - If a single tap on the scroll view triggers an action such as + * recentering a map style view yet wants to give priority to interaction + * views inside (such as dropped pins or labels), then we would return true + * from this method when there is a single touch. + * + * - Similar to the previous case, if a two finger "tap" should trigger a + * zoom, we would check the `touches` count, and if `>= 2`, we would return + * true. + * + */ + scrollResponderHandleStartShouldSetResponder(): boolean; + + /** + * There are times when the scroll view wants to become the responder + * (meaning respond to the next immediate `touchStart/touchEnd`), in a way + * that *doesn't* give priority to nested views (hence the capture phase): + * + * - Currently animating. + * - Tapping anywhere that is not the focused input, while the keyboard is + * up (which should dismiss the keyboard). + * + * Invoke this from an `onStartShouldSetResponderCapture` event. + */ + scrollResponderHandleStartShouldSetResponderCapture(e: ScrollResponderEvent): boolean; + + /** + * Invoke this from an `onResponderReject` event. + * + * Some other element is not yielding its role as responder. Normally, we'd + * just disable the `UIScrollView`, but a touch has already began on it, the + * `UIScrollView` will not accept being disabled after that. The easiest + * solution for now is to accept the limitation of disallowing this + * altogether. To improve this, find a way to disable the `UIScrollView` after + * a touch has already started. + */ + scrollResponderHandleResponderReject(): any; + + /** + * We will allow the scroll view to give up its lock iff it acquired the lock + * during an animation. This is a very useful default that happens to satisfy + * many common user experiences. + * + * - Stop a scroll on the left edge, then turn that into an outer view's + * backswipe. + * - Stop a scroll mid-bounce at the top, continue pulling to have the outer + * view dismiss. + * - However, without catching the scroll view mid-bounce (while it is + * motionless), if you drag far enough for the scroll view to become + * responder (and therefore drag the scroll view a bit), any backswipe + * navigation of a swipe gesture higher in the view hierarchy, should be + * rejected. + */ + scrollResponderHandleTerminationRequest(): boolean; + + /** + * Invoke this from an `onTouchEnd` event. + * + * @param e Event. + */ + scrollResponderHandleTouchEnd(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onResponderRelease` event. + */ + scrollResponderHandleResponderRelease(e: ScrollResponderEvent): void; + + scrollResponderHandleScroll(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onResponderGrant` event. + */ + scrollResponderHandleResponderGrant(e: ScrollResponderEvent): void; + + /** + * Unfortunately, `onScrollBeginDrag` also fires when *stopping* the scroll + * animation, and there's not an easy way to distinguish a drag vs. stopping + * momentum. + * + * Invoke this from an `onScrollBeginDrag` event. + */ + scrollResponderHandleScrollBeginDrag(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onScrollEndDrag` event. + */ + scrollResponderHandleScrollEndDrag(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onMomentumScrollBegin` event. + */ + scrollResponderHandleMomentumScrollBegin(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onMomentumScrollEnd` event. + */ + scrollResponderHandleMomentumScrollEnd(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onTouchStart` event. + * + * Since we know that the `SimpleEventPlugin` occurs later in the plugin + * order, after `ResponderEventPlugin`, we can detect that we were *not* + * permitted to be the responder (presumably because a contained view became + * responder). The `onResponderReject` won't fire in that case - it only + * fires when a *current* responder rejects our request. + * + * @param e Touch Start event. + */ + scrollResponderHandleTouchStart(e: ScrollResponderEvent): void; + + /** + * Invoke this from an `onTouchMove` event. + * + * Since we know that the `SimpleEventPlugin` occurs later in the plugin + * order, after `ResponderEventPlugin`, we can detect that we were *not* + * permitted to be the responder (presumably because a contained view became + * responder). The `onResponderReject` won't fire in that case - it only + * fires when a *current* responder rejects our request. + * + * @param e Touch Start event. + */ + scrollResponderHandleTouchMove(e: ScrollResponderEvent): void; + + /** + * A helper function for this class that lets us quickly determine if the + * view is currently animating. This is particularly useful to know when + * a touch has just started or ended. + */ + scrollResponderIsAnimating(): boolean; + + /** + * Returns the node that represents native view that can be scrolled. + * Components can pass what node to use by defining a `getScrollableNode` + * function otherwise `this` is used. + */ + scrollResponderGetScrollableNode(): any; + + /** + * A helper function to scroll to a specific point in the scrollview. + * This is currently used to help focus on child textviews, but can also + * be used to quickly scroll to any element we want to focus. Syntax: + * + * scrollResponderScrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) + * + * Note: The weird argument signature is due to the fact that, for historical reasons, + * the function also accepts separate arguments as as alternative to the options object. + * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. + */ + scrollResponderScrollTo( + x?: number | { x?: number; y?: number; animated?: boolean }, + y?: number, + animated?: boolean + ): void; + + /** + * A helper function to zoom to a specific rect in the scrollview. The argument has the shape + * {x: number; y: number; width: number; height: number; animated: boolean = true} + * + * @platform ios + */ + scrollResponderZoomTo( + rect: { x: number; y: number; width: number; height: number; animated?: boolean }, + animated?: boolean // deprecated, put this inside the rect argument instead + ): void; + + /** + * This method should be used as the callback to onFocus in a TextInputs' + * parent view. Note that any module using this mixin needs to return + * the parent view's ref in getScrollViewRef() in order to use this method. + * @param nodeHandle The TextInput node handle + * @param additionalOffset The scroll view's top "contentInset". + * Default is 0. + * @param preventNegativeScrolling Whether to allow pulling the content + * down to make it meet the keyboard's top. Default is false. + */ + scrollResponderScrollNativeHandleToKeyboard( + nodeHandle: any, + additionalOffset?: number, + preventNegativeScrollOffset?: boolean + ): void; + + /** + * The calculations performed here assume the scroll view takes up the entire + * screen - even if has some content inset. We then measure the offsets of the + * keyboard, and compensate both for the scroll view's "contentInset". + * + * @param left Position of input w.r.t. table view. + * @param top Position of input w.r.t. table view. + * @param width Width of the text input. + * @param height Height of the text input. + */ + scrollResponderInputMeasureAndScrollToKeyboard(left: number, top: number, width: number, height: number): void; + + scrollResponderTextInputFocusError(e: ScrollResponderEvent): void; + + /** + * `componentWillMount` is the closest thing to a standard "constructor" for + * React components. + * + * The `keyboardWillShow` is called before input focus. + */ + componentWillMount(): void; + + /** + * Warning, this may be called several times for a single keyboard opening. + * It's best to store the information in this method and then take any action + * at a later point (either in `keyboardDidShow` or other). + * + * Here's the order that events occur in: + * - focus + * - willShow {startCoordinates, endCoordinates} several times + * - didShow several times + * - blur + * - willHide {startCoordinates, endCoordinates} several times + * - didHide several times + * + * The `ScrollResponder` providesModule callbacks for each of these events. + * Even though any user could have easily listened to keyboard events + * themselves, using these `props` callbacks ensures that ordering of events + * is consistent - and not dependent on the order that the keyboard events are + * subscribed to. This matters when telling the scroll view to scroll to where + * the keyboard is headed - the scroll responder better have been notified of + * the keyboard destination before being instructed to scroll to where the + * keyboard will be. Stick to the `ScrollResponder` callbacks, and everything + * will work. + * + * WARNING: These callbacks will fire even if a keyboard is displayed in a + * different navigation pane. Filter out the events to determine if they are + * relevant to you. (For example, only if you receive these callbacks after + * you had explicitly focused a node etc). + */ + scrollResponderKeyboardWillShow(e: ScrollResponderEvent): void; + + scrollResponderKeyboardWillHide(e: ScrollResponderEvent): void; + + scrollResponderKeyboardDidShow(e: ScrollResponderEvent): void; + + scrollResponderKeyboardDidHide(e: ScrollResponderEvent): void; +} + +export interface ScrollViewPropsIOS { + /** + * When true the scroll view bounces horizontally when it reaches the end + * even if the content is smaller than the scroll view itself. The default + * value is true when `horizontal={true}` and false otherwise. + */ + alwaysBounceHorizontal?: boolean; + /** + * When true the scroll view bounces vertically when it reaches the end + * even if the content is smaller than the scroll view itself. The default + * value is false when `horizontal={true}` and true otherwise. + */ + alwaysBounceVertical?: boolean; + + /** + * Controls whether iOS should automatically adjust the content inset for scroll views that are placed behind a navigation bar or tab bar/ toolbar. + * The default value is true. + */ + automaticallyAdjustContentInsets?: boolean; // true + + /** + * When true the scroll view bounces when it reaches the end of the + * content if the content is larger then the scroll view along the axis of + * the scroll direction. When false it disables all bouncing even if + * the `alwaysBounce*` props are true. The default value is true. + */ + bounces?: boolean; + /** + * When true gestures can drive zoom past min/max and the zoom will animate + * to the min/max value at gesture end otherwise the zoom will not exceed + * the limits. + */ + bouncesZoom?: boolean; + + /** + * When false once tracking starts won't try to drag if the touch moves. + * The default value is true. + */ + canCancelContentTouches?: boolean; + + /** + * When true the scroll view automatically centers the content when the + * content is smaller than the scroll view bounds; when the content is + * larger than the scroll view this property has no effect. The default + * value is false. + */ + centerContent?: boolean; + + /** + * The amount by which the scroll view content is inset from the edges of the scroll view. + * Defaults to {0, 0, 0, 0}. + */ + contentInset?: Insets; // zeros + + /** + * Used to manually set the starting scroll offset. + * The default value is {x: 0, y: 0} + */ + contentOffset?: PointPropType; // zeros + + /** + * This property specifies how the safe area insets are used to modify the content area of the scroll view. + * The default value of this property must be 'automatic'. But the default value is 'never' until RN@0.51. + */ + contentInsetAdjustmentBehavior?: "automatic" | "scrollableAxes" | "never" | "always"; + + /** + * A floating-point number that determines how quickly the scroll view + * decelerates after the user lifts their finger. Reasonable choices include + * - Normal: 0.998 (the default) + * - Fast: 0.9 + */ + decelerationRate?: "fast" | "normal" | number; + + /** + * When true the ScrollView will try to lock to only vertical or horizontal + * scrolling while dragging. The default value is false. + */ + directionalLockEnabled?: boolean; + + /** + * The style of the scroll indicators. + * - default (the default), same as black. + * - black, scroll indicator is black. This style is good against + * a white content background. + * - white, scroll indicator is white. This style is good against + * a black content background. + */ + indicatorStyle?: "default" | "black" | "white"; + + /** + * The maximum allowed zoom scale. The default value is 1.0. + */ + maximumZoomScale?: number; + + /** + * The minimum allowed zoom scale. The default value is 1.0. + */ + minimumZoomScale?: number; + + /** + * Called when a scrolling animation ends. + */ + onScrollAnimationEnd?: () => void; + + /** + * When true, ScrollView allows use of pinch gestures to zoom in and out. + * The default value is true. + */ + pinchGestureEnabled?: boolean; + + /** + * This controls how often the scroll event will be fired while scrolling (in events per seconds). + * A higher number yields better accuracy for code that is tracking the scroll position, + * but can lead to scroll performance problems due to the volume of information being send over the bridge. + * The default value is zero, which means the scroll event will be sent only once each time the view is scrolled. + */ + scrollEventThrottle?: number; // null + + /** + * The amount by which the scroll view indicators are inset from the edges of the scroll view. + * This should normally be set to the same value as the contentInset. + * Defaults to {0, 0, 0, 0}. + */ + scrollIndicatorInsets?: Insets; //zeroes + + /** + * When true the scroll view scrolls to top when the status bar is tapped. + * The default value is true. + */ + scrollsToTop?: boolean; + + /** + * An array of child indices determining which children get docked to the + * top of the screen when scrolling. For example passing + * `stickyHeaderIndices={[0]}` will cause the first child to be fixed to the + * top of the scroll view. This property is not supported in conjunction + * with `horizontal={true}`. + */ + stickyHeaderIndices?: number[]; + + /** + * The current scale of the scroll view content. The default value is 1.0. + */ + zoomScale?: number; +} + +export interface ScrollViewPropsAndroid { + /** + * Sometimes a scrollview takes up more space than its content fills. + * When this is the case, this prop will fill the rest of the + * scrollview with a color to avoid setting a background and creating + * unnecessary overdraw. This is an advanced optimization that is not + * needed in the general case. + */ + endFillColor?: string; + + /** + * Tag used to log scroll performance on this scroll view. Will force + * momentum events to be turned on (see sendMomentumEvents). This doesn't do + * anything out of the box and you need to implement a custom native + * FpsListener for it to be useful. + * @platform android + */ + scrollPerfTag?: string; + + /** + * Used to override default value of overScroll mode. + + * Possible values: + * - 'auto' - Default value, allow a user to over-scroll this view only if the content is large enough to meaningfully scroll. + * - 'always' - Always allow a user to over-scroll this view. + * - 'never' - Never allow a user to over-scroll this view. + */ + overScrollMode?: "auto" | "always" | "never"; + + /** + * Enables nested scrolling for Android API level 21+. Nested scrolling is supported by default on iOS. + */ + nestedScrollEnabled?: boolean; +} + +export interface ScrollViewProps extends ViewProps, ScrollViewPropsIOS, ScrollViewPropsAndroid, Touchable { + /** + * These styles will be applied to the scroll view content container which + * wraps all of the child views. Example: + * + * return ( + * + * + * ); + * ... + * const styles = StyleSheet.create({ + * contentContainer: { + * paddingVertical: 20 + * } + * }); + */ + contentContainerStyle?: StyleProp; + + /** + * When true the scroll view's children are arranged horizontally in a row + * instead of vertically in a column. The default value is false. + */ + horizontal?: boolean; + + /** + * If sticky headers should stick at the bottom instead of the top of the + * ScrollView. This is usually used with inverted ScrollViews. + */ + invertStickyHeaders?: boolean; + + /** + * Determines whether the keyboard gets dismissed in response to a drag. + * - 'none' (the default) drags do not dismiss the keyboard. + * - 'onDrag' the keyboard is dismissed when a drag begins. + * - 'interactive' the keyboard is dismissed interactively with the drag + * and moves in synchrony with the touch; dragging upwards cancels the + * dismissal. + */ + keyboardDismissMode?: "none" | "interactive" | "on-drag"; + + /** + * Determines when the keyboard should stay visible after a tap. + * - 'never' (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap. + * - 'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps. + * - 'handled', the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor). + * - false, deprecated, use 'never' instead + * - true, deprecated, use 'always' instead + */ + keyboardShouldPersistTaps?: boolean | "always" | "never" | "handled"; - /** - * Converts a layout size (dp) to pixel size (px). - * Guaranteed to return an integer number. - */ - getPixelSizeForLayoutSize(layoutSize: number): number + /** + * Called when scrollable content view of the ScrollView changes. + * Handler function is passed the content width and content height as parameters: (contentWidth, contentHeight) + * It's implemented using onLayout handler attached to the content container which this ScrollView renders. + * + */ + onContentSizeChange?: (w: number, h: number) => void; - /** - * Rounds a layout size (dp) to the nearest layout size that - * corresponds to an integer number of pixels. For example, - * on a device with a PixelRatio of 3, - * PixelRatio.roundToNearestPixel(8.4) = 8.33, - * which corresponds to exactly (8.33 * 3) = 25 pixels. - */ - roundToNearestPixel(layoutSize: number): number + /** + * Fires at most once per frame during scrolling. + * The frequency of the events can be contolled using the scrollEventThrottle prop. + */ + onScroll?: (event: NativeSyntheticEvent) => void; - /** - * No-op for iOS, but used on the web. Should not be documented. [sic] - */ - startDetecting(): void -} + /** + * Fires if a user initiates a scroll gesture. + */ + onScrollBeginDrag?: (event: NativeSyntheticEvent) => void; -/** - * @see https://facebook.github.io/react-native/docs/platform-specific-code.html#content - */ -export type PlatformOSType = 'ios' | 'android' | 'macos' | 'windows' | 'web' + /** + * Fires when a user has finished scrolling. + */ + onScrollEndDrag?: (event: NativeSyntheticEvent) => void; -interface PlatformStatic { - isTV: boolean - Version: number | string + /** + * Fires when scroll view has finished moving + */ + onMomentumScrollEnd?: (event: NativeSyntheticEvent) => void; - /** - * @see https://facebook.github.io/react-native/docs/platform-specific-code.html#content - */ - select(specifics: {[platform in PlatformOSType | 'default']?: T}): T -} + /** + * Fires when scroll view has begun moving + */ + onMomentumScrollBegin?: (event: NativeSyntheticEvent) => void; -interface PlatformIOSStatic extends PlatformStatic { - OS: 'ios' - isPad: boolean - isTVOS: boolean -} + /** + * When true the scroll view stops on multiples of the scroll view's size + * when scrolling. This can be used for horizontal pagination. The default + * value is false. + */ + pagingEnabled?: boolean; -interface PlatformAndroidStatic extends PlatformStatic { - OS: 'android' -} + /** + * When false, the content does not scroll. The default value is true + */ + scrollEnabled?: boolean; // true -interface PlatformMacOSStatic extends PlatformStatic { - OS: 'macos' -} + /** + * Experimental: When true offscreen child views (whose `overflow` value is + * `hidden`) are removed from their native backing superview when offscreen. + * This canimprove scrolling performance on long lists. The default value is + * false. + */ + removeClippedSubviews?: boolean; -interface PlatformWindowsOSStatic extends PlatformStatic { - OS: 'windows' -} + /** + * When true, shows a horizontal scroll indicator. + */ + showsHorizontalScrollIndicator?: boolean; -interface PlatformWebStatic extends PlatformStatic { - OS: 'web' -} + /** + * When true, shows a vertical scroll indicator. + */ + showsVerticalScrollIndicator?: boolean; -/** - * Deprecated - subclass NativeEventEmitter to create granular event modules instead of - * adding all event listeners directly to RCTDeviceEventEmitter. - */ -interface DeviceEventEmitterStatic extends EventEmitter { - sharedSubscriber: EventSubscriptionVendor - new (): DeviceEventEmitterStatic - addListener(type: string, listener: (data: any) => void, context?: any): EmitterSubscription -} + /** + * Style + */ + style?: StyleProp; -// Used by Dimensions below -export interface ScaledSize { - width: number - height: number - scale: number - fontScale: number -} + /** + * A RefreshControl component, used to provide pull-to-refresh + * functionality for the ScrollView. + */ + refreshControl?: React.ReactElement; -/** - * Initial dimensions are set before `runApplication` is called so they should - * be available before any other require's are run, but may be updated later. - * - * Note: Although dimensions are available immediately, they may change (e.g - * due to device rotation) so any rendering logic or styles that depend on - * these constants should try to call this function on every render, rather - * than caching the value (for example, using inline styles rather than - * setting a value in a `StyleSheet`). - * - * Example: `const {height, width} = Dimensions.get('window');` - * - * @param dim Name of dimension as defined when calling `set`. - * @returns Value for the dimension. - * @see https://facebook.github.io/react-native/docs/dimensions.html#content - */ -export interface Dimensions { - /** - * Initial dimensions are set before runApplication is called so they - * should be available before any other require's are run, but may be - * updated later. - * Note: Although dimensions are available immediately, they may - * change (e.g due to device rotation) so any rendering logic or - * styles that depend on these constants should try to call this - * function on every render, rather than caching the value (for - * example, using inline styles rather than setting a value in a - * StyleSheet). - * Example: const {height, width} = Dimensions.get('window'); - @param dim Name of dimension as defined when calling set. - @returns Value for the dimension. + /** + * When `snapToInterval` is set, `snapToAlignment` will define the relationship of the the snapping to the scroll view. + * - `start` (the default) will align the snap at the left (horizontal) or top (vertical) + * - `center` will align the snap in the center + * - `end` will align the snap at the right (horizontal) or bottom (vertical) */ - get(dim: 'window' | 'screen'): ScaledSize - - /** - * This should only be called from native code by sending the didUpdateDimensions event. - * @param dims Simple string-keyed object of dimensions to set - */ - set(dims: {[key: string]: any}): void - - /** - * Add an event listener for dimension changes - * - * @param type the type of event to listen to - * @param handler the event handler - */ - addEventListener( - type: 'change', - handler: ({window, screen}: {window: ScaledSize; screen: ScaledSize}) => void - ): void - - /** - * Remove an event listener - * - * @param type the type of event - * @param handler the event handler - */ - removeEventListener( - type: 'change', - handler: ({window, screen}: {window: ScaledSize; screen: ScaledSize}) => void - ): void -} + snapToAlignment?: "start" | "center" | "end"; -export type SimpleTask = { - name: string - gen: () => void -} -export type PromiseTask = { - name: string - gen: () => Promise -} + /** + * When set, causes the scroll view to stop at multiples of the value of `snapToInterval`. + * This can be used for paginating through children that have lengths smaller than the scroll view. + * Used in combination with `snapToAlignment` and `decelerationRate="fast"`. Overrides less + * configurable `pagingEnabled` prop. + */ + snapToInterval?: number; -export type Handle = number + /** + * When set, causes the scroll view to stop at the defined offsets. This can be used for + * paginating through variously sized children that have lengths smaller than the scroll view. + * Typically used in combination with `decelerationRate="fast"`. Overrides less configurable + * `pagingEnabled` and `snapToInterval` props. + */ + snapToOffsets?: number[]; -export interface InteractionManagerStatic extends EventEmitterListener { - Events: { - interactionStart: string - interactionComplete: string - } - - /** - * Schedule a function to run after all interactions have completed. - * Returns a cancellable - */ - runAfterInteractions( - task?: (() => any) | SimpleTask | PromiseTask - ): { - then: (onfulfilled?: () => any, onrejected?: () => any) => Promise - done: (...args: any[]) => any - cancel: () => void - } - - /** - * Notify manager that an interaction has started. - */ - createInteractionHandle(): Handle - - /** - * Notify manager that an interaction has completed. - */ - clearInteractionHandle(handle: Handle): void - - /** - * A positive number will use setTimeout to schedule any tasks after - * the eventLoopRunningTime hits the deadline value, otherwise all - * tasks will be executed in one setImmediate batch (default). - */ - setDeadline(deadline: number): void -} + /** + * Use in conjuction with `snapToOffsets`. By default, the beginning of the list counts as a + * snap offset. Set `snapToStart` to false to disable this behavior and allow the list to scroll + * freely between its start and the first `snapToOffsets` offset. The default value is true. + */ + snapToStart?: boolean; -export interface ScrollResponderEvent extends NativeSyntheticEvent {} + /** + * Use in conjuction with `snapToOffsets`. By default, the end of the list counts as a snap + * offset. Set `snapToEnd` to false to disable this behavior and allow the list to scroll freely + * between its end and the last `snapToOffsets` offset. The default value is true. + */ + snapToEnd?: boolean; -interface ScrollResponderMixin extends SubscribableMixin { - /** - * Invoke this from an `onScroll` event. - */ - scrollResponderHandleScrollShouldSetResponder(): boolean - - /** - * Merely touch starting is not sufficient for a scroll view to become the - * responder. Being the "responder" means that the very next touch move/end - * event will result in an action/movement. - * - * Invoke this from an `onStartShouldSetResponder` event. - * - * `onStartShouldSetResponder` is used when the next move/end will trigger - * some UI movement/action, but when you want to yield priority to views - * nested inside of the view. - * - * There may be some cases where scroll views actually should return `true` - * from `onStartShouldSetResponder`: Any time we are detecting a standard tap - * that gives priority to nested views. - * - * - If a single tap on the scroll view triggers an action such as - * recentering a map style view yet wants to give priority to interaction - * views inside (such as dropped pins or labels), then we would return true - * from this method when there is a single touch. - * - * - Similar to the previous case, if a two finger "tap" should trigger a - * zoom, we would check the `touches` count, and if `>= 2`, we would return - * true. - * - */ - scrollResponderHandleStartShouldSetResponder(): boolean - - /** - * There are times when the scroll view wants to become the responder - * (meaning respond to the next immediate `touchStart/touchEnd`), in a way - * that *doesn't* give priority to nested views (hence the capture phase): - * - * - Currently animating. - * - Tapping anywhere that is not the focused input, while the keyboard is - * up (which should dismiss the keyboard). - * - * Invoke this from an `onStartShouldSetResponderCapture` event. - */ - scrollResponderHandleStartShouldSetResponderCapture(e: ScrollResponderEvent): boolean - - /** - * Invoke this from an `onResponderReject` event. - * - * Some other element is not yielding its role as responder. Normally, we'd - * just disable the `UIScrollView`, but a touch has already began on it, the - * `UIScrollView` will not accept being disabled after that. The easiest - * solution for now is to accept the limitation of disallowing this - * altogether. To improve this, find a way to disable the `UIScrollView` after - * a touch has already started. - */ - scrollResponderHandleResponderReject(): any - - /** - * We will allow the scroll view to give up its lock iff it acquired the lock - * during an animation. This is a very useful default that happens to satisfy - * many common user experiences. - * - * - Stop a scroll on the left edge, then turn that into an outer view's - * backswipe. - * - Stop a scroll mid-bounce at the top, continue pulling to have the outer - * view dismiss. - * - However, without catching the scroll view mid-bounce (while it is - * motionless), if you drag far enough for the scroll view to become - * responder (and therefore drag the scroll view a bit), any backswipe - * navigation of a swipe gesture higher in the view hierarchy, should be - * rejected. - */ - scrollResponderHandleTerminationRequest(): boolean - - /** - * Invoke this from an `onTouchEnd` event. - * - * @param e Event. - */ - scrollResponderHandleTouchEnd(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onResponderRelease` event. - */ - scrollResponderHandleResponderRelease(e: ScrollResponderEvent): void - - scrollResponderHandleScroll(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onResponderGrant` event. - */ - scrollResponderHandleResponderGrant(e: ScrollResponderEvent): void - - /** - * Unfortunately, `onScrollBeginDrag` also fires when *stopping* the scroll - * animation, and there's not an easy way to distinguish a drag vs. stopping - * momentum. - * - * Invoke this from an `onScrollBeginDrag` event. - */ - scrollResponderHandleScrollBeginDrag(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onScrollEndDrag` event. - */ - scrollResponderHandleScrollEndDrag(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onMomentumScrollBegin` event. - */ - scrollResponderHandleMomentumScrollBegin(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onMomentumScrollEnd` event. - */ - scrollResponderHandleMomentumScrollEnd(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onTouchStart` event. - * - * Since we know that the `SimpleEventPlugin` occurs later in the plugin - * order, after `ResponderEventPlugin`, we can detect that we were *not* - * permitted to be the responder (presumably because a contained view became - * responder). The `onResponderReject` won't fire in that case - it only - * fires when a *current* responder rejects our request. - * - * @param e Touch Start event. - */ - scrollResponderHandleTouchStart(e: ScrollResponderEvent): void - - /** - * Invoke this from an `onTouchMove` event. - * - * Since we know that the `SimpleEventPlugin` occurs later in the plugin - * order, after `ResponderEventPlugin`, we can detect that we were *not* - * permitted to be the responder (presumably because a contained view became - * responder). The `onResponderReject` won't fire in that case - it only - * fires when a *current* responder rejects our request. - * - * @param e Touch Start event. - */ - scrollResponderHandleTouchMove(e: ScrollResponderEvent): void - - /** - * A helper function for this class that lets us quickly determine if the - * view is currently animating. This is particularly useful to know when - * a touch has just started or ended. - */ - scrollResponderIsAnimating(): boolean - - /** - * Returns the node that represents native view that can be scrolled. - * Components can pass what node to use by defining a `getScrollableNode` - * function otherwise `this` is used. - */ - scrollResponderGetScrollableNode(): any - - /** - * A helper function to scroll to a specific point in the scrollview. - * This is currently used to help focus on child textviews, but can also - * be used to quickly scroll to any element we want to focus. Syntax: - * - * scrollResponderScrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) - * - * Note: The weird argument signature is due to the fact that, for historical reasons, - * the function also accepts separate arguments as as alternative to the options object. - * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. - */ - scrollResponderScrollTo( - x?: number | {x?: number; y?: number; animated?: boolean}, - y?: number, - animated?: boolean - ): void - - /** - * A helper function to zoom to a specific rect in the scrollview. The argument has the shape - * {x: number; y: number; width: number; height: number; animated: boolean = true} - * - * @platform ios - */ - scrollResponderZoomTo( - rect: {x: number; y: number; width: number; height: number; animated?: boolean}, - animated?: boolean // deprecated, put this inside the rect argument instead - ): void - - /** - * This method should be used as the callback to onFocus in a TextInputs' - * parent view. Note that any module using this mixin needs to return - * the parent view's ref in getScrollViewRef() in order to use this method. - * @param nodeHandle The TextInput node handle - * @param additionalOffset The scroll view's top "contentInset". - * Default is 0. - * @param preventNegativeScrolling Whether to allow pulling the content - * down to make it meet the keyboard's top. Default is false. - */ - scrollResponderScrollNativeHandleToKeyboard( - nodeHandle: any, - additionalOffset?: number, - preventNegativeScrollOffset?: boolean - ): void - - /** - * The calculations performed here assume the scroll view takes up the entire - * screen - even if has some content inset. We then measure the offsets of the - * keyboard, and compensate both for the scroll view's "contentInset". - * - * @param left Position of input w.r.t. table view. - * @param top Position of input w.r.t. table view. - * @param width Width of the text input. - * @param height Height of the text input. - */ - scrollResponderInputMeasureAndScrollToKeyboard( - left: number, - top: number, - width: number, - height: number - ): void - - scrollResponderTextInputFocusError(e: ScrollResponderEvent): void - - /** - * `componentWillMount` is the closest thing to a standard "constructor" for - * React components. - * - * The `keyboardWillShow` is called before input focus. - */ - componentWillMount(): void - - /** - * Warning, this may be called several times for a single keyboard opening. - * It's best to store the information in this method and then take any action - * at a later point (either in `keyboardDidShow` or other). - * - * Here's the order that events occur in: - * - focus - * - willShow {startCoordinates, endCoordinates} several times - * - didShow several times - * - blur - * - willHide {startCoordinates, endCoordinates} several times - * - didHide several times - * - * The `ScrollResponder` providesModule callbacks for each of these events. - * Even though any user could have easily listened to keyboard events - * themselves, using these `props` callbacks ensures that ordering of events - * is consistent - and not dependent on the order that the keyboard events are - * subscribed to. This matters when telling the scroll view to scroll to where - * the keyboard is headed - the scroll responder better have been notified of - * the keyboard destination before being instructed to scroll to where the - * keyboard will be. Stick to the `ScrollResponder` callbacks, and everything - * will work. - * - * WARNING: These callbacks will fire even if a keyboard is displayed in a - * different navigation pane. Filter out the events to determine if they are - * relevant to you. (For example, only if you receive these callbacks after - * you had explicitly focused a node etc). - */ - scrollResponderKeyboardWillShow(e: ScrollResponderEvent): void - - scrollResponderKeyboardWillHide(e: ScrollResponderEvent): void - - scrollResponderKeyboardDidShow(e: ScrollResponderEvent): void - - scrollResponderKeyboardDidHide(e: ScrollResponderEvent): void -} + /** + * When true, the scroll view stops on the next index (in relation to scroll position at release) + * regardless of how fast the gesture is. This can be used for horizontal pagination when the page + * is less than the width of the ScrollView. The default value is false. + */ + disableIntervalMomentum?: boolean; -export interface ScrollViewPropsIOS { - /** - * When true the scroll view bounces horizontally when it reaches the end - * even if the content is smaller than the scroll view itself. The default - * value is true when `horizontal={true}` and false otherwise. - */ - alwaysBounceHorizontal?: boolean - /** - * When true the scroll view bounces vertically when it reaches the end - * even if the content is smaller than the scroll view itself. The default - * value is false when `horizontal={true}` and true otherwise. - */ - alwaysBounceVertical?: boolean - - /** - * Controls whether iOS should automatically adjust the content inset for scroll views that are placed behind a navigation bar or tab bar/ toolbar. - * The default value is true. - */ - automaticallyAdjustContentInsets?: boolean // true - - /** - * When true the scroll view bounces when it reaches the end of the - * content if the content is larger then the scroll view along the axis of - * the scroll direction. When false it disables all bouncing even if - * the `alwaysBounce*` props are true. The default value is true. - */ - bounces?: boolean - /** - * When true gestures can drive zoom past min/max and the zoom will animate - * to the min/max value at gesture end otherwise the zoom will not exceed - * the limits. - */ - bouncesZoom?: boolean - - /** - * When false once tracking starts won't try to drag if the touch moves. - * The default value is true. - */ - canCancelContentTouches?: boolean - - /** - * When true the scroll view automatically centers the content when the - * content is smaller than the scroll view bounds; when the content is - * larger than the scroll view this property has no effect. The default - * value is false. - */ - centerContent?: boolean - - /** - * The amount by which the scroll view content is inset from the edges of the scroll view. - * Defaults to {0, 0, 0, 0}. - */ - contentInset?: Insets // zeros - - /** - * Used to manually set the starting scroll offset. - * The default value is {x: 0, y: 0} - */ - contentOffset?: PointPropType // zeros - - /** - * This property specifies how the safe area insets are used to modify the content area of the scroll view. - * The default value of this property must be 'automatic'. But the default value is 'never' until RN@0.51. - */ - contentInsetAdjustmentBehavior?: 'automatic' | 'scrollableAxes' | 'never' | 'always' - - /** - * A floating-point number that determines how quickly the scroll view - * decelerates after the user lifts their finger. Reasonable choices include - * - Normal: 0.998 (the default) - * - Fast: 0.9 - */ - decelerationRate?: 'fast' | 'normal' | number - - /** - * When true the ScrollView will try to lock to only vertical or horizontal - * scrolling while dragging. The default value is false. - */ - directionalLockEnabled?: boolean - - /** - * The style of the scroll indicators. - * - default (the default), same as black. - * - black, scroll indicator is black. This style is good against - * a white content background. - * - white, scroll indicator is white. This style is good against - * a black content background. - */ - indicatorStyle?: 'default' | 'black' | 'white' - - /** - * The maximum allowed zoom scale. The default value is 1.0. - */ - maximumZoomScale?: number - - /** - * The minimum allowed zoom scale. The default value is 1.0. - */ - minimumZoomScale?: number - - /** - * Called when a scrolling animation ends. - */ - onScrollAnimationEnd?: () => void - - /** - * When true, ScrollView allows use of pinch gestures to zoom in and out. - * The default value is true. - */ - pinchGestureEnabled?: boolean - - /** - * This controls how often the scroll event will be fired while scrolling (in events per seconds). - * A higher number yields better accuracy for code that is tracking the scroll position, - * but can lead to scroll performance problems due to the volume of information being send over the bridge. - * The default value is zero, which means the scroll event will be sent only once each time the view is scrolled. - */ - scrollEventThrottle?: number // null - - /** - * The amount by which the scroll view indicators are inset from the edges of the scroll view. - * This should normally be set to the same value as the contentInset. - * Defaults to {0, 0, 0, 0}. - */ - scrollIndicatorInsets?: Insets //zeroes - - /** - * When true the scroll view scrolls to top when the status bar is tapped. - * The default value is true. - */ - scrollsToTop?: boolean - - /** - * An array of child indices determining which children get docked to the - * top of the screen when scrolling. For example passing - * `stickyHeaderIndices={[0]}` will cause the first child to be fixed to the - * top of the scroll view. This property is not supported in conjunction - * with `horizontal={true}`. - */ - stickyHeaderIndices?: number[] - - /** - * The current scale of the scroll view content. The default value is 1.0. - */ - zoomScale?: number + /** + * When true, the default JS pan responder on the ScrollView is disabled, and full control over + * touches inside the ScrollView is left to its child components. This is particularly useful + * if `snapToInterval` is enabled, since it does not follow typical touch patterns. Do not use + * this on regular ScrollView use cases without `snapToInterval` as it may cause unexpected + * touches to occur while scrolling. The default value is false. + */ + disableScrollViewPanResponder?: boolean; } -export interface ScrollViewPropsAndroid { - /** - * Sometimes a scrollview takes up more space than its content fills. - * When this is the case, this prop will fill the rest of the - * scrollview with a color to avoid setting a background and creating - * unnecessary overdraw. This is an advanced optimization that is not - * needed in the general case. - */ - endFillColor?: string - - /** - * Tag used to log scroll performance on this scroll view. Will force - * momentum events to be turned on (see sendMomentumEvents). This doesn't do - * anything out of the box and you need to implement a custom native - * FpsListener for it to be useful. - * @platform android - */ - scrollPerfTag?: string - - /** - * Used to override default value of overScroll mode. +declare class ScrollViewComponent extends React.Component {} +declare const ScrollViewBase: Constructor & typeof ScrollViewComponent; +export class ScrollView extends ScrollViewBase { + /** + * Scrolls to a given x, y offset, either immediately or with a smooth animation. + * Syntax: + * + * scrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) + * + * Note: The weird argument signature is due to the fact that, for historical reasons, + * the function also accepts separate arguments as as alternative to the options object. + * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. + */ + scrollTo(y?: number | { x?: number; y?: number; animated?: boolean }, x?: number, animated?: boolean): void; - * Possible values: - * - 'auto' - Default value, allow a user to over-scroll this view only if the content is large enough to meaningfully scroll. - * - 'always' - Always allow a user to over-scroll this view. - * - 'never' - Never allow a user to over-scroll this view. - */ - overScrollMode?: 'auto' | 'always' | 'never' + /** + * A helper function that scrolls to the end of the scrollview; + * If this is a vertical ScrollView, it scrolls to the bottom. + * If this is a horizontal ScrollView scrolls to the right. + * + * The options object has an animated prop, that enables the scrolling animation or not. + * The animated prop defaults to true + */ + scrollToEnd(options?: { animated: boolean }): void; - /** - * Enables nested scrolling for Android API level 21+. Nested scrolling is supported by default on iOS. - */ - nestedScrollEnabled?: boolean -} + /** + * Returns a reference to the underlying scroll responder, which supports + * operations like `scrollTo`. All ScrollView-like components should + * implement this method so that they can be composed while providing access + * to the underlying scroll responder's methods. + */ + getScrollResponder(): JSX.Element; -export interface ScrollViewProps extends ViewProps, ScrollViewPropsIOS, ScrollViewPropsAndroid, Touchable { - /** - * These styles will be applied to the scroll view content container which - * wraps all of the child views. Example: - * - * return ( - * - * - * ); - * ... - * const styles = StyleSheet.create({ - * contentContainer: { - * paddingVertical: 20 - * } - * }); - */ - contentContainerStyle?: StyleProp - - /** - * When true the scroll view's children are arranged horizontally in a row - * instead of vertically in a column. The default value is false. - */ - horizontal?: boolean - - /** - * If sticky headers should stick at the bottom instead of the top of the - * ScrollView. This is usually used with inverted ScrollViews. - */ - invertStickyHeaders?: boolean - - /** - * Determines whether the keyboard gets dismissed in response to a drag. - * - 'none' (the default) drags do not dismiss the keyboard. - * - 'onDrag' the keyboard is dismissed when a drag begins. - * - 'interactive' the keyboard is dismissed interactively with the drag - * and moves in synchrony with the touch; dragging upwards cancels the - * dismissal. - */ - keyboardDismissMode?: 'none' | 'interactive' | 'on-drag' - - /** - * Determines when the keyboard should stay visible after a tap. - * - 'never' (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap. - * - 'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps. - * - 'handled', the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor). - * - false, deprecated, use 'never' instead - * - true, deprecated, use 'always' instead - */ - keyboardShouldPersistTaps?: boolean | 'always' | 'never' | 'handled' - - /** - * Called when scrollable content view of the ScrollView changes. - * Handler function is passed the content width and content height as parameters: (contentWidth, contentHeight) - * It's implemented using onLayout handler attached to the content container which this ScrollView renders. - * - */ - onContentSizeChange?: (w: number, h: number) => void - - /** - * Fires at most once per frame during scrolling. - * The frequency of the events can be contolled using the scrollEventThrottle prop. - */ - onScroll?: (event: NativeSyntheticEvent) => void - - /** - * Fires if a user initiates a scroll gesture. - */ - onScrollBeginDrag?: (event: NativeSyntheticEvent) => void - - /** - * Fires when a user has finished scrolling. - */ - onScrollEndDrag?: (event: NativeSyntheticEvent) => void - - /** - * Fires when scroll view has finished moving - */ - onMomentumScrollEnd?: (event: NativeSyntheticEvent) => void - - /** - * Fires when scroll view has begun moving - */ - onMomentumScrollBegin?: (event: NativeSyntheticEvent) => void - - /** - * When true the scroll view stops on multiples of the scroll view's size - * when scrolling. This can be used for horizontal pagination. The default - * value is false. - */ - pagingEnabled?: boolean - - /** - * When false, the content does not scroll. The default value is true - */ - scrollEnabled?: boolean // true - - /** - * Experimental: When true offscreen child views (whose `overflow` value is - * `hidden`) are removed from their native backing superview when offscreen. - * This canimprove scrolling performance on long lists. The default value is - * false. - */ - removeClippedSubviews?: boolean - - /** - * When true, shows a horizontal scroll indicator. - */ - showsHorizontalScrollIndicator?: boolean - - /** - * When true, shows a vertical scroll indicator. - */ - showsVerticalScrollIndicator?: boolean - - /** - * Style - */ - style?: StyleProp - - /** - * A RefreshControl component, used to provide pull-to-refresh - * functionality for the ScrollView. - */ - refreshControl?: React.ReactElement - - /** - * When `snapToInterval` is set, `snapToAlignment` will define the relationship of the the snapping to the scroll view. - * - `start` (the default) will align the snap at the left (horizontal) or top (vertical) - * - `center` will align the snap in the center - * - `end` will align the snap at the right (horizontal) or bottom (vertical) - */ - snapToAlignment?: 'start' | 'center' | 'end' - - /** - * When set, causes the scroll view to stop at multiples of the value of `snapToInterval`. - * This can be used for paginating through children that have lengths smaller than the scroll view. - * Used in combination with `snapToAlignment` and `decelerationRate="fast"`. Overrides less - * configurable `pagingEnabled` prop. - */ - snapToInterval?: number - - /** - * When set, causes the scroll view to stop at the defined offsets. This can be used for - * paginating through variously sized children that have lengths smaller than the scroll view. - * Typically used in combination with `decelerationRate="fast"`. Overrides less configurable - * `pagingEnabled` and `snapToInterval` props. - */ - snapToOffsets?: number[] - - /** - * Use in conjuction with `snapToOffsets`. By default, the beginning of the list counts as a - * snap offset. Set `snapToStart` to false to disable this behavior and allow the list to scroll - * freely between its start and the first `snapToOffsets` offset. The default value is true. - */ - snapToStart?: boolean - - /** - * Use in conjuction with `snapToOffsets`. By default, the end of the list counts as a snap - * offset. Set `snapToEnd` to false to disable this behavior and allow the list to scroll freely - * between its end and the last `snapToOffsets` offset. The default value is true. - */ - snapToEnd?: boolean -} + getScrollableNode(): any; -declare class ScrollViewComponent extends React.Component {} -declare const ScrollViewBase: Constructor & typeof ScrollViewComponent -export class ScrollView extends ScrollViewBase { - /** - * Scrolls to a given x, y offset, either immediately or with a smooth animation. - * Syntax: - * - * scrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true}) - * - * Note: The weird argument signature is due to the fact that, for historical reasons, - * the function also accepts separate arguments as as alternative to the options object. - * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED. - */ - scrollTo(y?: number | {x?: number; y?: number; animated?: boolean}, x?: number, animated?: boolean): void - - /** - * A helper function that scrolls to the end of the scrollview; - * If this is a vertical ScrollView, it scrolls to the bottom. - * If this is a horizontal ScrollView scrolls to the right. - * - * The options object has an animated prop, that enables the scrolling animation or not. - * The animated prop defaults to true - */ - scrollToEnd(options?: {animated: boolean}): void - - /** - * Returns a reference to the underlying scroll responder, which supports - * operations like `scrollTo`. All ScrollView-like components should - * implement this method so that they can be composed while providing access - * to the underlying scroll responder's methods. - */ - getScrollResponder(): JSX.Element - - getScrollableNode(): any - - // Undocumented - getInnerViewNode(): any - - // Deprecated, do not use. - scrollWithoutAnimationTo?: (y: number, x: number) => void + // Undocumented + getInnerViewNode(): any; + + // Deprecated, do not use. + scrollWithoutAnimationTo?: (y: number, x: number) => void; } export interface NativeScrollRectangle { - left: number - top: number - bottom: number - right: number + left: number; + top: number; + bottom: number; + right: number; } export interface NativeScrollPoint { - x: number - y: number + x: number; + y: number; } export interface NativeScrollVelocity { - x: number - y: number + x: number; + y: number; } export interface NativeScrollSize { - height: number - width: number + height: number; + width: number; } export interface NativeScrollEvent { - contentInset: NativeScrollRectangle - contentOffset: NativeScrollPoint - contentSize: NativeScrollSize - layoutMeasurement: NativeScrollSize - velocity?: NativeScrollVelocity - zoomScale: number + contentInset: NativeScrollRectangle; + contentOffset: NativeScrollPoint; + contentSize: NativeScrollSize; + layoutMeasurement: NativeScrollSize; + velocity?: NativeScrollVelocity; + zoomScale: number; } export interface SnapshotViewIOSProps extends ViewProps { - // A callback when the Snapshot view is ready to be compared - onSnapshotReady(): any + // A callback when the Snapshot view is ready to be compared + onSnapshotReady(): any; - // A name to identify the individual instance to the SnapshotView - testIdentifier: string + // A name to identify the individual instance to the SnapshotView + testIdentifier: string; } declare class SnapshotViewIOSComponent extends React.Component {} -declare const SnapshotViewIOSBase: Constructor & typeof SnapshotViewIOSComponent +declare const SnapshotViewIOSBase: Constructor & typeof SnapshotViewIOSComponent; export class SnapshotViewIOS extends SnapshotViewIOSBase {} // Deduced from @@ -6759,43 +6739,43 @@ export class SnapshotViewIOS extends SnapshotViewIOSBase {} * ListViewDataSource is not subclassed. */ export interface SwipeableListViewDataSource { - cloneWithRowsAndSections( - dataBlob: any, - sectionIdentities?: Array, - rowIdentities?: Array> - ): SwipeableListViewDataSource - getDataSource(): ListViewDataSource - getOpenRowID(): string - getFirstRowID(): string - setOpenRowID(rowID: string): SwipeableListViewDataSource + cloneWithRowsAndSections( + dataBlob: any, + sectionIdentities?: Array, + rowIdentities?: Array> + ): SwipeableListViewDataSource; + getDataSource(): ListViewDataSource; + getOpenRowID(): string; + getFirstRowID(): string; + setOpenRowID(rowID: string): SwipeableListViewDataSource; } export interface SwipeableListViewProps { - /** - * To alert the user that swiping is possible, the first row can bounce - * on component mount. - */ - bounceFirstRowOnMount: boolean + /** + * To alert the user that swiping is possible, the first row can bounce + * on component mount. + */ + bounceFirstRowOnMount: boolean; - /** - * Use `SwipeableListView.getNewDataSource()` to get a data source to use, - * then use it just like you would a normal ListView data source - */ - dataSource: SwipeableListViewDataSource + /** + * Use `SwipeableListView.getNewDataSource()` to get a data source to use, + * then use it just like you would a normal ListView data source + */ + dataSource: SwipeableListViewDataSource; - // Maximum distance to open to after a swipe - maxSwipeDistance: number + // Maximum distance to open to after a swipe + maxSwipeDistance: number; - // Callback method to render the swipeable view - renderRow: ( - rowData: any, - sectionID: string | number, - rowID: string | number, - highlightRow?: boolean - ) => React.ReactElement + // Callback method to render the swipeable view + renderRow: ( + rowData: any, + sectionID: string | number, + rowID: string | number, + highlightRow?: boolean + ) => React.ReactElement; - // Callback method to render the view that will be unveiled on swipe - renderQuickActions(rowData: any, sectionID: string | number, rowID: string | number): React.ReactElement + // Callback method to render the view that will be unveiled on swipe + renderQuickActions(rowData: any, sectionID: string | number, rowID: string | number): React.ReactElement; } /** @@ -6817,7 +6797,7 @@ export interface SwipeableListViewProps { * - More to come */ export class SwipeableListView extends React.Component { - static getNewDataSource(): SwipeableListViewDataSource + static getNewDataSource(): SwipeableListViewDataSource; } ////////////////////////////////////////////////////////////////////////// @@ -6830,201 +6810,242 @@ export class SwipeableListView extends React.Component { * @see: http://facebook.github.io/react-native/docs/actionsheetios.html#content */ export interface ActionSheetIOSOptions { - title?: string - options: string[] - cancelButtonIndex?: number - destructiveButtonIndex?: number - message?: string - anchor?: number - tintColor?: string + title?: string; + options: string[]; + cancelButtonIndex?: number; + destructiveButtonIndex?: number; + message?: string; + anchor?: number; + tintColor?: string; } export interface ShareActionSheetIOSOptions { - message?: string - url?: string - subject?: string - /** The activities to exclude from the ActionSheet. - * For example: ['com.apple.UIKit.activity.PostToTwitter'] - */ - excludedActivityTypes?: string[] + message?: string; + url?: string; + subject?: string; + /** The activities to exclude from the ActionSheet. + * For example: ['com.apple.UIKit.activity.PostToTwitter'] + */ + excludedActivityTypes?: string[]; } /** * @see https://facebook.github.io/react-native/docs/actionsheetios.html#content */ export interface ActionSheetIOSStatic { - /** - * Display an iOS action sheet. The `options` object must contain one or more - * of: - * - `options` (array of strings) - a list of button titles (required) - * - `cancelButtonIndex` (int) - index of cancel button in `options` - * - `destructiveButtonIndex` (int) - index of destructive button in `options` - * - `title` (string) - a title to show above the action sheet - * - `message` (string) - a message to show below the title - */ - showActionSheetWithOptions: ( - options: ActionSheetIOSOptions, - callback: (buttonIndex: number) => void - ) => void - - /** - * Display the iOS share sheet. The `options` object should contain - * one or both of `message` and `url` and can additionally have - * a `subject` or `excludedActivityTypes`: - * - * - `url` (string) - a URL to share - * - `message` (string) - a message to share - * - `subject` (string) - a subject for the message - * - `excludedActivityTypes` (array) - the activities to exclude from the ActionSheet - * - * NOTE: if `url` points to a local file, or is a base64-encoded - * uri, the file it points to will be loaded and shared directly. - * In this way, you can share images, videos, PDF files, etc. - */ - showShareActionSheetWithOptions: ( - options: ShareActionSheetIOSOptions, - failureCallback: (error: Error) => void, - successCallback: (success: boolean, method: string) => void - ) => void + /** + * Display an iOS action sheet. The `options` object must contain one or more + * of: + * - `options` (array of strings) - a list of button titles (required) + * - `cancelButtonIndex` (int) - index of cancel button in `options` + * - `destructiveButtonIndex` (int) - index of destructive button in `options` + * - `title` (string) - a title to show above the action sheet + * - `message` (string) - a message to show below the title + */ + showActionSheetWithOptions: (options: ActionSheetIOSOptions, callback: (buttonIndex: number) => void) => void; + + /** + * Display the iOS share sheet. The `options` object should contain + * one or both of `message` and `url` and can additionally have + * a `subject` or `excludedActivityTypes`: + * + * - `url` (string) - a URL to share + * - `message` (string) - a message to share + * - `subject` (string) - a subject for the message + * - `excludedActivityTypes` (array) - the activities to exclude from the ActionSheet + * + * NOTE: if `url` points to a local file, or is a base64-encoded + * uri, the file it points to will be loaded and shared directly. + * In this way, you can share images, videos, PDF files, etc. + */ + showShareActionSheetWithOptions: ( + options: ShareActionSheetIOSOptions, + failureCallback: (error: Error) => void, + successCallback: (success: boolean, method: string) => void + ) => void; } export type ShareContent = - | { - title?: string - message: string - } - | { - title?: string - url: string - } + | { + title?: string; + message: string; + } + | { + title?: string; + url: string; + }; export type ShareOptions = { - dialogTitle?: string - excludedActivityTypes?: Array - tintColor?: string - subject?: string -} + dialogTitle?: string; + excludedActivityTypes?: Array; + tintColor?: string; + subject?: string; +}; export type ShareSharedAction = { - action: 'sharedAction' - activityType?: string -} + action: "sharedAction"; + activityType?: string; +}; export type ShareDismissedAction = { - action: 'dismissedAction' -} + action: "dismissedAction" +}; -export type ShareAction = ShareSharedAction | ShareDismissedAction +export type ShareAction = ShareSharedAction | ShareDismissedAction; export interface ShareStatic { - /** - * Open a dialog to share text content. - * - * In iOS, Returns a Promise which will be invoked an object containing `action`, `activityType`. - * If the user dismissed the dialog, the Promise will still be resolved with action being `Share.dismissedAction` - * and all the other keys being undefined. - * - * In Android, Returns a Promise which always be resolved with action being `Share.sharedAction`. - * - * ### Content - * - * - `message` - a message to share - * - `title` - title of the message - * - * #### iOS - * - * - `url` - an URL to share - * - * At least one of URL and message is required. - * - * ### Options - * - * #### iOS - * - * - `excludedActivityTypes` - * - `tintColor` - * - * #### Android - * - * - `dialogTitle` - * - */ - share(content: ShareContent, options?: ShareOptions): Promise - sharedAction: 'sharedAction' - dismissedAction: 'dismissedAction' -} - -type AccessibilityEventName = 'change' | 'announcementFinished' - -type AccessibilityChangeEvent = boolean + /** + * Open a dialog to share text content. + * + * In iOS, Returns a Promise which will be invoked an object containing `action`, `activityType`. + * If the user dismissed the dialog, the Promise will still be resolved with action being `Share.dismissedAction` + * and all the other keys being undefined. + * + * In Android, Returns a Promise which always be resolved with action being `Share.sharedAction`. + * + * ### Content + * + * - `message` - a message to share + * - `title` - title of the message + * + * #### iOS + * + * - `url` - an URL to share + * + * At least one of URL and message is required. + * + * ### Options + * + * #### iOS + * + * - `excludedActivityTypes` + * - `tintColor` + * + * #### Android + * + * - `dialogTitle` + * + */ + share(content: ShareContent, options?: ShareOptions): Promise; + sharedAction: "sharedAction"; + dismissedAction: "dismissedAction"; +} + +type AccessibilityEventName = + "change" | // deprecated, maps to screenReaderChanged + "boldTextChanged" | // iOS-only Event + "grayscaleChanged" | // iOS-only Event + "invertColorsChanged" | // iOS-only Event + "reduceMotionChanged" | + "screenReaderChanged" | + "reduceTransparencyChanged" | // iOS-only Event + "announcementFinished"; // iOS-only Event + +type AccessibilityChangeEvent = boolean; type AccessibilityAnnoucementFinishedEvent = { - announcement: string - success: boolean -} + announcement: string; + success: boolean; +}; -type AccessibilityEvent = AccessibilityChangeEvent | AccessibilityAnnoucementFinishedEvent +type AccessibilityEvent = AccessibilityChangeEvent | AccessibilityAnnoucementFinishedEvent; /** * @see https://facebook.github.io/react-native/docs/accessibilityinfo.html */ export interface AccessibilityInfoStatic { - /** - * Query whether a screen reader is currently enabled. - * Returns a promise which resolves to a boolean. The result is true when a screen reader is enabled and false otherwise. - */ - fetch: () => Promise - - /** - * Add an event handler. Supported events: - * - change: Fires when the state of the screen reader changes. - * The argument to the event handler is a boolean. - * The boolean is true when a screen reader is enabled and false otherwise. - * - * - announcementFinished: iOS-only event. Fires when the screen reader has finished making an announcement. - * The argument to the event handler is a dictionary with these keys: - * - announcement: The string announced by the screen reader. - * - success: A boolean indicating whether the announcement was successfully made. - */ - addEventListener: (eventName: AccessibilityEventName, handler: (event: AccessibilityEvent) => void) => void - - /** - * Remove an event handler. - */ - removeEventListener: ( - eventName: AccessibilityEventName, - handler: (event: AccessibilityEvent) => void - ) => void - - /** - * Set acessibility focus to a react component. - * - * @platform ios - */ - setAccessibilityFocus: (reactTag: number) => void - - /** - * Post a string to be announced by the screen reader. - * - * @platform ios - */ - announceForAccessibility: (announcement: string) => void + /** + * Query whether bold text is currently enabled. + * + * @platform ios + */ + isBoldTextEnabled: () => Promise; + + /** + * Query whether grayscale is currently enabled. + * + * @platform ios + */ + isGrayscaleEnabled: () => Promise; + + /** + * Query whether invert colors is currently enabled. + * + * @platform ios + */ + isInvertColorsEnabled: () => Promise; + + /** + * Query whether reduce motion is currently enabled. + */ + isReduceMotionEnabled: () => Promise; + + /** + * Query whether reduce transparency is currently enabled. + * + * @platform ios + */ + isReduceTransparencyEnabled: () => Promise; + + /** + * Query whether a screen reader is currently enabled. + */ + isScreenReaderEnabled: () => Promise; + + /** + * Query whether a screen reader is currently enabled. + * + * @deprecated use isScreenReaderChanged instead + */ + fetch(): () => Promise; + + /** + * Add an event handler. Supported events: + * - announcementFinished: iOS-only event. Fires when the screen reader has finished making an announcement. + * The argument to the event handler is a dictionary with these keys: + * - announcement: The string announced by the screen reader. + * - success: A boolean indicating whether the announcement was successfully made. + * - AccessibilityEventName constants other than announcementFinished: Fires on accessibility feature change. + * The argument to the event handler is a boolean. + * The boolean is true when the related event's feature is enabled and false otherwise. + * + */ + addEventListener: (eventName: AccessibilityEventName, handler: (event: AccessibilityEvent) => void) => void; + + /** + * Remove an event handler. + */ + removeEventListener: (eventName: AccessibilityEventName, handler: (event: AccessibilityEvent) => void) => void; + + /** + * Set acessibility focus to a react component. + * + * @platform ios + */ + setAccessibilityFocus: (reactTag: number) => void; + + /** + * Post a string to be announced by the screen reader. + * + * @platform ios + */ + announceForAccessibility: (announcement: string) => void; } /** * @see https://facebook.github.io/react-native/docs/alert.html#content */ export interface AlertButton { - text?: string - onPress?: () => void - style?: 'default' | 'cancel' | 'destructive' + text?: string; + onPress?: () => void; + style?: "default" | "cancel" | "destructive"; } interface AlertOptions { - /** @platform android */ - cancelable?: boolean - /** @platform android */ - onDismiss?: () => void + /** @platform android */ + cancelable?: boolean; + /** @platform android */ + onDismiss?: () => void; } /** @@ -7066,34 +7087,31 @@ interface AlertOptions { * ``` */ export interface AlertStatic { - alert: (title: string, message?: string, buttons?: AlertButton[], options?: AlertOptions) => void + alert: (title: string, message?: string, buttons?: AlertButton[], options?: AlertOptions) => void; } /** * Wrapper around the Android native module. */ export interface AlertAndroidStatic { - alert: (title: string, message?: string, buttons?: AlertButton[], options?: AlertOptions) => void + alert: (title: string, message?: string, buttons?: AlertButton[], options?: AlertOptions) => void; } /** * //FIXME: No documentation - inferred from RCTAdSupport.m */ export interface AdSupportIOSStatic { - getAdvertisingId: (onSuccess: (deviceId: string) => void, onFailure: (err: Error) => void) => void - getAdvertisingTrackingEnabled: ( - onSuccess: (hasTracking: boolean) => void, - onFailure: (err: Error) => void - ) => void + getAdvertisingId: (onSuccess: (deviceId: string) => void, onFailure: (err: Error) => void) => void; + getAdvertisingTrackingEnabled: (onSuccess: (hasTracking: boolean) => void, onFailure: (err: Error) => void) => void; } interface AlertIOSButton { - text: string - onPress?: (message?: string) => void - style?: 'default' | 'cancel' | 'destructive' + text: string; + onPress?: (message?: string) => void; + style?: "default" | "cancel" | "destructive"; } -export type AlertType = 'default' | 'plain-text' | 'secure-text' | 'login-password' +export type AlertType = "default" | "plain-text" | "secure-text" | "login-password"; /** * @description @@ -7106,52 +7124,52 @@ export type AlertType = 'default' | 'plain-text' | 'secure-text' | 'login-passwo * @see https://facebook.github.io/react-native/docs/alertios.html#content */ export interface AlertIOSStatic { - /** - * Create and display a popup alert. - * @param title The dialog's title. - * @param message An optional message that appears below - * the dialog's title. - * @param callbackOrButtons This optional argument should - * be either a single-argument function or an array of buttons. If passed - * a function, it will be called when the user taps 'OK'. - * - * If passed an array of button configurations, each button should include - * a `text` key, as well as optional `onPress` and `style` keys. `style` - * should be one of 'default', 'cancel' or 'destructive'. - * @param type Deprecated, do not use. - */ - alert: ( - title: string, - message?: string, - callbackOrButtons?: (() => void) | Array, - type?: AlertType - ) => void - - /** - * Create and display a prompt to enter some text. - * @param title The dialog's title. - * @param message An optional message that appears above the text - * input. - * @param callbackOrButtons This optional argument should - * be either a single-argument function or an array of buttons. If passed - * a function, it will be called with the prompt's value when the user - * taps 'OK'. - * - * If passed an array of button configurations, each button should include - * a `text` key, as well as optional `onPress` and `style` keys (see - * example). `style` should be one of 'default', 'cancel' or 'destructive'. - * @param type This configures the text input. One of 'plain-text', - * 'secure-text' or 'login-password'. - * @param defaultValue The default text in text input. - */ - prompt: ( - title: string, - message?: string, - callbackOrButtons?: ((value: string) => void) | Array, - type?: AlertType, - defaultValue?: string, - keyboardType?: KeyboardType | KeyboardTypeIOS - ) => void + /** + * Create and display a popup alert. + * @param title The dialog's title. + * @param message An optional message that appears below + * the dialog's title. + * @param callbackOrButtons This optional argument should + * be either a single-argument function or an array of buttons. If passed + * a function, it will be called when the user taps 'OK'. + * + * If passed an array of button configurations, each button should include + * a `text` key, as well as optional `onPress` and `style` keys. `style` + * should be one of 'default', 'cancel' or 'destructive'. + * @param type Deprecated, do not use. + */ + alert: ( + title: string, + message?: string, + callbackOrButtons?: (() => void) | Array, + type?: AlertType + ) => void; + + /** + * Create and display a prompt to enter some text. + * @param title The dialog's title. + * @param message An optional message that appears above the text + * input. + * @param callbackOrButtons This optional argument should + * be either a single-argument function or an array of buttons. If passed + * a function, it will be called with the prompt's value when the user + * taps 'OK'. + * + * If passed an array of button configurations, each button should include + * a `text` key, as well as optional `onPress` and `style` keys (see + * example). `style` should be one of 'default', 'cancel' or 'destructive'. + * @param type This configures the text input. One of 'plain-text', + * 'secure-text' or 'login-password'. + * @param defaultValue The default text in text input. + */ + prompt: ( + title: string, + message?: string, + callbackOrButtons?: ((value: string) => void) | Array, + type?: AlertType, + defaultValue?: string, + keyboardType?: KeyboardType | KeyboardTypeIOS + ) => void; } /** @@ -7170,99 +7188,99 @@ export interface AlertIOSStatic { * * @see https://facebook.github.io/react-native/docs/appstateios.html#content */ -export type AppStateEvent = 'change' | 'memoryWarning' -export type AppStateStatus = 'active' | 'background' | 'inactive' +export type AppStateEvent = "change" | "memoryWarning"; +export type AppStateStatus = "active" | "background" | "inactive"; + +export interface AppStateStatic { + currentState: AppStateStatus; + + /** + * Add a handler to AppState changes by listening to the change event + * type and providing the handler + */ + addEventListener(type: AppStateEvent, listener: (state: AppStateStatus) => void): void; + + /** + * Remove a handler by passing the change event type and the handler + */ + removeEventListener(type: AppStateEvent, listener: (state: AppStateStatus) => void): void; +} + +/** + * AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage + * system that is global to the app. It should be used instead of LocalStorage. + * + * It is recommended that you use an abstraction on top of `AsyncStorage` + * instead of `AsyncStorage` directly for anything more than light usage since + * it operates globally. + * + * On iOS, `AsyncStorage` is backed by native code that stores small values in a + * serialized dictionary and larger values in separate files. On Android, + * `AsyncStorage` will use either [RocksDB](http://rocksdb.org/) or SQLite + * based on what is available. + * + * @see https://facebook.github.io/react-native/docs/asyncstorage.html#content + */ +export interface AsyncStorageStatic { + /** + * Fetches key and passes the result to callback, along with an Error if there is any. + */ + getItem(key: string, callback?: (error?: Error, result?: string) => void): Promise; + + /** + * Sets value for key and calls callback on completion, along with an Error if there is any + */ + setItem(key: string, value: string, callback?: (error?: Error) => void): Promise; + + removeItem(key: string, callback?: (error?: Error) => void): Promise; + + /** + * Merges existing value with input value, assuming they are stringified json. Returns a Promise object. + * Not supported by all native implementation + */ + mergeItem(key: string, value: string, callback?: (error?: Error) => void): Promise; + + /** + * Erases all AsyncStorage for all clients, libraries, etc. You probably don't want to call this. + * Use removeItem or multiRemove to clear only your own keys instead. + */ + clear(callback?: (error?: Error) => void): Promise; + + /** + * Gets all keys known to the app, for all callers, libraries, etc + */ + getAllKeys(callback?: (error?: Error, keys?: string[]) => void): Promise; -export interface AppStateStatic { - currentState: AppStateStatus + /** + * multiGet invokes callback with an array of key-value pair arrays that matches the input format of multiSet + */ + multiGet( + keys: string[], + callback?: (errors?: Error[], result?: [string, string][]) => void + ): Promise<[string, string][]>; + + /** + * multiSet and multiMerge take arrays of key-value array pairs that match the output of multiGet, + * + * multiSet([['k1', 'val1'], ['k2', 'val2']], cb); + */ + multiSet(keyValuePairs: string[][], callback?: (errors?: Error[]) => void): Promise; - /** - * Add a handler to AppState changes by listening to the change event - * type and providing the handler - */ - addEventListener(type: AppStateEvent, listener: (state: AppStateStatus) => void): void + /** + * Delete all the keys in the keys array. + */ + multiRemove(keys: string[], callback?: (errors?: Error[]) => void): Promise; - /** - * Remove a handler by passing the change event type and the handler - */ - removeEventListener(type: AppStateEvent, listener: (state: AppStateStatus) => void): void + /** + * Merges existing values with input values, assuming they are stringified json. + * Returns a Promise object. + * + * Not supported by all native implementations. + */ + multiMerge(keyValuePairs: string[][], callback?: (errors?: Error[]) => void): Promise; } -/** - * AsyncStorage is a simple, unencrypted, asynchronous, persistent, key-value storage - * system that is global to the app. It should be used instead of LocalStorage. - * - * It is recommended that you use an abstraction on top of `AsyncStorage` - * instead of `AsyncStorage` directly for anything more than light usage since - * it operates globally. - * - * On iOS, `AsyncStorage` is backed by native code that stores small values in a - * serialized dictionary and larger values in separate files. On Android, - * `AsyncStorage` will use either [RocksDB](http://rocksdb.org/) or SQLite - * based on what is available. - * - * @see https://facebook.github.io/react-native/docs/asyncstorage.html#content - */ -export interface AsyncStorageStatic { - /** - * Fetches key and passes the result to callback, along with an Error if there is any. - */ - getItem(key: string, callback?: (error?: Error, result?: string) => void): Promise - - /** - * Sets value for key and calls callback on completion, along with an Error if there is any - */ - setItem(key: string, value: string, callback?: (error?: Error) => void): Promise - - removeItem(key: string, callback?: (error?: Error) => void): Promise - - /** - * Merges existing value with input value, assuming they are stringified json. Returns a Promise object. - * Not supported by all native implementation - */ - mergeItem(key: string, value: string, callback?: (error?: Error) => void): Promise - - /** - * Erases all AsyncStorage for all clients, libraries, etc. You probably don't want to call this. - * Use removeItem or multiRemove to clear only your own keys instead. - */ - clear(callback?: (error?: Error) => void): Promise - - /** - * Gets all keys known to the app, for all callers, libraries, etc - */ - getAllKeys(callback?: (error?: Error, keys?: string[]) => void): Promise - - /** - * multiGet invokes callback with an array of key-value pair arrays that matches the input format of multiSet - */ - multiGet( - keys: string[], - callback?: (errors?: Error[], result?: [string, string][]) => void - ): Promise<[string, string][]> - - /** - * multiSet and multiMerge take arrays of key-value array pairs that match the output of multiGet, - * - * multiSet([['k1', 'val1'], ['k2', 'val2']], cb); - */ - multiSet(keyValuePairs: string[][], callback?: (errors?: Error[]) => void): Promise - - /** - * Delete all the keys in the keys array. - */ - multiRemove(keys: string[], callback?: (errors?: Error[]) => void): Promise - - /** - * Merges existing values with input values, assuming they are stringified json. - * Returns a Promise object. - * - * Not supported by all native implementations. - */ - multiMerge(keyValuePairs: string[][], callback?: (errors?: Error[]) => void): Promise -} - -export type BackPressEventName = 'hardwareBackPress' +export type BackPressEventName = "hardwareBackPress"; /** * Detect hardware back button presses, and programmatically invoke the @@ -7271,9 +7289,9 @@ export type BackPressEventName = 'hardwareBackPress' * Methods don't have more detailed documentation as of 0.25. */ export interface BackAndroidStatic { - exitApp(): void - addEventListener(eventName: BackPressEventName, handler: () => void): void - removeEventListener(eventName: BackPressEventName, handler: () => void): void + exitApp(): void; + addEventListener(eventName: BackPressEventName, handler: () => void): void; + removeEventListener(eventName: BackPressEventName, handler: () => void): void; } /** @@ -7283,100 +7301,93 @@ export interface BackAndroidStatic { * Methods don't have more detailed documentation as of 0.25. */ export interface BackHandlerStatic { - exitApp(): void - addEventListener(eventName: BackPressEventName, handler: () => void): NativeEventSubscription - removeEventListener(eventName: BackPressEventName, handler: () => void): void + exitApp(): void; + addEventListener(eventName: BackPressEventName, handler: () => void): NativeEventSubscription; + removeEventListener(eventName: BackPressEventName, handler: () => void): void; } export interface ButtonProps { - title: string - onPress: (ev: NativeSyntheticEvent) => void - color?: string - accessibilityLabel?: string - disabled?: boolean + title: string; + onPress: (ev: NativeSyntheticEvent) => void; + color?: string; + accessibilityLabel?: string; + disabled?: boolean; - /** - * Used to locate this button in end-to-end tests. - */ - testID?: string + /** + * Used to locate this button in end-to-end tests. + */ + testID?: string; } export class Button extends React.Component {} -export type CameraRollGroupType = - | 'Album' - | 'All' - | 'Event' - | 'Faces' - | 'Library' - | 'PhotoStream' - | 'SavedPhotos' -export type CameraRollAssetType = 'All' | 'Videos' | 'Photos' +export type CameraRollGroupType = "Album" | "All" | "Event" | "Faces" | "Library" | "PhotoStream" | "SavedPhotos"; +export type CameraRollAssetType = "All" | "Videos" | "Photos"; export interface CameraRollFetchParams { - first: number - after?: string - groupTypes?: CameraRollGroupType - groupName?: string - assetType?: CameraRollAssetType + first: number; + after?: string; + groupTypes?: CameraRollGroupType; + groupName?: string; + assetType?: CameraRollAssetType; } export interface CameraRollNodeInfo { - image: Image - group_name: string - timestamp: number - location: any + image: Image; + group_name: string; + timestamp: number; + location: any; } export interface CameraRollEdgeInfo { - node: CameraRollNodeInfo + node: CameraRollNodeInfo; } export interface CameraRollAssetInfo { - edges: CameraRollEdgeInfo[] - page_info: { - has_next_page: boolean - end_cursor: string - } + edges: CameraRollEdgeInfo[]; + page_info: { + has_next_page: boolean; + end_cursor: string; + }; } export interface GetPhotosParamType { - first: number - after?: string - groupTypes?: CameraRollGroupType - groupName?: string - assetType?: CameraRollAssetType - mimeTypes?: string[] + first: number; + after?: string; + groupTypes?: CameraRollGroupType; + groupName?: string; + assetType?: CameraRollAssetType; + mimeTypes?: string[]; } export interface GetPhotosReturnType { - edges: { - node: { - type: string - group_name: string - image: { - uri: string - height: number - width: number - playableDuration: number - isStored?: boolean - } - timestamp: number - location: { - latitude: number - longitude: number - altitude: number - heading: number - speed: number - } - } - }[] - - page_info: { - has_next_page: boolean - start_cursor?: string - end_cursor?: string - } + edges: { + node: { + type: string; + group_name: string; + image: { + uri: string; + height: number; + width: number; + playableDuration: number; + isStored?: boolean; + }; + timestamp: number; + location: { + latitude: number; + longitude: number; + altitude: number; + heading: number; + speed: number; + }; + }; + }[]; + + page_info: { + has_next_page: boolean; + start_cursor?: string; + end_cursor?: string; + }; } /** @@ -7385,153 +7396,153 @@ export interface GetPhotosReturnType { * You can refer to (Linking)[https://facebook.github.io/react-native/docs/linking-libraries-ios.html] for help. */ export interface CameraRollStatic { - GroupTypesOptions: CameraRollGroupType[] //'Album','All','Event','Faces','Library','PhotoStream','SavedPhotos' - AssetTypeOptions: CameraRollAssetType[] // "All", "Videos", "Photos" - - /** - * Saves the image to the camera roll / gallery. - * - * @tag On Android, this is a local URI, such as "file:///sdcard/img.png". - * On iOS, the tag can be one of the following: - * local URI - * assets-library tag - * a tag not maching any of the above, which means the image data will be stored in memory (and consume memory as long as the process is alive) - * - * @deprecated use saveToCameraRoll instead - */ - saveImageWithTag(tag: string): Promise - - /** - * Saves the photo or video to the camera roll / gallery. - * - * On Android, the tag must be a local image or video URI, such as `"file:///sdcard/img.png"`. - * - * On iOS, the tag can be any image URI (including local, remote asset-library and base64 data URIs) - * or a local video file URI (remote or data URIs are not supported for saving video at this time). - * - * If the tag has a file extension of .mov or .mp4, it will be inferred as a video. Otherwise - * it will be treated as a photo. To override the automatic choice, you can pass an optional - * `type` parameter that must be one of 'photo' or 'video'. - * - * Returns a Promise which will resolve with the new URI. - */ - saveToCameraRoll(tag: string, type?: 'photo' | 'video'): Promise - - /** - * Saves the photo or video to the camera roll / gallery. - * - * On Android, the tag must be a local image or video URI, such as `"file:///sdcard/img.png"`. - * - * On iOS, the tag can be any image URI (including local, remote asset-library and base64 data URIs) - * or a local video file URI (remote or data URIs are not supported for saving video at this time). - * - * If the tag has a file extension of .mov or .mp4, it will be inferred as a video. Otherwise - * it will be treated as a photo. To override the automatic choice, you can pass an optional - * `type` parameter that must be one of 'photo' or 'video'. - * - * Returns a Promise which will resolve with the new URI. - */ - saveToCameraRoll(tag: string, type?: 'photo' | 'video'): Promise - - /** - * Invokes callback with photo identifier objects from the local camera roll of the device matching shape defined by getPhotosReturnChecker. - * - * @param params See getPhotosParamChecker. - */ - getPhotos(params: GetPhotosParamType): Promise + GroupTypesOptions: CameraRollGroupType[]; //'Album','All','Event','Faces','Library','PhotoStream','SavedPhotos' + AssetTypeOptions: CameraRollAssetType[]; // "All", "Videos", "Photos" + + /** + * Saves the image to the camera roll / gallery. + * + * @tag On Android, this is a local URI, such as "file:///sdcard/img.png". + * On iOS, the tag can be one of the following: + * local URI + * assets-library tag + * a tag not maching any of the above, which means the image data will be stored in memory (and consume memory as long as the process is alive) + * + * @deprecated use saveToCameraRoll instead + */ + saveImageWithTag(tag: string): Promise; + + /** + * Saves the photo or video to the camera roll / gallery. + * + * On Android, the tag must be a local image or video URI, such as `"file:///sdcard/img.png"`. + * + * On iOS, the tag can be any image URI (including local, remote asset-library and base64 data URIs) + * or a local video file URI (remote or data URIs are not supported for saving video at this time). + * + * If the tag has a file extension of .mov or .mp4, it will be inferred as a video. Otherwise + * it will be treated as a photo. To override the automatic choice, you can pass an optional + * `type` parameter that must be one of 'photo' or 'video'. + * + * Returns a Promise which will resolve with the new URI. + */ + saveToCameraRoll(tag: string, type?: "photo" | "video"): Promise; + + /** + * Saves the photo or video to the camera roll / gallery. + * + * On Android, the tag must be a local image or video URI, such as `"file:///sdcard/img.png"`. + * + * On iOS, the tag can be any image URI (including local, remote asset-library and base64 data URIs) + * or a local video file URI (remote or data URIs are not supported for saving video at this time). + * + * If the tag has a file extension of .mov or .mp4, it will be inferred as a video. Otherwise + * it will be treated as a photo. To override the automatic choice, you can pass an optional + * `type` parameter that must be one of 'photo' or 'video'. + * + * Returns a Promise which will resolve with the new URI. + */ + saveToCameraRoll(tag: string, type?: "photo" | "video"): Promise; + + /** + * Invokes callback with photo identifier objects from the local camera roll of the device matching shape defined by getPhotosReturnChecker. + * + * @param params See getPhotosParamChecker. + */ + getPhotos(params: GetPhotosParamType): Promise; } // https://facebook.github.io/react-native/docs/checkbox.html export interface CheckBoxProps extends ViewProps { - /** - * If true the user won't be able to toggle the checkbox. Default value is false. - */ - disabled?: boolean + /** + * If true the user won't be able to toggle the checkbox. Default value is false. + */ + disabled?: boolean; - /** - * Used in case the props change removes the component. - */ - onChange?: (value: boolean) => void + /** + * Used in case the props change removes the component. + */ + onChange?: (value: boolean) => void; - /** - * Invoked with the new value when the value changes. - */ - onValueChange?: (value: boolean) => void + /** + * Invoked with the new value when the value changes. + */ + onValueChange?: (value: boolean) => void; - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; - /** - * The value of the checkbox. If true the checkbox will be turned on. Default value is false. - */ - value?: boolean + /** + * The value of the checkbox. If true the checkbox will be turned on. Default value is false. + */ + value?: boolean; } export class CheckBox extends React.Component {} /** Clipboard gives you an interface for setting and getting content from Clipboard on both iOS and Android */ export interface ClipboardStatic { - getString(): Promise - setString(content: string): void + getString(): Promise; + setString(content: string): void; } export interface DatePickerAndroidOpenOptions { - date?: Date | number - minDate?: Date | number - maxDate?: Date | number - mode?: 'calendar' | 'spinner' | 'default' + date?: Date | number; + minDate?: Date | number; + maxDate?: Date | number; + mode?: "calendar" | "spinner" | "default"; } // Deduced from DatePickerAndroid.android.js export interface DatePickerAndroidDateSetAction { - action: 'dateSetAction' - year: number - month: number - day: number + action: 'dateSetAction'; + year: number; + month: number; + day: number; } export interface DatePickerAndroidDismissedAction { - action: 'dismissedAction' + action: 'dismissedAction'; } export type DatePickerAndroidOpenReturn = DatePickerAndroidDateSetAction | DatePickerAndroidDismissedAction export interface DatePickerAndroidStatic { - /** - * Opens the standard Android date picker dialog. - * - * The available keys for the options object are: - * - date (Date object or timestamp in milliseconds) - date to show by default - * - minDate (Date or timestamp in milliseconds) - minimum date that can be selected - * - maxDate (Date object or timestamp in milliseconds) - maximum date that can be selected - * - mode (enum('calendar', 'spinner', 'default')) - To set the date-picker mode to calendar/spinner/default - * - 'calendar': Show a date picker in calendar mode. - * - 'spinner': Show a date picker in spinner mode. - * - 'default': Show a default native date picker(spinner/calendar) based on android versions. - * - * Returns a Promise which will be invoked an object containing action, year, month (0-11), day if the user picked a date. - * If the user dismissed the dialog, the Promise will still be resolved with action being DatePickerAndroid.dismissedAction and all the other keys being undefined. - * Always check whether the action before reading the values. - * - * Note the native date picker dialog has some UI glitches on Android 4 and lower when using the minDate and maxDate options. - */ - open(options?: DatePickerAndroidOpenOptions): Promise - - /** - * A date has been selected. - */ - dateSetAction: 'dateSetAction' - - /** - * The dialog has been dismissed. - */ - dismissedAction: 'dismissedAction' + /** + * Opens the standard Android date picker dialog. + * + * The available keys for the options object are: + * - date (Date object or timestamp in milliseconds) - date to show by default + * - minDate (Date or timestamp in milliseconds) - minimum date that can be selected + * - maxDate (Date object or timestamp in milliseconds) - maximum date that can be selected + * - mode (enum('calendar', 'spinner', 'default')) - To set the date-picker mode to calendar/spinner/default + * - 'calendar': Show a date picker in calendar mode. + * - 'spinner': Show a date picker in spinner mode. + * - 'default': Show a default native date picker(spinner/calendar) based on android versions. + * + * Returns a Promise which will be invoked an object containing action, year, month (0-11), day if the user picked a date. + * If the user dismissed the dialog, the Promise will still be resolved with action being DatePickerAndroid.dismissedAction and all the other keys being undefined. + * Always check whether the action before reading the values. + * + * Note the native date picker dialog has some UI glitches on Android 4 and lower when using the minDate and maxDate options. + */ + open(options?: DatePickerAndroidOpenOptions): Promise; + + /** + * A date has been selected. + */ + dateSetAction: 'dateSetAction'; + + /** + * The dialog has been dismissed. + */ + dismissedAction: 'dismissedAction'; } export interface IntentAndroidStatic { - /** + /** * Starts a corresponding external activity for the given URL. For example, if the URL is "https://www.facebook.com", the system browser will be opened, or the "choose application" dialog will be shown. @@ -7544,9 +7555,9 @@ export interface IntentAndroidStatic { @deprecated */ - openURL(url: string): void + openURL(url: string): void; - /** + /** * Determine whether or not an installed app can handle a given URL. You can use other URLs, like a location (e.g. "geo:37.484847,-122.148386"), a contact, or any other URL that can be opened with {@code Intent.ACTION_VIEW}. @@ -7557,89 +7568,89 @@ export interface IntentAndroidStatic { @deprecated */ - canOpenURL(url: string, callback: (supported: boolean) => void): void + canOpenURL(url: string, callback: (supported: boolean) => void): void; - /** + /** * If the app launch was triggered by an app link with {@code Intent.ACTION_VIEW}, it will give the link url, otherwise it will give null Refer http://developer.android.com/training/app-indexing/deep-linking.html#handling-intents @deprecated */ - getInitialURL(callback: (url: string | null) => void): void + getInitialURL(callback: (url: string | null) => void): void; } export interface LinkingStatic extends NativeEventEmitter { - /** - * Add a handler to Linking changes by listening to the `url` event type - * and providing the handler - */ - addEventListener(type: string, handler: (event: {url: string}) => void): void - - /** - * Remove a handler by passing the `url` event type and the handler - */ - removeEventListener(type: string, handler: (event: {url: string}) => void): void - - /** - * Try to open the given url with any of the installed apps. - * You can use other URLs, like a location (e.g. "geo:37.484847,-122.148386"), a contact, or any other URL that can be opened with the installed apps. - * NOTE: This method will fail if the system doesn't know how to open the specified URL. If you're passing in a non-http(s) URL, it's best to check {@code canOpenURL} first. - * NOTE: For web URLs, the protocol ("http://", "https://") must be set accordingly! - */ - openURL(url: string): Promise - - /** - * Determine whether or not an installed app can handle a given URL. - * NOTE: For web URLs, the protocol ("http://", "https://") must be set accordingly! - * NOTE: As of iOS 9, your app needs to provide the LSApplicationQueriesSchemes key inside Info.plist. - * @param URL the URL to open - */ - canOpenURL(url: string): Promise - - /** - * If the app launch was triggered by an app link with, it will give the link url, otherwise it will give null - * NOTE: To support deep linking on Android, refer http://developer.android.com/training/app-indexing/deep-linking.html#handling-intents - */ - getInitialURL(): Promise - - /** - * Open the Settings app and displays the app’s custom settings, if it has any. - */ - openSettings(): Promise + /** + * Add a handler to Linking changes by listening to the `url` event type + * and providing the handler + */ + addEventListener(type: string, handler: (event: { url: string }) => void): void; + + /** + * Remove a handler by passing the `url` event type and the handler + */ + removeEventListener(type: string, handler: (event: { url: string }) => void): void; + + /** + * Try to open the given url with any of the installed apps. + * You can use other URLs, like a location (e.g. "geo:37.484847,-122.148386"), a contact, or any other URL that can be opened with the installed apps. + * NOTE: This method will fail if the system doesn't know how to open the specified URL. If you're passing in a non-http(s) URL, it's best to check {@code canOpenURL} first. + * NOTE: For web URLs, the protocol ("http://", "https://") must be set accordingly! + */ + openURL(url: string): Promise; + + /** + * Determine whether or not an installed app can handle a given URL. + * NOTE: For web URLs, the protocol ("http://", "https://") must be set accordingly! + * NOTE: As of iOS 9, your app needs to provide the LSApplicationQueriesSchemes key inside Info.plist. + * @param URL the URL to open + */ + canOpenURL(url: string): Promise; + + /** + * If the app launch was triggered by an app link with, it will give the link url, otherwise it will give null + * NOTE: To support deep linking on Android, refer http://developer.android.com/training/app-indexing/deep-linking.html#handling-intents + */ + getInitialURL(): Promise; + + /** + * Open the Settings app and displays the app’s custom settings, if it has any. + */ + openSettings(): Promise; } export interface LinkingIOSStatic { - /** + /** * Add a handler to LinkingIOS changes by listening to the url event type and providing the handler @deprecated */ - addEventListener(type: string, handler: (event: {url: string}) => void): void + addEventListener(type: string, handler: (event: { url: string }) => void): void; - /** + /** * Remove a handler by passing the url event type and the handler @deprecated */ - removeEventListener(type: string, handler: (event: {url: string}) => void): void + removeEventListener(type: string, handler: (event: { url: string }) => void): void; - /** + /** * Try to open the given url with any of the installed apps. @deprecated */ - openURL(url: string): void + openURL(url: string): void; - /** + /** * Determine whether or not an installed app can handle a given URL. The callback function will be called with bool supported as the only argument NOTE: As of iOS 9, your app needs to provide the LSApplicationQueriesSchemes key inside Info.plist. @deprecated */ - canOpenURL(url: string, callback: (supported: boolean) => void): void + canOpenURL(url: string, callback: (supported: boolean) => void): void; - /** + /** * If the app launch was triggered by an app link, it will pop the link url, otherwise it will return null @deprecated */ - popInitialURL(): string + popInitialURL(): string; } /** @@ -7649,195 +7660,180 @@ export interface LinkingIOSStatic { // @Deprecated ConnectionType export type ConnectionType = - | 'none' - | 'wifi' - | 'cell' - | 'unknown' - | 'NONE' - | 'MOBILE' - | 'WIFI' - | 'MOBILE_MMS' - | 'MOBILE_SUPL' - | 'MOBILE_DUN' - | 'MOBILE_HIPRI' - | 'WIMAX' - | 'BLUETOOTH' - | 'DUMMY' - | 'ETHERNET' - | 'MOBILE_FOTA' - | 'MOBILE_IMS' - | 'MOBILE_CBS' - | 'WIFI_P2P' - | 'MOBILE_IA' - | 'MOBILE_EMERGENCY' - | 'PROXY' - | 'VPN' - | 'UNKNOWN' - -export type EffectiveConnectionType = '2g' | '3g' | '4g' | 'unknown' + | "none" + | "wifi" + | "cell" + | "unknown" + | "NONE" + | "MOBILE" + | "WIFI" + | "MOBILE_MMS" + | "MOBILE_SUPL" + | "MOBILE_DUN" + | "MOBILE_HIPRI" + | "WIMAX" + | "BLUETOOTH" + | "DUMMY" + | "ETHERNET" + | "MOBILE_FOTA" + | "MOBILE_IMS" + | "MOBILE_CBS" + | "WIFI_P2P" + | "MOBILE_IA" + | "MOBILE_EMERGENCY" + | "PROXY" + | "VPN" + | "UNKNOWN"; + +export type EffectiveConnectionType = "2g" | "3g" | "4g" | "unknown"; export interface ConnectionInfo { - type: ConnectionType - effectiveType: EffectiveConnectionType + type: ConnectionType; + effectiveType: EffectiveConnectionType; } interface NetInfoEventListener { - remove: () => void + remove: () => void; } export interface NetInfoStatic { - /** - * This function is deprecated. Use `getConnectionInfo` instead. Returns a promise that - * resolves with one of the deprecated connectivity types listed above. - */ - fetch: () => Promise - - /** - * Adds an event handler. Supported events: - * - * - `connectionChange`: Fires when the network status changes. The argument to the event - * handler is an object with keys: - * - `type`: A `DeprecatedConnectionType` (listed above) - * - `effectiveType`: An `EffectiveConnectionType` (listed above) - * - `change`: This event is deprecated. Listen to `connectionChange` instead. Fires when - * the network status changes. The argument to the event handler is one of the deprecated - * connectivity types listed above. - */ - addEventListener: ( - eventName: string, - listener: (result: ConnectionInfo | ConnectionType) => void - ) => NetInfoEventListener - - /** - * Removes the listener for network status changes. - */ - removeEventListener: ( - eventName: string, - listener: (result: ConnectionInfo | ConnectionType) => void - ) => void - - /** - * Returns a promise that resolves to an object with `type` and `effectiveType` keys - * whose values are a `ConnectionType` and an `EffectiveConnectionType`, (described above), - * respectively. - */ - getConnectionInfo: () => Promise - - /** - * An object with the same methods as above but the listener receives a - * boolean which represents the internet connectivity. - * Use this if you are only interested with whether the device has internet - * connectivity. - */ - isConnected: { - fetch: () => Promise - - /** - * eventName is expected to be `change`(deprecated) or `connectionChange` - */ - addEventListener: (eventName: string, listener: (result: boolean) => void) => NetInfoEventListener - - /** - * eventName is expected to be `change`(deprecated) or `connectionChange` - */ - removeEventListener: (eventName: string, listener: (result: boolean) => void) => void - } - - /** - * Detect if the current active connection is - * metered or not. A network is classified as metered when the user is - * sensitive to heavy data usage on that connection due to monetary - * costs, data limitations or battery/performance issues. - */ - isConnectionExpensive: () => Promise + /** + * This function is deprecated. Use `getConnectionInfo` instead. Returns a promise that + * resolves with one of the deprecated connectivity types listed above. + */ + fetch: () => Promise; + + /** + * Adds an event handler. Supported events: + * + * - `connectionChange`: Fires when the network status changes. The argument to the event + * handler is an object with keys: + * - `type`: A `DeprecatedConnectionType` (listed above) + * - `effectiveType`: An `EffectiveConnectionType` (listed above) + * - `change`: This event is deprecated. Listen to `connectionChange` instead. Fires when + * the network status changes. The argument to the event handler is one of the deprecated + * connectivity types listed above. + */ + addEventListener: (eventName: string, listener: (result: ConnectionInfo | ConnectionType) => void) => NetInfoEventListener; + + /** + * Removes the listener for network status changes. + */ + removeEventListener: (eventName: string, listener: (result: ConnectionInfo | ConnectionType) => void) => void; + + /** + * Returns a promise that resolves to an object with `type` and `effectiveType` keys + * whose values are a `ConnectionType` and an `EffectiveConnectionType`, (described above), + * respectively. + */ + getConnectionInfo: () => Promise; + + /** + * An object with the same methods as above but the listener receives a + * boolean which represents the internet connectivity. + * Use this if you are only interested with whether the device has internet + * connectivity. + */ + isConnected: { + fetch: () => Promise; + + /** + * eventName is expected to be `change`(deprecated) or `connectionChange` + */ + addEventListener: (eventName: string, listener: (result: boolean) => void) => NetInfoEventListener; + + /** + * eventName is expected to be `change`(deprecated) or `connectionChange` + */ + removeEventListener: (eventName: string, listener: (result: boolean) => void) => void; + }; + + /** + * Detect if the current active connection is + * metered or not. A network is classified as metered when the user is + * sensitive to heavy data usage on that connection due to monetary + * costs, data limitations or battery/performance issues. + */ + isConnectionExpensive: () => Promise; } export interface PanResponderGestureState { - /** - * ID of the gestureState- persisted as long as there at least one touch on - */ - stateID: number - - /** - * the latest screen coordinates of the recently-moved touch - */ - moveX: number - - /** - * the latest screen coordinates of the recently-moved touch - */ - moveY: number - - /** - * the screen coordinates of the responder grant - */ - x0: number - - /** - * the screen coordinates of the responder grant - */ - y0: number - - /** - * accumulated distance of the gesture since the touch started - */ - dx: number - - /** - * accumulated distance of the gesture since the touch started - */ - dy: number - - /** - * current velocity of the gesture - */ - vx: number - - /** - * current velocity of the gesture - */ - vy: number - - /** - * Number of touches currently on screen - */ - numberActiveTouches: number - - // All `gestureState` accounts for timeStamps up until: - _accountsForMovesUpTo: number + /** + * ID of the gestureState- persisted as long as there at least one touch on + */ + stateID: number; + + /** + * the latest screen coordinates of the recently-moved touch + */ + moveX: number; + + /** + * the latest screen coordinates of the recently-moved touch + */ + moveY: number; + + /** + * the screen coordinates of the responder grant + */ + x0: number; + + /** + * the screen coordinates of the responder grant + */ + y0: number; + + /** + * accumulated distance of the gesture since the touch started + */ + dx: number; + + /** + * accumulated distance of the gesture since the touch started + */ + dy: number; + + /** + * current velocity of the gesture + */ + vx: number; + + /** + * current velocity of the gesture + */ + vy: number; + + /** + * Number of touches currently on screen + */ + numberActiveTouches: number; + + // All `gestureState` accounts for timeStamps up until: + _accountsForMovesUpTo: number; } /** * @see documentation of GestureResponderHandlers */ export interface PanResponderCallbacks { - onMoveShouldSetPanResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean - onStartShouldSetPanResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean - onPanResponderGrant?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderMove?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderRelease?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderTerminate?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - - onMoveShouldSetPanResponderCapture?: ( - e: GestureResponderEvent, - gestureState: PanResponderGestureState - ) => boolean - onStartShouldSetPanResponderCapture?: ( - e: GestureResponderEvent, - gestureState: PanResponderGestureState - ) => boolean - onPanResponderReject?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderStart?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderEnd?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void - onPanResponderTerminationRequest?: ( - e: GestureResponderEvent, - gestureState: PanResponderGestureState - ) => boolean - onShouldBlockNativeResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean + onMoveShouldSetPanResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; + onStartShouldSetPanResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; + onPanResponderGrant?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderMove?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderRelease?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderTerminate?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + + onMoveShouldSetPanResponderCapture?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; + onStartShouldSetPanResponderCapture?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; + onPanResponderReject?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderStart?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderEnd?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => void; + onPanResponderTerminationRequest?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; + onShouldBlockNativeResponder?: (e: GestureResponderEvent, gestureState: PanResponderGestureState) => boolean; } export interface PanResponderInstance { - panHandlers: GestureResponderHandlers + panHandlers: GestureResponderHandlers; } /** @@ -7849,450 +7845,446 @@ export interface PanResponderInstance { * For each handler, it provides a new gestureState object alongside the normal event. */ export interface PanResponderStatic { - /** - * @param config Enhanced versions of all of the responder callbacks - * that provide not only the typical `ResponderSyntheticEvent`, but also the - * `PanResponder` gesture state. Simply replace the word `Responder` with - * `PanResponder` in each of the typical `onResponder*` callbacks. For - * example, the `config` object would look like: - * - * - `onMoveShouldSetPanResponder: (e, gestureState) => {...}` - * - `onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}` - * - `onStartShouldSetPanResponder: (e, gestureState) => {...}` - * - `onStartShouldSetPanResponderCapture: (e, gestureState) => {...}` - * - `onPanResponderReject: (e, gestureState) => {...}` - * - `onPanResponderGrant: (e, gestureState) => {...}` - * - `onPanResponderStart: (e, gestureState) => {...}` - * - `onPanResponderEnd: (e, gestureState) => {...}` - * - `onPanResponderRelease: (e, gestureState) => {...}` - * - `onPanResponderMove: (e, gestureState) => {...}` - * - `onPanResponderTerminate: (e, gestureState) => {...}` - * - `onPanResponderTerminationRequest: (e, gestureState) => {...}` - * - `onShouldBlockNativeResponder: (e, gestureState) => {...}` - * - * In general, for events that have capture equivalents, we update the - * gestureState once in the capture phase and can use it in the bubble phase - * as well. - * - * Be careful with onStartShould* callbacks. They only reflect updated - * `gestureState` for start/end events that bubble/capture to the Node. - * Once the node is the responder, you can rely on every start/end event - * being processed by the gesture and `gestureState` being updated - * accordingly. (numberActiveTouches) may not be totally accurate unless you - * are the responder. - */ - create(config: PanResponderCallbacks): PanResponderInstance + /** + * @param config Enhanced versions of all of the responder callbacks + * that provide not only the typical `ResponderSyntheticEvent`, but also the + * `PanResponder` gesture state. Simply replace the word `Responder` with + * `PanResponder` in each of the typical `onResponder*` callbacks. For + * example, the `config` object would look like: + * + * - `onMoveShouldSetPanResponder: (e, gestureState) => {...}` + * - `onMoveShouldSetPanResponderCapture: (e, gestureState) => {...}` + * - `onStartShouldSetPanResponder: (e, gestureState) => {...}` + * - `onStartShouldSetPanResponderCapture: (e, gestureState) => {...}` + * - `onPanResponderReject: (e, gestureState) => {...}` + * - `onPanResponderGrant: (e, gestureState) => {...}` + * - `onPanResponderStart: (e, gestureState) => {...}` + * - `onPanResponderEnd: (e, gestureState) => {...}` + * - `onPanResponderRelease: (e, gestureState) => {...}` + * - `onPanResponderMove: (e, gestureState) => {...}` + * - `onPanResponderTerminate: (e, gestureState) => {...}` + * - `onPanResponderTerminationRequest: (e, gestureState) => {...}` + * - `onShouldBlockNativeResponder: (e, gestureState) => {...}` + * + * In general, for events that have capture equivalents, we update the + * gestureState once in the capture phase and can use it in the bubble phase + * as well. + * + * Be careful with onStartShould* callbacks. They only reflect updated + * `gestureState` for start/end events that bubble/capture to the Node. + * Once the node is the responder, you can rely on every start/end event + * being processed by the gesture and `gestureState` being updated + * accordingly. (numberActiveTouches) may not be totally accurate unless you + * are the responder. + */ + create(config: PanResponderCallbacks): PanResponderInstance; } export interface Rationale { - title: string - message: string - buttonPositive: string - buttonNegative?: string - buttonNeutral?: string + title: string; + message: string; + buttonPositive: string; + buttonNegative?: string; + buttonNeutral?: string; } export type Permission = - | 'android.permission.READ_CALENDAR' - | 'android.permission.WRITE_CALENDAR' - | 'android.permission.CAMERA' - | 'android.permission.READ_CONTACTS' - | 'android.permission.WRITE_CONTACTS' - | 'android.permission.GET_ACCOUNTS' - | 'android.permission.ACCESS_FINE_LOCATION' - | 'android.permission.ACCESS_COARSE_LOCATION' - | 'android.permission.RECORD_AUDIO' - | 'android.permission.READ_PHONE_STATE' - | 'android.permission.CALL_PHONE' - | 'android.permission.READ_CALL_LOG' - | 'android.permission.WRITE_CALL_LOG' - | 'com.android.voicemail.permission.ADD_VOICEMAIL' - | 'android.permission.USE_SIP' - | 'android.permission.PROCESS_OUTGOING_CALLS' - | 'android.permission.BODY_SENSORS' - | 'android.permission.SEND_SMS' - | 'android.permission.RECEIVE_SMS' - | 'android.permission.READ_SMS' - | 'android.permission.RECEIVE_WAP_PUSH' - | 'android.permission.RECEIVE_MMS' - | 'android.permission.READ_EXTERNAL_STORAGE' - | 'android.permission.WRITE_EXTERNAL_STORAGE' - -export type PermissionStatus = 'granted' | 'denied' | 'never_ask_again' + | "android.permission.READ_CALENDAR" + | "android.permission.WRITE_CALENDAR" + | "android.permission.CAMERA" + | "android.permission.READ_CONTACTS" + | "android.permission.WRITE_CONTACTS" + | "android.permission.GET_ACCOUNTS" + | "android.permission.ACCESS_FINE_LOCATION" + | "android.permission.ACCESS_COARSE_LOCATION" + | "android.permission.RECORD_AUDIO" + | "android.permission.READ_PHONE_STATE" + | "android.permission.CALL_PHONE" + | "android.permission.READ_CALL_LOG" + | "android.permission.WRITE_CALL_LOG" + | "com.android.voicemail.permission.ADD_VOICEMAIL" + | "android.permission.USE_SIP" + | "android.permission.PROCESS_OUTGOING_CALLS" + | "android.permission.BODY_SENSORS" + | "android.permission.SEND_SMS" + | "android.permission.RECEIVE_SMS" + | "android.permission.READ_SMS" + | "android.permission.RECEIVE_WAP_PUSH" + | "android.permission.RECEIVE_MMS" + | "android.permission.READ_EXTERNAL_STORAGE" + | "android.permission.WRITE_EXTERNAL_STORAGE"; + +export type PermissionStatus = "granted" | "denied" | "never_ask_again"; export interface PermissionsAndroidStatic { - /** - * A list of permission results that are returned - */ - RESULTS: {[key: string]: PermissionStatus} - /** - * A list of specified "dangerous" permissions that require prompting the user - */ - PERMISSIONS: {[key: string]: Permission} - new (): PermissionsAndroidStatic - /** - * Deprecated - */ - checkPermission(permission: Permission): Promise - /** - * Returns a promise resolving to a boolean value as to whether the specified - * permissions has been granted - */ - check(permission: Permission): Promise - /** - * Deprecated - */ - requestPermission(permission: Permission, rationale?: Rationale): Promise - /** - * Prompts the user to enable a permission and returns a promise resolving to a - * string value indicating whether the user allowed or denied the request - * - * If the optional rationale argument is included (which is an object with a - * title and message), this function checks with the OS whether it is necessary - * to show a dialog explaining why the permission is needed - * (https://developer.android.com/training/permissions/requesting.html#explain) - * and then shows the system permission dialog - */ - request(permission: Permission, rationale?: Rationale): Promise - /** - * Prompts the user to enable multiple permissions in the same dialog and - * returns an object with the permissions as keys and strings as values - * indicating whether the user allowed or denied the request - */ - requestMultiple(permissions: Array): Promise<{[key in Permission]: PermissionStatus}> + /** + * A list of permission results that are returned + */ + RESULTS: { [key: string]: PermissionStatus }; + /** + * A list of specified "dangerous" permissions that require prompting the user + */ + PERMISSIONS: { [key: string]: Permission }; + new (): PermissionsAndroidStatic; + /** + * Deprecated + */ + checkPermission(permission: Permission): Promise; + /** + * Returns a promise resolving to a boolean value as to whether the specified + * permissions has been granted + */ + check(permission: Permission): Promise; + /** + * Deprecated + */ + requestPermission(permission: Permission, rationale?: Rationale): Promise; + /** + * Prompts the user to enable a permission and returns a promise resolving to a + * string value indicating whether the user allowed or denied the request + * + * If the optional rationale argument is included (which is an object with a + * title and message), this function checks with the OS whether it is necessary + * to show a dialog explaining why the permission is needed + * (https://developer.android.com/training/permissions/requesting.html#explain) + * and then shows the system permission dialog + */ + request(permission: Permission, rationale?: Rationale): Promise; + /** + * Prompts the user to enable multiple permissions in the same dialog and + * returns an object with the permissions as keys and strings as values + * indicating whether the user allowed or denied the request + */ + requestMultiple(permissions: Array): Promise<{ [key in Permission]: PermissionStatus }>; } export interface PushNotificationPermissions { - alert?: boolean - badge?: boolean - sound?: boolean + alert?: boolean; + badge?: boolean; + sound?: boolean; +} + +export interface PushNotification { + /** + * An alias for `getAlert` to get the notification's main message string + */ + getMessage(): string | Object; + + /** + * Gets the sound string from the `aps` object + */ + getSound(): string; + + /** + * Gets the category string from the `aps` object + */ + getCategory(): string; + + /** + * Gets the notification's main message from the `aps` object + */ + getAlert(): string | Object; + + /** + * Gets the content-available number from the `aps` object + */ + getContentAvailable(): number; + + /** + * Gets the badge count number from the `aps` object + */ + getBadgeCount(): number; + + /** + * Gets the data object on the notif + */ + getData(): Object; + + /** + * iOS Only + * Signifies remote notification handling is complete + */ + finish(result: string): void; } -export interface PushNotification { - /** - * An alias for `getAlert` to get the notification's main message string - */ - getMessage(): string | Object - - /** - * Gets the sound string from the `aps` object - */ - getSound(): string - - /** - * Gets the category string from the `aps` object - */ - getCategory(): string - - /** - * Gets the notification's main message from the `aps` object - */ - getAlert(): string | Object - - /** - * Gets the content-available number from the `aps` object - */ - getContentAvailable(): number - - /** - * Gets the badge count number from the `aps` object - */ - getBadgeCount(): number - - /** - * Gets the data object on the notif - */ - getData(): Object - - /** - * iOS Only - * Signifies remote notification handling is complete - */ - finish(result: string): void -} +type PresentLocalNotificationDetails = { + alertBody: string; + alertAction: string; + soundName?: string; + category?: string; + userInfo?: Object; + applicationIconBadgeNumber?: number; +}; + +type ScheduleLocalNotificationDetails = { + alertAction?: string; + alertBody?: string; + alertTitle?: string + applicationIconBadgeNumber?: number; + category?: string; + fireDate?: number | string; + isSilent?: boolean; + repeatInterval?: 'year' | 'month' | 'week' | 'day' | 'hour' | 'minute'; + soundName?: string; + userInfo?: Object; +}; + +export type PushNotificationEventName = "notification" | "localNotification" | "register" | "registrationError"; + +type FetchResult = { + NewData: "UIBackgroundFetchResultNewData"; + NoData: "UIBackgroundFetchResultNoData"; + ResultFailed: "UIBackgroundFetchResultFailed"; +}; + +/** + * Handle push notifications for your app, including permission handling and icon badge number. + * @see https://facebook.github.io/react-native/docs/pushnotificationios.html#content + * + * //FIXME: BGR: The documentation seems completely off compared to the actual js implementation. I could never get the example to run + */ +export interface PushNotificationIOSStatic { + /** + * Schedules the localNotification for immediate presentation. + * details is an object containing: + * alertBody : The message displayed in the notification alert. + * alertAction : The "action" displayed beneath an actionable notification. Defaults to "view"; + * soundName : The sound played when the notification is fired (optional). + * category : The category of this notification, required for actionable notifications (optional). + * userInfo : An optional object containing additional notification data. + * applicationIconBadgeNumber (optional) : The number to display as the app's icon badge. The default value of this property is 0, which means that no badge is displayed. + */ + presentLocalNotification(details: PresentLocalNotificationDetails): void; + + /** + * Schedules the localNotification for future presentation. + * details is an object containing: + * fireDate : The date and time when the system should deliver the notification. + * alertBody : The message displayed in the notification alert. + * alertAction : The "action" displayed beneath an actionable notification. Defaults to "view"; + * soundName : The sound played when the notification is fired (optional). + * category : The category of this notification, required for actionable notifications (optional). + * userInfo : An optional object containing additional notification data. + * applicationIconBadgeNumber (optional) : The number to display as the app's icon badge. Setting the number to 0 removes the icon badge. + */ + scheduleLocalNotification(details: ScheduleLocalNotificationDetails): void; + + /** + * Cancels all scheduled localNotifications + */ + cancelAllLocalNotifications(): void; + + /** + * Cancel local notifications. + * Optionally restricts the set of canceled notifications to those notifications whose userInfo fields match the corresponding fields in the userInfo argument. + */ + cancelLocalNotifications(userInfo: Object): void; + + /** + * Sets the badge number for the app icon on the home screen + */ + setApplicationIconBadgeNumber(number: number): void; + + /** + * Gets the current badge number for the app icon on the home screen + */ + getApplicationIconBadgeNumber(callback: (badge: number) => void): void; + + /** + * Gets the local notifications that are currently scheduled. + */ + getScheduledLocalNotifications(callback: (notifications: ScheduleLocalNotificationDetails[]) => void): void; + + /** + * Attaches a listener to remote notifications while the app is running in the + * foreground or the background. + * + * The handler will get be invoked with an instance of `PushNotificationIOS` + * + * The type MUST be 'notification' + */ + addEventListener( + type: "notification" | "localNotification", + handler: (notification: PushNotification) => void + ): void; + + /** + * Fired when the user registers for remote notifications. + * + * The handler will be invoked with a hex string representing the deviceToken. + * + * The type MUST be 'register' + */ + addEventListener(type: "register", handler: (deviceToken: string) => void): void; + + /** + * Fired when the user fails to register for remote notifications. + * Typically occurs when APNS is having issues, or the device is a simulator. + * + * The handler will be invoked with {message: string, code: number, details: any}. + * + * The type MUST be 'registrationError' + */ + addEventListener( + type: "registrationError", + handler: (error: { message: string; code: number; details: any }) => void + ): void; + + /** + * Removes the event listener. Do this in `componentWillUnmount` to prevent + * memory leaks + */ + removeEventListener( + type: PushNotificationEventName, + handler: + | ((notification: PushNotification) => void) + | ((deviceToken: string) => void) + | ((error: { message: string; code: number; details: any }) => void) + ): void; + + /** + * Requests all notification permissions from iOS, prompting the user's + * dialog box. + */ + requestPermissions(permissions?: PushNotificationPermissions[]): void; + + /** + * Requests all notification permissions from iOS, prompting the user's + * dialog box. + */ + requestPermissions(permissions?: PushNotificationPermissions): Promise; -type PresentLocalNotificationDetails = { - alertBody: string - alertAction: string - soundName?: string - category?: string - userInfo?: Object - applicationIconBadgeNumber?: number -} + /** + * Unregister for all remote notifications received via Apple Push + * Notification service. + * You should call this method in rare circumstances only, such as when + * a new version of the app removes support for all types of remote + * notifications. Users can temporarily prevent apps from receiving + * remote notifications through the Notifications section of the + * Settings app. Apps unregistered through this method can always + * re-register. + */ + abandonPermissions(): void; -type ScheduleLocalNotificationDetails = { - alertAction?: string - alertBody?: string - alertTitle?: string - applicationIconBadgeNumber?: number - category?: string - fireDate?: number | string - isSilent?: boolean - repeatInterval?: 'year' | 'month' | 'week' | 'day' | 'hour' | 'minute' - soundName?: string - userInfo?: Object -} - -export type PushNotificationEventName = - | 'notification' - | 'localNotification' - | 'register' - | 'registrationError' + /** + * See what push permissions are currently enabled. `callback` will be + * invoked with a `permissions` object: + * + * - `alert` :boolean + * - `badge` :boolean + * - `sound` :boolean + */ + checkPermissions(callback: (permissions: PushNotificationPermissions) => void): void; -type FetchResult = { - NewData: 'UIBackgroundFetchResultNewData' - NoData: 'UIBackgroundFetchResultNoData' - ResultFailed: 'UIBackgroundFetchResultFailed' -} + /** + * This method returns a promise that resolves to either the notification + * object if the app was launched by a push notification, or `null` otherwise. + */ + getInitialNotification(): Promise; -/** - * Handle push notifications for your app, including permission handling and icon badge number. - * @see https://facebook.github.io/react-native/docs/pushnotificationios.html#content - * - * //FIXME: BGR: The documentation seems completely off compared to the actual js implementation. I could never get the example to run - */ -export interface PushNotificationIOSStatic { - /** - * Schedules the localNotification for immediate presentation. - * details is an object containing: - * alertBody : The message displayed in the notification alert. - * alertAction : The "action" displayed beneath an actionable notification. Defaults to "view"; - * soundName : The sound played when the notification is fired (optional). - * category : The category of this notification, required for actionable notifications (optional). - * userInfo : An optional object containing additional notification data. - * applicationIconBadgeNumber (optional) : The number to display as the app's icon badge. The default value of this property is 0, which means that no badge is displayed. - */ - presentLocalNotification(details: PresentLocalNotificationDetails): void - - /** - * Schedules the localNotification for future presentation. - * details is an object containing: - * fireDate : The date and time when the system should deliver the notification. - * alertBody : The message displayed in the notification alert. - * alertAction : The "action" displayed beneath an actionable notification. Defaults to "view"; - * soundName : The sound played when the notification is fired (optional). - * category : The category of this notification, required for actionable notifications (optional). - * userInfo : An optional object containing additional notification data. - * applicationIconBadgeNumber (optional) : The number to display as the app's icon badge. Setting the number to 0 removes the icon badge. - */ - scheduleLocalNotification(details: ScheduleLocalNotificationDetails): void - - /** - * Cancels all scheduled localNotifications - */ - cancelAllLocalNotifications(): void - - /** - * Cancel local notifications. - * Optionally restricts the set of canceled notifications to those notifications whose userInfo fields match the corresponding fields in the userInfo argument. - */ - cancelLocalNotifications(userInfo: Object): void - - /** - * Sets the badge number for the app icon on the home screen - */ - setApplicationIconBadgeNumber(number: number): void - - /** - * Gets the current badge number for the app icon on the home screen - */ - getApplicationIconBadgeNumber(callback: (badge: number) => void): void - - /** - * Gets the local notifications that are currently scheduled. - */ - getScheduledLocalNotifications(callback: (notifications: ScheduleLocalNotificationDetails[]) => void): void - - /** - * Attaches a listener to remote notifications while the app is running in the - * foreground or the background. - * - * The handler will get be invoked with an instance of `PushNotificationIOS` - * - * The type MUST be 'notification' - */ - addEventListener( - type: 'notification' | 'localNotification', - handler: (notification: PushNotification) => void - ): void - - /** - * Fired when the user registers for remote notifications. - * - * The handler will be invoked with a hex string representing the deviceToken. - * - * The type MUST be 'register' - */ - addEventListener(type: 'register', handler: (deviceToken: string) => void): void - - /** - * Fired when the user fails to register for remote notifications. - * Typically occurs when APNS is having issues, or the device is a simulator. - * - * The handler will be invoked with {message: string, code: number, details: any}. - * - * The type MUST be 'registrationError' - */ - addEventListener( - type: 'registrationError', - handler: (error: {message: string; code: number; details: any}) => void - ): void - - /** - * Removes the event listener. Do this in `componentWillUnmount` to prevent - * memory leaks - */ - removeEventListener( - type: PushNotificationEventName, - handler: - | ((notification: PushNotification) => void) - | ((deviceToken: string) => void) - | ((error: {message: string; code: number; details: any}) => void) - ): void - - /** - * Requests all notification permissions from iOS, prompting the user's - * dialog box. - */ - requestPermissions(permissions?: PushNotificationPermissions[]): void - - /** - * Requests all notification permissions from iOS, prompting the user's - * dialog box. - */ - requestPermissions(permissions?: PushNotificationPermissions): Promise - - /** - * Unregister for all remote notifications received via Apple Push - * Notification service. - * You should call this method in rare circumstances only, such as when - * a new version of the app removes support for all types of remote - * notifications. Users can temporarily prevent apps from receiving - * remote notifications through the Notifications section of the - * Settings app. Apps unregistered through this method can always - * re-register. - */ - abandonPermissions(): void - - /** - * See what push permissions are currently enabled. `callback` will be - * invoked with a `permissions` object: - * - * - `alert` :boolean - * - `badge` :boolean - * - `sound` :boolean - */ - checkPermissions(callback: (permissions: PushNotificationPermissions) => void): void - - /** - * This method returns a promise that resolves to either the notification - * object if the app was launched by a push notification, or `null` otherwise. - */ - getInitialNotification(): Promise - - /** - * iOS fetch results that best describe the result of a finished remote notification handler. - * For a list of possible values, see `PushNotificationIOS.FetchResult`. - */ - FetchResult: FetchResult + /** + * iOS fetch results that best describe the result of a finished remote notification handler. + * For a list of possible values, see `PushNotificationIOS.FetchResult`. + */ + FetchResult: FetchResult; } export interface SettingsStatic { - get(key: string): any - set(settings: Object): void - watchKeys(keys: string | Array, callback: () => void): number - clearWatch(watchId: number): void + get(key: string): any; + set(settings: Object): void; + watchKeys(keys: string | Array, callback: (() => void)): number; + clearWatch(watchId: number): void; } -export type StatusBarStyle = 'default' | 'light-content' | 'dark-content' +export type StatusBarStyle = "default" | "light-content" | "dark-content"; -export type StatusBarAnimation = 'none' | 'fade' | 'slide' +export type StatusBarAnimation = "none" | "fade" | "slide"; export interface StatusBarPropsIOS { - /** - * Sets the color of the status bar text. - */ - barStyle?: StatusBarStyle + /** + * Sets the color of the status bar text. + */ + barStyle?: StatusBarStyle; - /** - * If the network activity indicator should be visible. - */ - networkActivityIndicatorVisible?: boolean + /** + * If the network activity indicator should be visible. + */ + networkActivityIndicatorVisible?: boolean; - /** - * The transition effect when showing and hiding the status bar using - * the hidden prop. Defaults to 'fade'. - */ - showHideTransition?: 'fade' | 'slide' + /** + * The transition effect when showing and hiding the status bar using + * the hidden prop. Defaults to 'fade'. + */ + showHideTransition?: "fade" | "slide"; } export interface StatusBarPropsAndroid { - /** - * The background color of the status bar. - */ - backgroundColor?: string + /** + * The background color of the status bar. + */ + backgroundColor?: string; - /** - * If the status bar is translucent. When translucent is set to true, - * the app will draw under the status bar. This is useful when using a - * semi transparent status bar color. - */ - translucent?: boolean + /** + * If the status bar is translucent. When translucent is set to true, + * the app will draw under the status bar. This is useful when using a + * semi transparent status bar color. + */ + translucent?: boolean; } export interface StatusBarProps extends StatusBarPropsIOS, StatusBarPropsAndroid { - /** - * If the transition between status bar property changes should be - * animated. Supported for backgroundColor, barStyle and hidden. - */ - animated?: boolean + /** + * If the transition between status bar property changes should be + * animated. Supported for backgroundColor, barStyle and hidden. + */ + animated?: boolean; - /** - * If the status bar is hidden. - */ - hidden?: boolean + /** + * If the status bar is hidden. + */ + hidden?: boolean; } export class StatusBar extends React.Component { - /** - * The current height of the status bar on the device. - * @platform android - */ - static currentHeight?: number - - /** - * Show or hide the status bar - * @param hidden The dialog's title. - * @param animation Optional animation when - * changing the status bar hidden property. - */ - static setHidden: (hidden: boolean, animation?: StatusBarAnimation) => void - - /** - * Set the status bar style - * @param style Status bar style to set - * @param animated Animate the style change. - */ - static setBarStyle: (style: StatusBarStyle, animated?: boolean) => void - - /** - * Control the visibility of the network activity indicator - * @param visible Show the indicator. - */ - static setNetworkActivityIndicatorVisible: (visible: boolean) => void - - /** - * Set the background color for the status bar - * @param color Background color. - * @param animated Animate the style change. - */ - static setBackgroundColor: (color: string, animated?: boolean) => void - - /** - * Control the translucency of the status bar - * @param translucent Set as translucent. - */ - static setTranslucent: (translucent: boolean) => void + /** + * The current height of the status bar on the device. + * @platform android + */ + static currentHeight?: number; + + /** + * Show or hide the status bar + * @param hidden The dialog's title. + * @param animation Optional animation when + * changing the status bar hidden property. + */ + static setHidden: (hidden: boolean, animation?: StatusBarAnimation) => void; + + /** + * Set the status bar style + * @param style Status bar style to set + * @param animated Animate the style change. + */ + static setBarStyle: (style: StatusBarStyle, animated?: boolean) => void; + + /** + * Control the visibility of the network activity indicator + * @param visible Show the indicator. + */ + static setNetworkActivityIndicatorVisible: (visible: boolean) => void; + + /** + * Set the background color for the status bar + * @param color Background color. + * @param animated Animate the style change. + */ + static setBackgroundColor: (color: string, animated?: boolean) => void; + + /** + * Control the translucency of the status bar + * @param translucent Set as translucent. + */ + static setTranslucent: (translucent: boolean) => void; } /** @@ -8302,23 +8294,23 @@ export class StatusBar extends React.Component { export interface StatusBarIOSStatic extends NativeEventEmitter {} export interface TimePickerAndroidOpenOptions { - hour?: number - minute?: number - is24Hour?: boolean - mode?: 'clock' | 'spinner' | 'default' + hour?: number; + minute?: number; + is24Hour?: boolean; + mode?: "clock" | "spinner" | "default"; } export interface TimePickerAndroidTimeSetAction { - action: 'timeSetAction' - hour: number - minute: number + action: 'timeSetAction'; + hour: number; + minute: number; } export interface TimePickerAndroidDismissedAction { - action: 'dismissedAction' + action: 'dismissedAction'; } -export type TimePickerAndroidOpenReturn = TimePickerAndroidTimeSetAction | TimePickerAndroidDismissedAction +export type TimePickerAndroidOpenReturn = TimePickerAndroidTimeSetAction | TimePickerAndroidDismissedAction; /** * Opens the standard Android time picker dialog. @@ -8341,36 +8333,36 @@ export type TimePickerAndroidOpenReturn = TimePickerAndroidTimeSetAction | TimeP * ``` */ export interface TimePickerAndroidStatic { - /** - * Opens the standard Android time picker dialog. - * - * The available keys for the `options` object are: - * * `hour` (0-23) - the hour to show, defaults to the current time - * * `minute` (0-59) - the minute to show, defaults to the current time - * * `is24Hour` (boolean) - If `true`, the picker uses the 24-hour format. If `false`, - * the picker shows an AM/PM chooser. If undefined, the default for the current locale - * is used. - * * `mode` (enum('clock', 'spinner', 'default')) - set the time picker mode - * * 'clock': Show a time picker in clock mode. - * * 'spinner': Show a time picker in spinner mode. - * * 'default': Show a default time picker based on Android versions. - * - * Returns a Promise which will be invoked an object containing `action`, `hour` (0-23), - * `minute` (0-59) if the user picked a time. If the user dismissed the dialog, the Promise will - * still be resolved with action being `TimePickerAndroid.dismissedAction` and all the other keys - * being undefined. **Always** check whether the `action` before reading the values. - */ - open(options: TimePickerAndroidOpenOptions): Promise - - /** - * A time has been selected. - */ - timeSetAction: 'timeSetAction' - - /** - * The dialog has been dismissed. - */ - dismissedAction: 'dismissedAction' + /** + * Opens the standard Android time picker dialog. + * + * The available keys for the `options` object are: + * * `hour` (0-23) - the hour to show, defaults to the current time + * * `minute` (0-59) - the minute to show, defaults to the current time + * * `is24Hour` (boolean) - If `true`, the picker uses the 24-hour format. If `false`, + * the picker shows an AM/PM chooser. If undefined, the default for the current locale + * is used. + * * `mode` (enum('clock', 'spinner', 'default')) - set the time picker mode + * * 'clock': Show a time picker in clock mode. + * * 'spinner': Show a time picker in spinner mode. + * * 'default': Show a default time picker based on Android versions. + * + * Returns a Promise which will be invoked an object containing `action`, `hour` (0-23), + * `minute` (0-59) if the user picked a time. If the user dismissed the dialog, the Promise will + * still be resolved with action being `TimePickerAndroid.dismissedAction` and all the other keys + * being undefined. **Always** check whether the `action` before reading the values. + */ + open(options: TimePickerAndroidOpenOptions): Promise; + + /** + * A time has been selected. + */ + timeSetAction: 'timeSetAction'; + + /** + * The dialog has been dismissed. + */ + dismissedAction: 'dismissedAction'; } /** @@ -8384,199 +8376,199 @@ export interface TimePickerAndroidStatic { * ToastAndroid.TOP, ToastAndroid.BOTTOM, ToastAndroid.CENTER */ export interface ToastAndroidStatic { - /** - * String message: A string with the text to toast - * int duration: The duration of the toast. - * May be ToastAndroid.SHORT or ToastAndroid.LONG - */ - show(message: string, duration: number): void - /** `gravity` may be ToastAndroid.TOP, ToastAndroid.BOTTOM, ToastAndroid.CENTER */ - showWithGravity(message: string, duration: number, gravity: number): void - // Toast duration constants - SHORT: number - LONG: number - // Toast gravity constants - TOP: number - BOTTOM: number - CENTER: number + /** + * String message: A string with the text to toast + * int duration: The duration of the toast. + * May be ToastAndroid.SHORT or ToastAndroid.LONG + */ + show(message: string, duration: number): void; + /** `gravity` may be ToastAndroid.TOP, ToastAndroid.BOTTOM, ToastAndroid.CENTER */ + showWithGravity(message: string, duration: number, gravity: number): void; + // Toast duration constants + SHORT: number; + LONG: number; + // Toast gravity constants + TOP: number; + BOTTOM: number; + CENTER: number; } export interface UIManagerStatic { - /** - * Capture an image of the screen, window or an individual view. The image - * will be stored in a temporary file that will only exist for as long as the - * app is running. - * - * The `view` argument can be the literal string `window` if you want to - * capture the entire window, or it can be a reference to a specific - * React Native component. - * - * The `options` argument may include: - * - width/height (number) - the width and height of the image to capture. - * - format (string) - either 'png' or 'jpeg'. Defaults to 'png'. - * - quality (number) - the quality when using jpeg. 0.0 - 1.0 (default). - * - * Returns a Promise (tempFilePath) - * @platform ios - */ - takeSnapshot: ( - view?: 'window' | React.ReactElement | number, - options?: { - width?: number - height?: number - format?: 'png' | 'jpeg' - quality?: number - } - ) => Promise - - /** - * Determines the location on screen, width, and height of the given view and - * returns the values via an async callback. If successful, the callback will - * be called with the following arguments: - * - * - x - * - y - * - width - * - height - * - pageX - * - pageY - * - * Note that these measurements are not available until after the rendering - * has been completed in native. If you need the measurements as soon as - * possible, consider using the [`onLayout` - * prop](docs/view.html#onlayout) instead. - */ - measure(node: number, callback: MeasureOnSuccessCallback): void - - /** - * Determines the location of the given view in the window and returns the - * values via an async callback. If the React root view is embedded in - * another native view, this will give you the absolute coordinates. If - * successful, the callback will be called with the following - * arguments: - * - * - x - * - y - * - width - * - height - * - * Note that these measurements are not available until after the rendering - * has been completed in native. - */ - measureInWindow(node: number, callback: MeasureInWindowOnSuccessCallback): void - - /** - * Like [`measure()`](#measure), but measures the view relative an ancestor, - * specified as `relativeToNativeNode`. This means that the returned x, y - * are relative to the origin x, y of the ancestor view. - * - * As always, to obtain a native node handle for a component, you can use - * `React.findNodeHandle(component)`. - */ - measureLayout( - node: number, - relativeToNativeNode: number, - onFail: () => void /* currently unused */, - onSuccess: MeasureLayoutOnSuccessCallback - ): void - - /** - * Automatically animates views to their new positions when the - * next layout happens. - * - * A common way to use this API is to call it before calling `setState`. - * - * Note that in order to get this to work on **Android** you need to set the following flags via `UIManager`: - * - * UIManager.setLayoutAnimationEnabledExperimental && UIManager.setLayoutAnimationEnabledExperimental(true); - */ - setLayoutAnimationEnabledExperimental(value: boolean): void - - /** - * Used to display an Android PopupMenu. If a menu item is pressed, the success callback will - * be called with the following arguments: - * - * - item - the menu item. - * - index - index of the pressed item in array. Returns `undefined` if cancelled. - * - * To obtain a native node handle for a component, you can use - * `React.findNodeHandle(component)`. - * - * Note that this works only on Android - */ - showPopupMenu( - node: number, - items: string[], - error: () => void /* currently unused */, - success: (item: string, index: number | undefined) => void - ): void + /** + * Capture an image of the screen, window or an individual view. The image + * will be stored in a temporary file that will only exist for as long as the + * app is running. + * + * The `view` argument can be the literal string `window` if you want to + * capture the entire window, or it can be a reference to a specific + * React Native component. + * + * The `options` argument may include: + * - width/height (number) - the width and height of the image to capture. + * - format (string) - either 'png' or 'jpeg'. Defaults to 'png'. + * - quality (number) - the quality when using jpeg. 0.0 - 1.0 (default). + * + * Returns a Promise (tempFilePath) + * @platform ios + */ + takeSnapshot: ( + view?: "window" | React.ReactElement | number, + options?: { + width?: number; + height?: number; + format?: "png" | "jpeg"; + quality?: number; + } + ) => Promise; + + /** + * Determines the location on screen, width, and height of the given view and + * returns the values via an async callback. If successful, the callback will + * be called with the following arguments: + * + * - x + * - y + * - width + * - height + * - pageX + * - pageY + * + * Note that these measurements are not available until after the rendering + * has been completed in native. If you need the measurements as soon as + * possible, consider using the [`onLayout` + * prop](docs/view.html#onlayout) instead. + */ + measure(node: number, callback: MeasureOnSuccessCallback): void; + + /** + * Determines the location of the given view in the window and returns the + * values via an async callback. If the React root view is embedded in + * another native view, this will give you the absolute coordinates. If + * successful, the callback will be called with the following + * arguments: + * + * - x + * - y + * - width + * - height + * + * Note that these measurements are not available until after the rendering + * has been completed in native. + */ + measureInWindow(node: number, callback: MeasureInWindowOnSuccessCallback): void; + + /** + * Like [`measure()`](#measure), but measures the view relative an ancestor, + * specified as `relativeToNativeNode`. This means that the returned x, y + * are relative to the origin x, y of the ancestor view. + * + * As always, to obtain a native node handle for a component, you can use + * `React.findNodeHandle(component)`. + */ + measureLayout( + node: number, + relativeToNativeNode: number, + onFail: () => void /* currently unused */, + onSuccess: MeasureLayoutOnSuccessCallback + ): void; + + /** + * Automatically animates views to their new positions when the + * next layout happens. + * + * A common way to use this API is to call it before calling `setState`. + * + * Note that in order to get this to work on **Android** you need to set the following flags via `UIManager`: + * + * UIManager.setLayoutAnimationEnabledExperimental && UIManager.setLayoutAnimationEnabledExperimental(true); + */ + setLayoutAnimationEnabledExperimental(value: boolean): void; + + /** + * Used to display an Android PopupMenu. If a menu item is pressed, the success callback will + * be called with the following arguments: + * + * - item - the menu item. + * - index - index of the pressed item in array. Returns `undefined` if cancelled. + * + * To obtain a native node handle for a component, you can use + * `React.findNodeHandle(component)`. + * + * Note that this works only on Android + */ + showPopupMenu( + node: number, + items: string[], + error: () => void, /* currently unused */ + success: (item: string, index: number | undefined) => void + ): void; } export interface SwitchPropsIOS extends ViewProps { - /** - * Background color when the switch is turned on. - * - * @deprecated - */ - onTintColor?: string - - /** - * Color of the foreground switch grip. - * - * @deprecated - */ - thumbTintColor?: string - - /** - * Background color when the switch is turned off. - * - * @deprecated - */ - tintColor?: string + /** + * Background color when the switch is turned on. + * + * @deprecated + */ + onTintColor?: string; + + /** + * Color of the foreground switch grip. + * + * @deprecated + */ + thumbTintColor?: string; + + /** + * Background color when the switch is turned off. + * + * @deprecated + */ + tintColor?: string; } export interface SwitchProps extends SwitchPropsIOS { - /** - * Color of the foreground switch grip. - */ - thumbColor?: string - - /** - * Custom colors for the switch track - * - * Color when false and color when true - */ - trackColor?: {false: string; true: string} - - /** - * If true the user won't be able to toggle the switch. - * Default value is false. - */ - disabled?: boolean - - /** - * Invoked with the new value when the value changes. - */ - onValueChange?: (value: boolean) => void - - /** - * Used to locate this view in end-to-end tests. - */ - testID?: string - - /** - * The value of the switch. If true the switch will be turned on. - * Default value is false. - */ - value?: boolean - - /** - * On iOS, custom color for the background. - * Can be seen when the switch value is false or when the switch is disabled. - */ - ios_backgroundColor?: string - - style?: StyleProp + /** + * Color of the foreground switch grip. + */ + thumbColor?: string; + + /** + * Custom colors for the switch track + * + * Color when false and color when true + */ + trackColor?: { false: string; true: string }; + + /** + * If true the user won't be able to toggle the switch. + * Default value is false. + */ + disabled?: boolean; + + /** + * Invoked with the new value when the value changes. + */ + onValueChange?: (value: boolean) => void; + + /** + * Used to locate this view in end-to-end tests. + */ + testID?: string; + + /** + * The value of the switch. If true the switch will be turned on. + * Default value is false. + */ + value?: boolean; + + /** + * On iOS, custom color for the background. + * Can be seen when the switch value is false or when the switch is disabled. + */ + ios_backgroundColor?: string; + + style?: StyleProp; } /** @@ -8588,7 +8580,7 @@ export interface SwitchProps extends SwitchPropsIOS { * the supplied `value` prop instead of the expected result of any user actions. */ declare class SwitchComponent extends React.Component {} -declare const SwitchBase: Constructor & typeof SwitchComponent +declare const SwitchBase: Constructor & typeof SwitchComponent; export class Switch extends SwitchBase {} /** @@ -8605,10 +8597,10 @@ export class Switch extends SwitchBase {} * @see https://facebook.github.io/react-native/docs/vibrationios.html#content */ export interface VibrationIOSStatic { - /** - * @deprecated - */ - vibrate(): void + /** + * @deprecated + */ + vibrate(): void; } /** @@ -8635,12 +8627,12 @@ export interface VibrationIOSStatic { * V(fixed) --wait(1s)--> V(fixed) --wait(2s)--> V(fixed) --wait(3s)--> V(fixed) */ export interface VibrationStatic { - vibrate(pattern: number | number[], repeat?: boolean): void + vibrate(pattern: number | number[], repeat?: boolean): void; - /** - * Stop vibration - */ - cancel(): void + /** + * Stop vibration + */ + cancel(): void; } /** @@ -8648,492 +8640,472 @@ export interface VibrationStatic { * but this cool website has nice visual illustrations of what they represent: * http://xaedes.de/dev/transitions/ */ -export type EasingFunction = (value: number) => number +export type EasingFunction = (value: number) => number; export interface EasingStatic { - step0: EasingFunction - step1: EasingFunction - linear: EasingFunction - ease: EasingFunction - quad: EasingFunction - cubic: EasingFunction - poly(n: number): EasingFunction - sin: EasingFunction - circle: EasingFunction - exp: EasingFunction - elastic(bounciness: number): EasingFunction - back(s: number): EasingFunction - bounce: EasingFunction - bezier(x1: number, y1: number, x2: number, y2: number): EasingFunction - in(easing: EasingFunction): EasingFunction - out(easing: EasingFunction): EasingFunction - inOut(easing: EasingFunction): EasingFunction + step0: EasingFunction; + step1: EasingFunction; + linear: EasingFunction; + ease: EasingFunction; + quad: EasingFunction; + cubic: EasingFunction; + poly(n: number): EasingFunction; + sin: EasingFunction; + circle: EasingFunction; + exp: EasingFunction; + elastic(bounciness: number): EasingFunction; + back(s: number): EasingFunction; + bounce: EasingFunction; + bezier(x1: number, y1: number, x2: number, y2: number): EasingFunction; + in(easing: EasingFunction): EasingFunction; + out(easing: EasingFunction): EasingFunction; + inOut(easing: EasingFunction): EasingFunction; } export namespace Animated { - type AnimatedValue = Value - type AnimatedValueXY = ValueXY + type AnimatedValue = Value; + type AnimatedValueXY = ValueXY; + + type Base = Animated; - type Base = Animated + class Animated { + // Internal class, no public API. + } - class Animated { - // Internal class, no public API. - } + class AnimatedWithChildren extends Animated { + // Internal class, no public API. + } - class AnimatedWithChildren extends Animated { - // Internal class, no public API. - } + class AnimatedInterpolation extends AnimatedWithChildren { + interpolate(config: InterpolationConfigType): AnimatedInterpolation; + } - class AnimatedInterpolation extends AnimatedWithChildren { - interpolate(config: InterpolationConfigType): AnimatedInterpolation - } + type ExtrapolateType = "extend" | "identity" | "clamp"; - type ExtrapolateType = 'extend' | 'identity' | 'clamp' + type InterpolationConfigType = { + inputRange: number[]; + outputRange: number[] | string[]; + easing?: ((input: number) => number); + extrapolate?: ExtrapolateType; + extrapolateLeft?: ExtrapolateType; + extrapolateRight?: ExtrapolateType; + }; - type InterpolationConfigType = { - inputRange: number[] - outputRange: number[] | string[] - easing?: (input: number) => number - extrapolate?: ExtrapolateType - extrapolateLeft?: ExtrapolateType - extrapolateRight?: ExtrapolateType - } + type ValueListenerCallback = (state: { value: number }) => void; - type ValueListenerCallback = (state: {value: number}) => void + /** + * Standard value for driving animations. One `Animated.Value` can drive + * multiple properties in a synchronized fashion, but can only be driven by one + * mechanism at a time. Using a new mechanism (e.g. starting a new animation, + * or calling `setValue`) will stop any previous ones. + */ + export class Value extends AnimatedWithChildren { + constructor(value: number); + + /** + * Directly set the value. This will stop any animations running on the value + * and update all the bound properties. + */ + setValue(value: number): void; + + /** + * Sets an offset that is applied on top of whatever value is set, whether via + * `setValue`, an animation, or `Animated.event`. Useful for compensating + * things like the start of a pan gesture. + */ + setOffset(offset: number): void; + + /** + * Merges the offset value into the base value and resets the offset to zero. + * The final output of the value is unchanged. + */ + flattenOffset(): void; + + /** + * Sets the offset value to the base value, and resets the base value to zero. + * The final output of the value is unchanged. + */ + extractOffset(): void; + + /** + * Adds an asynchronous listener to the value so you can observe updates from + * animations. This is useful because there is no way to + * synchronously read the value because it might be driven natively. + */ + addListener(callback: ValueListenerCallback): string; + + removeListener(id: string): void; + + removeAllListeners(): void; + + /** + * Stops any running animation or tracking. `callback` is invoked with the + * final value after stopping the animation, which is useful for updating + * state to match the animation position with layout. + */ + stopAnimation(callback?: (value: number) => void): void; + + /** + * Interpolates the value before updating the property, e.g. mapping 0-1 to + * 0-10. + */ + interpolate(config: InterpolationConfigType): AnimatedInterpolation; + } - /** - * Standard value for driving animations. One `Animated.Value` can drive - * multiple properties in a synchronized fashion, but can only be driven by one - * mechanism at a time. Using a new mechanism (e.g. starting a new animation, - * or calling `setValue`) will stop any previous ones. - */ - export class Value extends AnimatedWithChildren { - constructor(value: number) + type ValueXYListenerCallback = (value: { x: number; y: number }) => void; /** - * Directly set the value. This will stop any animations running on the value - * and update all the bound properties. + * 2D Value for driving 2D animations, such as pan gestures. Almost identical + * API to normal `Animated.Value`, but multiplexed. Contains two regular + * `Animated.Value`s under the hood. */ - setValue(value: number): void + export class ValueXY extends AnimatedWithChildren { + x: AnimatedValue; + y: AnimatedValue; + + constructor(valueIn?: { x: number | AnimatedValue; y: number | AnimatedValue }); + + setValue(value: { x: number; y: number }): void; + + setOffset(offset: { x: number; y: number }): void; + + flattenOffset(): void; + + extractOffset(): void; + + stopAnimation(callback?: (value: { x: number; y: number }) => void): void; + + addListener(callback: ValueXYListenerCallback): string; + + removeListener(id: string): void; + + /** + * Converts `{x, y}` into `{left, top}` for use in style, e.g. + * + *```javascript + * style={this.state.anim.getLayout()} + *``` + */ + getLayout(): { [key: string]: AnimatedValue }; + + /** + * Converts `{x, y}` into a useable translation transform, e.g. + * + *```javascript + * style={{ + * transform: this.state.anim.getTranslateTransform() + * }} + *``` + */ + getTranslateTransform(): { [key: string]: AnimatedValue }[]; + } + + type EndResult = { finished: boolean }; + type EndCallback = (result: EndResult) => void; + + export interface CompositeAnimation { + start: (callback?: EndCallback) => void; + stop: () => void; + } + + interface AnimationConfig { + isInteraction?: boolean; + useNativeDriver?: boolean; + } /** - * Sets an offset that is applied on top of whatever value is set, whether via - * `setValue`, an animation, or `Animated.event`. Useful for compensating - * things like the start of a pan gesture. + * Animates a value from an initial velocity to zero based on a decay + * coefficient. */ - setOffset(offset: number): void + export function decay(value: AnimatedValue | AnimatedValueXY, config: DecayAnimationConfig): CompositeAnimation; + + interface DecayAnimationConfig extends AnimationConfig { + velocity: number | { x: number; y: number }; + deceleration?: number; + } /** - * Merges the offset value into the base value and resets the offset to zero. - * The final output of the value is unchanged. + * Animates a value along a timed easing curve. The `Easing` module has tons + * of pre-defined curves, or you can use your own function. */ - flattenOffset(): void + export const timing: (value: AnimatedValue | AnimatedValueXY, config: TimingAnimationConfig) => CompositeAnimation; + + interface TimingAnimationConfig extends AnimationConfig { + toValue: number | AnimatedValue | { x: number; y: number } | AnimatedValueXY; + easing?: (value: number) => number; + duration?: number; + delay?: number; + } + + interface SpringAnimationConfig extends AnimationConfig { + toValue: number | AnimatedValue | { x: number; y: number } | AnimatedValueXY; + overshootClamping?: boolean; + restDisplacementThreshold?: number; + restSpeedThreshold?: number; + velocity?: number | { x: number; y: number }; + bounciness?: number; + speed?: number; + tension?: number; + friction?: number; + stiffness?: number; + mass?: number; + damping?: number; + delay?: number; + } + + interface LoopAnimationConfig { + iterations?: number; // default -1 for infinite + } /** - * Sets the offset value to the base value, and resets the base value to zero. - * The final output of the value is unchanged. + * Creates a new Animated value composed from two Animated values added + * together. */ - extractOffset(): void + export function add(a: Animated, b: Animated): AnimatedAddition; + + class AnimatedAddition extends AnimatedInterpolation {} /** - * Adds an asynchronous listener to the value so you can observe updates from - * animations. This is useful because there is no way to - * synchronously read the value because it might be driven natively. + * Creates a new Animated value composed by subtracting the second Animated + * value from the first Animated value. */ - addListener(callback: ValueListenerCallback): string + export function subtract(a: Animated, b: Animated): AnimatedSubtraction; + + class AnimatedSubtraction extends AnimatedInterpolation {} - removeListener(id: string): void + /** + * Creates a new Animated value composed by dividing the first Animated + * value by the second Animated value. + */ + export function divide(a: Animated, b: Animated): AnimatedDivision; - removeAllListeners(): void + class AnimatedDivision extends AnimatedInterpolation {} /** - * Stops any running animation or tracking. `callback` is invoked with the - * final value after stopping the animation, which is useful for updating - * state to match the animation position with layout. + * Creates a new Animated value composed from two Animated values multiplied + * together. */ - stopAnimation(callback?: (value: number) => void): void + export function multiply(a: Animated, b: Animated): AnimatedMultiplication; + + class AnimatedMultiplication extends AnimatedInterpolation {} /** - * Interpolates the value before updating the property, e.g. mapping 0-1 to - * 0-10. + * Creates a new Animated value that is the (non-negative) modulo of the + * provided Animated value */ - interpolate(config: InterpolationConfigType): AnimatedInterpolation - } + export function modulo(a: Animated, modulus: number): AnimatedModulo; + + class AnimatedModulo extends AnimatedInterpolation {} - type ValueXYListenerCallback = (value: {x: number; y: number}) => void + /** + * Create a new Animated value that is limited between 2 values. It uses the + * difference between the last value so even if the value is far from the bounds + * it will start changing when the value starts getting closer again. + * (`value = clamp(value + diff, min, max)`). + * + * This is useful with scroll events, for example, to show the navbar when + * scrolling up and to hide it when scrolling down. + */ + export function diffClamp(a: Animated, min: number, max: number): AnimatedDiffClamp; - /** - * 2D Value for driving 2D animations, such as pan gestures. Almost identical - * API to normal `Animated.Value`, but multiplexed. Contains two regular - * `Animated.Value`s under the hood. - */ - export class ValueXY extends AnimatedWithChildren { - x: AnimatedValue - y: AnimatedValue + class AnimatedDiffClamp extends AnimatedInterpolation {} - constructor(valueIn?: {x: number | AnimatedValue; y: number | AnimatedValue}) + /** + * Starts an animation after the given delay. + */ + export function delay(time: number): CompositeAnimation; - setValue(value: {x: number; y: number}): void + /** + * Starts an array of animations in order, waiting for each to complete + * before starting the next. If the current running animation is stopped, no + * following animations will be started. + */ + export function sequence(animations: Array): CompositeAnimation; - setOffset(offset: {x: number; y: number}): void + /** + * Array of animations may run in parallel (overlap), but are started in + * sequence with successive delays. Nice for doing trailing effects. + */ - flattenOffset(): void + export function stagger(time: number, animations: Array): CompositeAnimation; - extractOffset(): void + /** + * Loops a given animation continuously, so that each time it reaches the end, + * it resets and begins again from the start. Can specify number of times to + * loop using the key 'iterations' in the config. Will loop without blocking + * the UI thread if the child animation is set to 'useNativeDriver'. + */ - stopAnimation(callback?: (value: {x: number; y: number}) => void): void + export function loop(animation: CompositeAnimation, config?: LoopAnimationConfig): CompositeAnimation; - addListener(callback: ValueXYListenerCallback): string + /** + * Spring animation based on Rebound and Origami. Tracks velocity state to + * create fluid motions as the `toValue` updates, and can be chained together. + */ + export function spring(value: AnimatedValue | AnimatedValueXY, config: SpringAnimationConfig): CompositeAnimation; - removeListener(id: string): void + type ParallelConfig = { + stopTogether?: boolean; // If one is stopped, stop all. default: true + }; /** - * Converts `{x, y}` into `{left, top}` for use in style, e.g. - * - *```javascript - * style={this.state.anim.getLayout()} - *``` + * Starts an array of animations all at the same time. By default, if one + * of the animations is stopped, they will all be stopped. You can override + * this with the `stopTogether` flag. */ - getLayout(): {[key: string]: AnimatedValue} + export function parallel(animations: Array, config?: ParallelConfig): CompositeAnimation; + + type Mapping = { [key: string]: Mapping } | AnimatedValue; + interface EventConfig { + listener?: (event: NativeSyntheticEvent) => void; + useNativeDriver?: boolean; + } /** - * Converts `{x, y}` into a useable translation transform, e.g. + * Takes an array of mappings and extracts values from each arg accordingly, + * then calls `setValue` on the mapped outputs. e.g. * *```javascript - * style={{ - * transform: this.state.anim.getTranslateTransform() - * }} + * onScroll={Animated.event( + * [{nativeEvent: {contentOffset: {x: this._scrollX}}}] + * {listener}, // Optional async listener + * ) + * ... + * onPanResponderMove: Animated.event([ + * null, // raw event arg ignored + * {dx: this._panX}, // gestureState arg + * ]), *``` */ - getTranslateTransform(): {[key: string]: AnimatedValue}[] - } - - type EndResult = {finished: boolean} - type EndCallback = (result: EndResult) => void - - export interface CompositeAnimation { - start: (callback?: EndCallback) => void - stop: () => void - } - - interface AnimationConfig { - isInteraction?: boolean - useNativeDriver?: boolean - } - - /** - * Animates a value from an initial velocity to zero based on a decay - * coefficient. - */ - export function decay( - value: AnimatedValue | AnimatedValueXY, - config: DecayAnimationConfig - ): CompositeAnimation - - interface DecayAnimationConfig extends AnimationConfig { - velocity: number | {x: number; y: number} - deceleration?: number - } - - /** - * Animates a value along a timed easing curve. The `Easing` module has tons - * of pre-defined curves, or you can use your own function. - */ - export const timing: ( - value: AnimatedValue | AnimatedValueXY, - config: TimingAnimationConfig - ) => CompositeAnimation - - interface TimingAnimationConfig extends AnimationConfig { - toValue: number | AnimatedValue | {x: number; y: number} | AnimatedValueXY - easing?: (value: number) => number - duration?: number - delay?: number - } - - interface SpringAnimationConfig extends AnimationConfig { - toValue: number | AnimatedValue | {x: number; y: number} | AnimatedValueXY - overshootClamping?: boolean - restDisplacementThreshold?: number - restSpeedThreshold?: number - velocity?: number | {x: number; y: number} - bounciness?: number - speed?: number - tension?: number - friction?: number - stiffness?: number - mass?: number - damping?: number - delay?: number - } - - interface LoopAnimationConfig { - iterations?: number // default -1 for infinite - } - - /** - * Creates a new Animated value composed from two Animated values added - * together. - */ - export function add(a: Animated, b: Animated): AnimatedAddition - - class AnimatedAddition extends AnimatedInterpolation {} - - /** - * Creates a new Animated value composed by subtracting the second Animated - * value from the first Animated value. - */ - export function subtract(a: Animated, b: Animated): AnimatedSubtraction - - class AnimatedSubtraction extends AnimatedInterpolation {} - - /** - * Creates a new Animated value composed by dividing the first Animated - * value by the second Animated value. - */ - export function divide(a: Animated, b: Animated): AnimatedDivision - - class AnimatedDivision extends AnimatedInterpolation {} - - /** - * Creates a new Animated value composed from two Animated values multiplied - * together. - */ - export function multiply(a: Animated, b: Animated): AnimatedMultiplication - - class AnimatedMultiplication extends AnimatedInterpolation {} - - /** - * Creates a new Animated value that is the (non-negative) modulo of the - * provided Animated value - */ - export function modulo(a: Animated, modulus: number): AnimatedModulo - - class AnimatedModulo extends AnimatedInterpolation {} - - /** - * Create a new Animated value that is limited between 2 values. It uses the - * difference between the last value so even if the value is far from the bounds - * it will start changing when the value starts getting closer again. - * (`value = clamp(value + diff, min, max)`). - * - * This is useful with scroll events, for example, to show the navbar when - * scrolling up and to hide it when scrolling down. - */ - export function diffClamp(a: Animated, min: number, max: number): AnimatedDiffClamp - - class AnimatedDiffClamp extends AnimatedInterpolation {} - - /** - * Starts an animation after the given delay. - */ - export function delay(time: number): CompositeAnimation - - /** - * Starts an array of animations in order, waiting for each to complete - * before starting the next. If the current running animation is stopped, no - * following animations will be started. - */ - export function sequence(animations: Array): CompositeAnimation - - /** - * Array of animations may run in parallel (overlap), but are started in - * sequence with successive delays. Nice for doing trailing effects. - */ - - export function stagger(time: number, animations: Array): CompositeAnimation - - /** - * Loops a given animation continuously, so that each time it reaches the end, - * it resets and begins again from the start. Can specify number of times to - * loop using the key 'iterations' in the config. Will loop without blocking - * the UI thread if the child animation is set to 'useNativeDriver'. - */ - - export function loop(animation: CompositeAnimation, config?: LoopAnimationConfig): CompositeAnimation - - /** - * Spring animation based on Rebound and Origami. Tracks velocity state to - * create fluid motions as the `toValue` updates, and can be chained together. - */ - export function spring( - value: AnimatedValue | AnimatedValueXY, - config: SpringAnimationConfig - ): CompositeAnimation - - type ParallelConfig = { - stopTogether?: boolean // If one is stopped, stop all. default: true - } - - /** - * Starts an array of animations all at the same time. By default, if one - * of the animations is stopped, they will all be stopped. You can override - * this with the `stopTogether` flag. - */ - export function parallel(animations: Array, config?: ParallelConfig): CompositeAnimation - - type Mapping = {[key: string]: Mapping} | AnimatedValue - interface EventConfig { - listener?: (event: NativeSyntheticEvent) => void - useNativeDriver?: boolean - } - - /** - * Takes an array of mappings and extracts values from each arg accordingly, - * then calls `setValue` on the mapped outputs. e.g. - * - *```javascript - * onScroll={Animated.event( - * [{nativeEvent: {contentOffset: {x: this._scrollX}}}] - * {listener}, // Optional async listener - * ) - * ... - * onPanResponderMove: Animated.event([ - * null, // raw event arg ignored - * {dx: this._panX}, // gestureState arg - * ]), - *``` - */ - export function event( - argMapping: Array, - config?: EventConfig - ): (...args: any[]) => void - - /** - * Make any React component Animatable. Used to create `Animated.View`, etc. - */ - export function createAnimatedComponent(component: any): any - - /** - * Animated variants of the basic native views. Accepts Animated.Value for - * props and style. - */ - export const View: any - export const Image: any - export const Text: any - export const ScrollView: any - export const FlatList: any - export const SectionList: any + export function event(argMapping: Array, config?: EventConfig): (...args: any[]) => void; + + /** + * Make any React component Animatable. Used to create `Animated.View`, etc. + */ + export function createAnimatedComponent(component: any): any; + + /** + * Animated variants of the basic native views. Accepts Animated.Value for + * props and style. + */ + export const View: any; + export const Image: any; + export const Text: any; + export const ScrollView: any; + export const FlatList: any; + export const SectionList: any; } // tslint:disable-next-line:interface-name export interface I18nManagerStatic { - isRTL: boolean - allowRTL: (allowRTL: boolean) => {} - forceRTL: (forceRTL: boolean) => {} + isRTL: boolean; + allowRTL: (allowRTL: boolean) => {}; + forceRTL: (forceRTL: boolean) => {}; } export interface GeolocationStatic { - /** - * Invokes the success callback once with the latest location info. Supported - * options: timeout (ms), maximumAge (ms), enableHighAccuracy (bool) - * On Android, this can return almost immediately if the location is cached or - * request an update, which might take a while. - */ - getCurrentPosition( - geo_success: (position: GeolocationReturnType) => void, - geo_error?: (error: GeolocationError) => void, - geo_options?: GeoOptions - ): void + /** + * Invokes the success callback once with the latest location info. Supported + * options: timeout (ms), maximumAge (ms), enableHighAccuracy (bool) + * On Android, this can return almost immediately if the location is cached or + * request an update, which might take a while. + */ + getCurrentPosition( + geo_success: (position: GeolocationReturnType) => void, + geo_error?: (error: GeolocationError) => void, + geo_options?: GeoOptions + ): void; - /** - * Invokes the success callback whenever the location changes. Supported - * options: timeout (ms), maximumAge (ms), enableHighAccuracy (bool), distanceFilter(m) - */ - watchPosition( - success: (position: GeolocationReturnType) => void, - error?: (error: GeolocationError) => void, - options?: GeoOptions - ): number + /** + * Invokes the success callback whenever the location changes. Supported + * options: timeout (ms), maximumAge (ms), enableHighAccuracy (bool), distanceFilter(m) + */ + watchPosition( + success: (position: GeolocationReturnType) => void, + error?: (error: GeolocationError) => void, + options?: GeoOptions + ): number; - clearWatch(watchID: number): void + clearWatch(watchID: number): void; - stopObserving(): void + stopObserving(): void; - requestAuthorization(): void + requestAuthorization(): void; - setRNConfiguration(config: GeoConfiguration): void + setRNConfiguration(config: GeoConfiguration): void; } export interface OpenCameraDialogOptions { - /** Defaults to false */ - videoMode?: boolean + /** Defaults to false */ + videoMode?: boolean; } export interface OpenSelectDialogOptions { - /** Defaults to true */ - showImages?: boolean - /** Defaults to false */ - showVideos?: boolean + /** Defaults to true */ + showImages?: boolean; + /** Defaults to false */ + showVideos?: boolean; } /** [imageURL|tempImageTag, height, width] */ -export type ImagePickerResult = [string, number, number] +export type ImagePickerResult = [string, number, number]; export interface ImagePickerIOSStatic { - canRecordVideos(callback: (value: boolean) => void): void - canUseCamera(callback: (value: boolean) => void): void - openCameraDialog( - config: OpenCameraDialogOptions, - successCallback: (args: ImagePickerResult) => void, - cancelCallback: (args: any[]) => void - ): void - openSelectDialog( - config: OpenSelectDialogOptions, - successCallback: (args: ImagePickerResult) => void, - cancelCallback: (args: any[]) => void - ): void + canRecordVideos(callback: (value: boolean) => void): void; + canUseCamera(callback: (value: boolean) => void): void; + openCameraDialog( + config: OpenCameraDialogOptions, + successCallback: (args: ImagePickerResult) => void, + cancelCallback: (args: any[]) => void + ): void; + openSelectDialog( + config: OpenSelectDialogOptions, + successCallback: (args: ImagePickerResult) => void, + cancelCallback: (args: any[]) => void + ): void; } export interface ImageStoreStatic { - /** - * Check if the ImageStore contains image data for the specified URI. - * @platform ios - */ - hasImageForTag(uri: string, callback: (hasImage: boolean) => void): void - - /** - * Delete an image from the ImageStore. Images are stored in memory and - * must be manually removed when you are finished with them, otherwise they - * will continue to use up RAM until the app is terminated. It is safe to - * call `removeImageForTag()` without first calling `hasImageForTag()`, it - * will simply fail silently. - * @platform ios - */ - removeImageForTag(uri: string): void - - /** - * Stores a base64-encoded image in the ImageStore, and returns a URI that - * can be used to access or display the image later. Images are stored in - * memory only, and must be manually deleted when you are finished with - * them by calling `removeImageForTag()`. - * - * Note that it is very inefficient to transfer large quantities of binary - * data between JS and native code, so you should avoid calling this more - * than necessary. - * @platform ios - */ - addImageFromBase64( - base64ImageData: string, - success: (uri: string) => void, - failure: (error: any) => void - ): void - - /** - * Retrieves the base64-encoded data for an image in the ImageStore. If the - * specified URI does not match an image in the store, the failure callback - * will be called. - * - * Note that it is very inefficient to transfer large quantities of binary - * data between JS and native code, so you should avoid calling this more - * than necessary. To display an image in the ImageStore, you can just pass - * the URI to an `` component; there is no need to retrieve the - * base64 data. - */ - getBase64ForTag( - uri: string, - success: (base64ImageData: string) => void, - failure: (error: any) => void - ): void + /** + * Check if the ImageStore contains image data for the specified URI. + * @platform ios + */ + hasImageForTag(uri: string, callback: (hasImage: boolean) => void): void; + + /** + * Delete an image from the ImageStore. Images are stored in memory and + * must be manually removed when you are finished with them, otherwise they + * will continue to use up RAM until the app is terminated. It is safe to + * call `removeImageForTag()` without first calling `hasImageForTag()`, it + * will simply fail silently. + * @platform ios + */ + removeImageForTag(uri: string): void; + + /** + * Stores a base64-encoded image in the ImageStore, and returns a URI that + * can be used to access or display the image later. Images are stored in + * memory only, and must be manually deleted when you are finished with + * them by calling `removeImageForTag()`. + * + * Note that it is very inefficient to transfer large quantities of binary + * data between JS and native code, so you should avoid calling this more + * than necessary. + * @platform ios + */ + addImageFromBase64(base64ImageData: string, success: (uri: string) => void, failure: (error: any) => void): void; + + /** + * Retrieves the base64-encoded data for an image in the ImageStore. If the + * specified URI does not match an image in the store, the failure callback + * will be called. + * + * Note that it is very inefficient to transfer large quantities of binary + * data between JS and native code, so you should avoid calling this more + * than necessary. To display an image in the ImageStore, you can just pass + * the URI to an `` component; there is no need to retrieve the + * base64 data. + */ + getBase64ForTag(uri: string, success: (base64ImageData: string) => void, failure: (error: any) => void): void; } // @@ -9142,10 +9114,10 @@ export interface ImageStoreStatic { // export interface NativeEventSubscription { - /** - * Call this method to un-subscribe from a native-event - */ - remove(): void + /** + * Call this method to un-subscribe from a native-event + */ + remove(): void; } /** @@ -9155,105 +9127,105 @@ export interface NativeEventSubscription { * @see https://github.com/facebook/react-native/blob/0.34-stable\Libraries\EventEmitter\RCTNativeAppEventEmitter.js * @see https://facebook.github.io/react-native/docs/native-modules-ios.html#sending-events-to-javascript */ -type RCTNativeAppEventEmitter = DeviceEventEmitterStatic +type RCTNativeAppEventEmitter = DeviceEventEmitterStatic; interface ImageCropData { - /** - * The top-left corner of the cropped image, specified in the original - * image's coordinate space. - */ - offset: { - x: number - y: number - } - - /** - * The size (dimensions) of the cropped image, specified in the original - * image's coordinate space. - */ - size: { - width: number - height: number - } - - /** - * (Optional) size to scale the cropped image to. - */ - displaySize?: {width: number; height: number} - - /** - * (Optional) the resizing mode to use when scaling the image. If the - * `displaySize` param is not specified, this has no effect. - */ - resizeMode?: 'contain' | 'cover' | 'stretch' + /** + * The top-left corner of the cropped image, specified in the original + * image's coordinate space. + */ + offset: { + x: number; + y: number; + }; + + /** + * The size (dimensions) of the cropped image, specified in the original + * image's coordinate space. + */ + size: { + width: number; + height: number; + }; + + /** + * (Optional) size to scale the cropped image to. + */ + displaySize?: { width: number; height: number }; + + /** + * (Optional) the resizing mode to use when scaling the image. If the + * `displaySize` param is not specified, this has no effect. + */ + resizeMode?: "contain" | "cover" | "stretch"; } interface ImageEditorStatic { - /** - * Crop the image specified by the URI param. If URI points to a remote - * image, it will be downloaded automatically. If the image cannot be - * loaded/downloaded, the failure callback will be called. - * - * If the cropping process is successful, the resultant cropped image - * will be stored in the ImageStore, and the URI returned in the success - * callback will point to the image in the store. Remember to delete the - * cropped image from the ImageStore when you are done with it. - */ - cropImage( - uri: string, - cropData: ImageCropData, - success: (uri: string) => void, - failure: (error: Object) => void - ): void + /** + * Crop the image specified by the URI param. If URI points to a remote + * image, it will be downloaded automatically. If the image cannot be + * loaded/downloaded, the failure callback will be called. + * + * If the cropping process is successful, the resultant cropped image + * will be stored in the ImageStore, and the URI returned in the success + * callback will point to the image in the store. Remember to delete the + * cropped image from the ImageStore when you are done with it. + */ + cropImage( + uri: string, + cropData: ImageCropData, + success: (uri: string) => void, + failure: (error: Object) => void + ): void; } export interface ARTNodeMixin { - opacity?: number - originX?: number - originY?: number - scaleX?: number - scaleY?: number - scale?: number - title?: string - x?: number - y?: number - visible?: boolean + opacity?: number; + originX?: number; + originY?: number; + scaleX?: number; + scaleY?: number; + scale?: number; + title?: string; + x?: number; + y?: number; + visible?: boolean; } export interface ARTGroupProps extends ARTNodeMixin { - width?: number - height?: number + width?: number; + height?: number; } export interface ARTClippingRectangleProps extends ARTNodeMixin { - width?: number - height?: number + width?: number; + height?: number; } export interface ARTRenderableMixin extends ARTNodeMixin { - fill?: string - stroke?: string - strokeCap?: 'butt' | 'square' | 'round' - strokeDash?: number[] - strokeJoin?: 'bevel' | 'miter' | 'round' - strokeWidth?: number + fill?: string; + stroke?: string; + strokeCap?: "butt" | "square" | "round"; + strokeDash?: number[]; + strokeJoin?: "bevel" | "miter" | "round"; + strokeWidth?: number; } export interface ARTShapeProps extends ARTRenderableMixin { - d: string - width?: number - height?: number + d: string; + width?: number; + height?: number; } export interface ARTTextProps extends ARTRenderableMixin { - font?: string - alignment?: string + font?: string; + alignment?: string; } export interface ARTSurfaceProps { - style?: StyleProp - width: number - height: number + style?: StyleProp; + width: number; + height: number; } export class ClippingRectangle extends React.Component {} @@ -9267,43 +9239,51 @@ export class Surface extends React.Component {} export class ARTText extends React.Component {} export interface ARTStatic { - ClippingRectangle: typeof ClippingRectangle - Group: typeof Group - Shape: typeof Shape - Surface: typeof Surface - Text: typeof ARTText + ClippingRectangle: typeof ClippingRectangle; + Group: typeof Group; + Shape: typeof Shape; + Surface: typeof Surface; + Text: typeof ARTText; } export type KeyboardEventName = - | 'keyboardWillShow' - | 'keyboardDidShow' - | 'keyboardWillHide' - | 'keyboardDidHide' - | 'keyboardWillChangeFrame' - | 'keyboardDidChangeFrame' - -export type KeyboardEventEasing = 'easeIn' | 'easeInEaseOut' | 'easeOut' | 'linear' | 'keyboard' + | "keyboardWillShow" + | "keyboardDidShow" + | "keyboardWillHide" + | "keyboardDidHide" + | "keyboardWillChangeFrame" + | "keyboardDidChangeFrame"; + +export type KeyboardEventEasing = + | "easeIn" + | "easeInEaseOut" + | "easeOut" + | "linear" + | "keyboard"; type ScreenRect = { - screenX: number - screenY: number - width: number - height: number -} + screenX: number; + screenY: number; + width: number; + height: number; +}; export interface KeyboardEvent { - duration: number - easing: KeyboardEventEasing - endCoordinates: ScreenRect - startCoordinates: ScreenRect - isEventFromThisApp: boolean + duration: number; + easing: KeyboardEventEasing; + endCoordinates: ScreenRect; + startCoordinates: ScreenRect; + isEventFromThisApp: boolean; } -type KeyboardEventListener = (event: KeyboardEvent) => void +type KeyboardEventListener = (event: KeyboardEvent) => void; export interface KeyboardStatic extends NativeEventEmitter { - dismiss: () => void - addListener(eventType: KeyboardEventName, listener: KeyboardEventListener): EmitterSubscription + dismiss: () => void; + addListener( + eventType: KeyboardEventName, + listener: KeyboardEventListener + ): EmitterSubscription; } ////////////////////////////////////////////////////////////////////////// @@ -9314,159 +9294,159 @@ export interface KeyboardStatic extends NativeEventEmitter { // TODO: The following components need to be added // - [ ] ART -export const ART: ARTStatic -export type ART = ARTStatic +export const ART: ARTStatic; +export type ART = ARTStatic; -export const ImagePickerIOS: ImagePickerIOSStatic -export type ImagePickerIOS = ImagePickerIOSStatic +export const ImagePickerIOS: ImagePickerIOSStatic; +export type ImagePickerIOS = ImagePickerIOSStatic; -export const LayoutAnimation: LayoutAnimationStatic -export type LayoutAnimation = LayoutAnimationStatic +export const LayoutAnimation: LayoutAnimationStatic; +export type LayoutAnimation = LayoutAnimationStatic; -export const SectionList: SectionListStatic -export type SectionList = SectionListStatic +export const SectionList: SectionListStatic; +export type SectionList = SectionListStatic; -export const Systrace: SystraceStatic -export type Systrace = SystraceStatic +export const Systrace: SystraceStatic; +export type Systrace = SystraceStatic; //////////// APIS ////////////// -export const ActionSheetIOS: ActionSheetIOSStatic -export type ActionSheetIOS = ActionSheetIOSStatic +export const ActionSheetIOS: ActionSheetIOSStatic; +export type ActionSheetIOS = ActionSheetIOSStatic; -export const Share: ShareStatic -export type Share = ShareStatic +export const Share: ShareStatic; +export type Share = ShareStatic; -export const AdSupportIOS: AdSupportIOSStatic -export type AdSupportIOS = AdSupportIOSStatic +export const AdSupportIOS: AdSupportIOSStatic; +export type AdSupportIOS = AdSupportIOSStatic; -export const AccessibilityInfo: AccessibilityInfoStatic -export type AccessibilityInfo = AccessibilityInfoStatic +export const AccessibilityInfo: AccessibilityInfoStatic; +export type AccessibilityInfo = AccessibilityInfoStatic; -export const Alert: AlertStatic -export type Alert = AlertStatic +export const Alert: AlertStatic; +export type Alert = AlertStatic; -export const AlertAndroid: AlertAndroidStatic -export type AlertAndroid = AlertAndroidStatic +export const AlertAndroid: AlertAndroidStatic; +export type AlertAndroid = AlertAndroidStatic; -export const AlertIOS: AlertIOSStatic -export type AlertIOS = AlertIOSStatic +export const AlertIOS: AlertIOSStatic; +export type AlertIOS = AlertIOSStatic; -export const AppState: AppStateStatic -export type AppState = AppStateStatic +export const AppState: AppStateStatic; +export type AppState = AppStateStatic; -export const AppStateIOS: AppStateStatic -export type AppStateIOS = AppStateStatic +export const AppStateIOS: AppStateStatic; +export type AppStateIOS = AppStateStatic; -export const AsyncStorage: AsyncStorageStatic -export type AsyncStorage = AsyncStorageStatic +export const AsyncStorage: AsyncStorageStatic; +export type AsyncStorage = AsyncStorageStatic; -export const BackAndroid: BackAndroidStatic -export type BackAndroid = BackAndroidStatic +export const BackAndroid: BackAndroidStatic; +export type BackAndroid = BackAndroidStatic; -export const BackHandler: BackHandlerStatic -export type BackHandler = BackHandlerStatic +export const BackHandler: BackHandlerStatic; +export type BackHandler = BackHandlerStatic; -export const CameraRoll: CameraRollStatic -export type CameraRoll = CameraRollStatic +export const CameraRoll: CameraRollStatic; +export type CameraRoll = CameraRollStatic; -export const Clipboard: ClipboardStatic -export type Clipboard = ClipboardStatic +export const Clipboard: ClipboardStatic; +export type Clipboard = ClipboardStatic; -export const DatePickerAndroid: DatePickerAndroidStatic -export type DatePickerAndroid = DatePickerAndroidStatic +export const DatePickerAndroid: DatePickerAndroidStatic; +export type DatePickerAndroid = DatePickerAndroidStatic; -export const Geolocation: GeolocationStatic -export type Geolocation = GeolocationStatic +export const Geolocation: GeolocationStatic; +export type Geolocation = GeolocationStatic; /** http://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps.html */ -export const I18nManager: I18nManagerStatic -export type I18nManager = I18nManagerStatic +export const I18nManager: I18nManagerStatic; +export type I18nManager = I18nManagerStatic; -export const ImageEditor: ImageEditorStatic -export type ImageEditor = ImageEditorStatic +export const ImageEditor: ImageEditorStatic; +export type ImageEditor = ImageEditorStatic; -export const ImageStore: ImageStoreStatic -export type ImageStore = ImageStoreStatic +export const ImageStore: ImageStoreStatic; +export type ImageStore = ImageStoreStatic; -export const InteractionManager: InteractionManagerStatic +export const InteractionManager: InteractionManagerStatic; -export const IntentAndroid: IntentAndroidStatic -export type IntentAndroid = IntentAndroidStatic +export const IntentAndroid: IntentAndroidStatic; +export type IntentAndroid = IntentAndroidStatic; -export const Keyboard: KeyboardStatic +export const Keyboard: KeyboardStatic; -export const Linking: LinkingStatic -export type Linking = LinkingStatic +export const Linking: LinkingStatic; +export type Linking = LinkingStatic; -export const LinkingIOS: LinkingIOSStatic -export type LinkingIOS = LinkingIOSStatic +export const LinkingIOS: LinkingIOSStatic; +export type LinkingIOS = LinkingIOSStatic; -export const NativeMethodsMixin: NativeMethodsMixinStatic -export type NativeMethodsMixin = NativeMethodsMixinStatic +export const NativeMethodsMixin: NativeMethodsMixinStatic; +export type NativeMethodsMixin = NativeMethodsMixinStatic; -export const NativeComponent: NativeMethodsMixinStatic -export type NativeComponent = NativeMethodsMixinStatic +export const NativeComponent: NativeMethodsMixinStatic; +export type NativeComponent = NativeMethodsMixinStatic; -export const NetInfo: NetInfoStatic -export type NetInfo = NetInfoStatic +export const NetInfo: NetInfoStatic; +export type NetInfo = NetInfoStatic; -export const PanResponder: PanResponderStatic -export type PanResponder = PanResponderStatic +export const PanResponder: PanResponderStatic; +export type PanResponder = PanResponderStatic; -export const PermissionsAndroid: PermissionsAndroidStatic -export type PermissionsAndroid = PermissionsAndroidStatic +export const PermissionsAndroid: PermissionsAndroidStatic; +export type PermissionsAndroid = PermissionsAndroidStatic; -export const PushNotificationIOS: PushNotificationIOSStatic -export type PushNotificationIOS = PushNotificationIOSStatic +export const PushNotificationIOS: PushNotificationIOSStatic; +export type PushNotificationIOS = PushNotificationIOSStatic; -export const Settings: SettingsStatic -export type Settings = SettingsStatic +export const Settings: SettingsStatic; +export type Settings = SettingsStatic; -export const StatusBarIOS: StatusBarIOSStatic -export type StatusBarIOS = StatusBarIOSStatic +export const StatusBarIOS: StatusBarIOSStatic; +export type StatusBarIOS = StatusBarIOSStatic; -export const TimePickerAndroid: TimePickerAndroidStatic -export type TimePickerAndroid = TimePickerAndroidStatic +export const TimePickerAndroid: TimePickerAndroidStatic; +export type TimePickerAndroid = TimePickerAndroidStatic; -export const ToastAndroid: ToastAndroidStatic -export type ToastAndroid = ToastAndroidStatic +export const ToastAndroid: ToastAndroidStatic; +export type ToastAndroid = ToastAndroidStatic; -export const UIManager: UIManagerStatic -export type UIManager = UIManagerStatic +export const UIManager: UIManagerStatic; +export type UIManager = UIManagerStatic; -export const VibrationIOS: VibrationIOSStatic -export type VibrationIOS = VibrationIOSStatic +export const VibrationIOS: VibrationIOSStatic; +export type VibrationIOS = VibrationIOSStatic; -export const Vibration: VibrationStatic -export type Vibration = VibrationStatic +export const Vibration: VibrationStatic; +export type Vibration = VibrationStatic; -export const Dimensions: Dimensions -export const ShadowPropTypesIOS: ShadowPropTypesIOSStatic +export const Dimensions: Dimensions; +export const ShadowPropTypesIOS: ShadowPropTypesIOSStatic; -export type Easing = EasingStatic -export const Easing: EasingStatic +export type Easing = EasingStatic; +export const Easing: EasingStatic; //////////// Plugins ////////////// -export const DeviceEventEmitter: DeviceEventEmitterStatic +export const DeviceEventEmitter: DeviceEventEmitterStatic; /** * Abstract base class for implementing event-emitting modules. This implements * a subset of the standard EventEmitter node module API. */ export interface NativeEventEmitter extends EventEmitter {} -export const NativeEventEmitter: NativeEventEmitter +export const NativeEventEmitter: NativeEventEmitter; /** * Deprecated - subclass NativeEventEmitter to create granular event modules instead of * adding all event listeners directly to RCTNativeAppEventEmitter. */ -export const NativeAppEventEmitter: RCTNativeAppEventEmitter +export const NativeAppEventEmitter: RCTNativeAppEventEmitter; /** * Interface for NativeModules which allows to augment NativeModules with type informations. * See react-native-sensor-manager for example. */ interface NativeModulesStatic { - [name: string]: any + [name: string]: any; } /** @@ -9476,14 +9456,9 @@ interface NativeModulesStatic { * Use: * const MyModule = NativeModules.ModuleName */ -export const NativeModules: NativeModulesStatic -export const Platform: - | PlatformIOSStatic - | PlatformAndroidStatic - | PlatformWindowsOSStatic - | PlatformMacOSStatic - | PlatformWebStatic -export const PixelRatio: PixelRatioStatic +export const NativeModules: NativeModulesStatic; +export const Platform: PlatformIOSStatic | PlatformAndroidStatic | PlatformWindowsOSStatic | PlatformMacOSStatic | PlatformWebStatic; +export const PixelRatio: PixelRatioStatic; /** * Creates values that can be used like React components which represent native @@ -9496,15 +9471,15 @@ export const PixelRatio: PixelRatioStatic * `any` because TypeScript assumes anonymous JSX intrinsics (`string` instead of `"div", for * example) not to have any props. */ -export function requireNativeComponent(viewName: string): any +export function requireNativeComponent(viewName: string): any; export function findNodeHandle( - componentOrHandle: null | number | React.Component | React.ComponentClass -): null | number + componentOrHandle: null | number | React.Component | React.ComponentClass +): null | number; -export function processColor(color: any): number +export function processColor(color: any): number; -export const YellowBox: React.Component & {ignoreWarnings: (warnings: string[]) => void} +export const YellowBox: React.Component & { ignoreWarnings: (warnings: string[]) => void }; ////////////////////////////////////////////////////////////////////////// // @@ -9512,91 +9487,93 @@ export const YellowBox: React.Component & {ignoreWarnings: (warnings: // ////////////////////////////////////////////////////////////////////////// -export function __spread(target: any, ...sources: any[]): any +export function __spread(target: any, ...sources: any[]): any; -type ErrorHandlerCallback = (error: any, isFatal?: boolean) => void +type ErrorHandlerCallback = (error: any, isFatal?: boolean) => void; export interface ErrorUtils { - setGlobalHandler: (callback: ErrorHandlerCallback) => void - getGlobalHandler: () => ErrorHandlerCallback + setGlobalHandler: (callback: ErrorHandlerCallback) => void; + getGlobalHandler: () => ErrorHandlerCallback; } // // Add-Ons // export namespace addons { - //FIXME: Documentation ? - export interface TestModuleStatic { - verifySnapshot: (done: (indicator?: any) => void) => void - markTestPassed: (indicator: any) => void - markTestCompleted: () => void - } + //FIXME: Documentation ? + export interface TestModuleStatic { + verifySnapshot: (done: (indicator?: any) => void) => void; + markTestPassed: (indicator: any) => void; + markTestCompleted: () => void; + } - export const TestModule: TestModuleStatic - export type TestModule = TestModuleStatic + export const TestModule: TestModuleStatic; + export type TestModule = TestModuleStatic; } // // Prop Types // -export const ColorPropType: React.Validator -export const EdgeInsetsPropType: React.Validator -export const PointPropType: React.Validator -export const ViewPropTypes: React.ValidationMap +export const ColorPropType: React.Validator; +export const EdgeInsetsPropType: React.Validator; +export const PointPropType: React.Validator; +export const ViewPropTypes: React.ValidationMap; declare global { - interface NodeRequire { - (id: string): any - } - - var require: NodeRequire - - /** - * Console polyfill - * @see https://facebook.github.io/react-native/docs/javascript-environment.html#polyfills - */ - interface Console { - error(message?: any, ...optionalParams: any[]): void - info(message?: any, ...optionalParams: any[]): void - log(message?: any, ...optionalParams: any[]): void - warn(message?: any, ...optionalParams: any[]): void - trace(message?: any, ...optionalParams: any[]): void - debug(message?: any, ...optionalParams: any[]): void - table(...data: any[]): void - disableYellowBox: boolean - ignoredYellowBox: string[] - } - - var console: Console - - /** - * Navigator object for accessing location API - * @see https://facebook.github.io/react-native/docs/javascript-environment.html#polyfills - */ - interface Navigator { - readonly product: string - // readonly geolocation: Geolocation - } - - // const navigator: Navigator; - - /** - * This contains the non-native `XMLHttpRequest` object, which you can use if you want to route network requests - * through DevTools (to trace them): - * - * global.XMLHttpRequest = global.originalXMLHttpRequest; - * - * @see https://github.com/facebook/react-native/issues/934 - */ - const originalXMLHttpRequest: any - - const __BUNDLE_START_TIME__: number - const ErrorUtils: ErrorUtils - - /** - * This variable is set to true when react-native is running in Dev mode - * Typical usage: - * if (__DEV__) console.log('Running in dev mode') - */ - const __DEV__: boolean + interface NodeRequire { + (id: string): any; + } + + var require: NodeRequire; + + /** + * Console polyfill + * @see https://facebook.github.io/react-native/docs/javascript-environment.html#polyfills + */ + interface Console { + error(message?: any, ...optionalParams: any[]): void; + info(message?: any, ...optionalParams: any[]): void; + log(message?: any, ...optionalParams: any[]): void; + warn(message?: any, ...optionalParams: any[]): void; + trace(message?: any, ...optionalParams: any[]): void; + debug(message?: any, ...optionalParams: any[]): void; + table(...data: any[]): void; + disableYellowBox: boolean; + ignoredYellowBox: string[]; + } + + var console: Console; + + /** + * Navigator object for accessing location API + * @see https://facebook.github.io/react-native/docs/javascript-environment.html#polyfills + */ + interface Navigator { + readonly product: string; + /* readonly geolocation: Geolocation; */ + } + + /* const navigator: Navigator; */ + + /** + * This contains the non-native `XMLHttpRequest` object, which you can use if you want to route network requests + * through DevTools (to trace them): + * + * global.XMLHttpRequest = global.originalXMLHttpRequest; + * + * @see https://github.com/facebook/react-native/issues/934 + */ + const originalXMLHttpRequest: any; + + const __BUNDLE_START_TIME__: number; + const ErrorUtils: ErrorUtils; + + /** + * This variable is set to true when react-native is running in Dev mode + * Typical usage: + * if (__DEV__) console.log('Running in dev mode') + */ + const __DEV__: boolean; + + const HermesInternal: null | {}; } diff --git a/shared/package.json b/shared/package.json index bb445f29be00..c474c86b73a4 100644 --- a/shared/package.json +++ b/shared/package.json @@ -219,31 +219,32 @@ "@storybook/react-native": "4.1.14", "@storybook/theming": "5.0.1", "@types/base64-js": "1.2.5", - "@types/classnames": "2.2.8", + "@types/classnames": "2.2.9", "@types/emoji-mart": "2.8.4", "@types/google-libphonenumber": "7.4.17", "@types/hoist-non-react-statics": "3.3.1", "@types/lodash-es": "4.17.3", "@types/memoize-one": "4.1.1", "@types/moment": "2.13.0", - "@types/mousetrap": "1.6.2", + "@types/mousetrap": "1.6.3", + "@types/node": "12.7.3", "@types/path-parse": "1.0.19", - "@types/react": "16.8.22", - "@types/react-dom": "16.8.4", + "@types/react": "16.9.2", + "@types/react-dom": "16.9.0", "@types/react-is": "16.7.1", "@types/react-list": "0.8.5", "@types/react-measure": "2.0.5", - "@types/react-native": "0.60.2", - "@types/react-navigation": "3.0.7", + "@types/react-native": "0.60.9", + "@types/react-navigation": "3.0.8", "@types/react-transition-group": "2.9.2", "@types/react-virtualized-auto-sizer": "1.0.0", - "@types/react-window": "1.8.0", - "@types/recompose": "0.30.6", + "@types/react-window": "1.8.1", + "@types/recompose": "0.30.7", "@types/shallowequal": "1.1.1", "@types/tlds": "1.199.0", "@types/url-parse": "1.4.3", - "@types/uuid": "3.4.4", - "@types/webpack-env": "1.13.9", + "@types/uuid": "3.4.5", + "@types/webpack-env": "1.14.0", "@types/whatwg-url": "6.4.0", "babel-core": "7.0.0-bridge.0", "babel-eslint": "11.0.0-beta.0", @@ -281,7 +282,7 @@ "style-loader": "0.23.1", "terser-webpack-plugin": "1.2.1", "tls": "git://github.com/keybase/nullModule", - "typescript": "3.5.3", + "typescript": "3.6.3", "webpack": "4.28.2", "webpack-cli": "3.2.1", "webpack-dashboard": "2.0.0", @@ -317,7 +318,7 @@ "**/@babel/runtime": "7.4.5", "**/@babel/traverse": "7.4.5", "**/@babel/types": "7.4.4", - "**/@types/react-native": "0.60.2", + "**/@types/react-native": "0.60.9", "babel-core": "7.0.0-bridge.0", "**/node-gyp/tar": "4.4.8", "react-native-screens": "git://github.com/keybase/react-native-screens#danny/fix-textinput-blur" diff --git a/shared/settings/feedback/container.native.tsx b/shared/settings/feedback/container.native.tsx index b49a9b780ff9..72d812cfca9e 100644 --- a/shared/settings/feedback/container.native.tsx +++ b/shared/settings/feedback/container.native.tsx @@ -58,9 +58,8 @@ class FeedbackContainer extends React.Component { this.setState({sending: true}) this.props.setTimeout(() => { - const maybeDump = sendLogs ? this._dumpLogs() : Promise.resolve('') + const maybeDump = sendLogs ? this._dumpLogs() : Promise.resolve() - // @ts-ignore maybeDump .then(() => { logger.info(`Sending ${sendLogs ? 'log' : 'feedback'} to daemon`) diff --git a/shared/store/configure-sagas.tsx b/shared/store/configure-sagas.tsx index 013836036b9f..4c4a4b05b76c 100644 --- a/shared/store/configure-sagas.tsx +++ b/shared/store/configure-sagas.tsx @@ -25,7 +25,7 @@ import {reduxSagaLogger} from '../local-debug' import {sagaTimer} from '../util/user-timings' import * as Saga from '../util/saga' -function* mainSaga(): Saga.SagaGenerator { +function* mainSaga() { yield Saga.spawn(chat2Saga) yield Saga.spawn(configSaga) yield Saga.spawn(deeplinksSaga) diff --git a/shared/team-building/container.tsx b/shared/team-building/container.tsx index 72858c136063..79f080f455b8 100644 --- a/shared/team-building/container.tsx +++ b/shared/team-building/container.tsx @@ -115,16 +115,11 @@ const deriveTeamSoFar = memoize( }) ) -const deriveServiceResultCount: ( - searchResults: Types.SearchResults, - query: string -) => {[K in Types.ServiceIdWithContact]: number | null} = memoize( - (searchResults: Types.SearchResults, query) => - // @ts-ignore codemod issue - searchResults - .get(trim(query), I.Map()) - .map(results => results.length) - .toObject() +const deriveServiceResultCount = memoize((searchResults: Types.SearchResults, query: string) => + searchResults + .get(trim(query), I.Map>()) + .map(results => results.length) + .toObject() ) const deriveShowResults = memoize(searchString => !!searchString) diff --git a/shared/util/idle-callback.tsx b/shared/util/idle-callback.tsx index e8b8958e5f7e..54970ce1c1f9 100644 --- a/shared/util/idle-callback.tsx +++ b/shared/util/idle-callback.tsx @@ -7,11 +7,13 @@ type TimeoutInfo = { function immediateCallback(cb: (info: TimeoutInfo) => void): NodeJS.Immediate { cb({didTimeout: true, timeRemaining: () => 0}) - return { + const r = { _onImmediate: () => {}, - ref: () => {}, - unref: () => {}, + hasRef: () => false, + ref: () => r, + unref: () => r, } + return r } function timeoutFallback(cb: (info: TimeoutInfo) => void): NodeJS.Timer { diff --git a/shared/util/saga.tsx b/shared/util/saga.tsx index e85379f91bfb..f6d5f9dd84fb 100644 --- a/shared/util/saga.tsx +++ b/shared/util/saga.tsx @@ -9,7 +9,7 @@ import {TypedActions, TypedActionsMap} from '../actions/typed-actions-gen' import put from './typed-put' import {isArray} from 'lodash-es' -export type SagaGenerator = IterableIterator +type ActionType = keyof TypedActionsMap export class SagaLogger { error: LogFn @@ -17,7 +17,7 @@ export class SagaLogger { info: LogFn debug: LogFn isTagged = false - constructor(actionType, fcnTag) { + constructor(actionType: ActionType, fcnTag: string) { const prefix = `${fcnTag} [${actionType}]:` this.debug = (...args) => logger.debug(prefix, ...args) this.error = (...args) => logger.error(prefix, ...args) @@ -33,7 +33,7 @@ export class SagaLogger { } // Useful in safeTakeEveryPure when you have an array of effects you want to run in order -function* sequentially(effects: Array): Iterable> { +function* sequentially(effects: Array): Generator, any> { const results: Array = [] for (let i = 0; i < effects.length; i++) { results.push(yield effects[i]) @@ -51,12 +51,12 @@ export type ChainActionReturn = ChainActionReturnInPromise | Promise => "FOO" | "BAR" type ValuesOf = T[number] -interface ChainAction { +interface ChainAction2 { ( actions: AT, handler: (state: TypedState, action: TypedActionsMap[AT], logger: SagaLogger) => ChainActionReturn, loggerTag?: string - ): IterableIterator + ): Generator ( actions: AT, @@ -66,13 +66,10 @@ interface ChainAction { logger: SagaLogger ) => ChainActionReturn, loggerTag?: string - ): IterableIterator + ): Generator } -/** - * TODO deprecated less typed version. Use chainAction2 instead - */ -function* chainAction( +function* chainAction2Impl( pattern: RS.Pattern, f: (state: TypedState, action: Actions, logger: SagaLogger) => ChainActionReturn, loggerTag?: string @@ -81,7 +78,7 @@ function* chainAction( return yield Effects.takeEvery(pattern as RS.Pattern, function* chainActionHelper( action: TypedActions ) { - const sl = new SagaLogger(action.type, loggerTag || 'unknown') + const sl = new SagaLogger(action.type as ActionType, loggerTag || 'unknown') try { const state: TypedState = yield* selectState() // @ts-ignore @@ -113,7 +110,7 @@ function* chainAction( }) } -export const chainAction2: ChainAction = (chainAction as unknown) as any +export const chainAction2: ChainAction2 = (chainAction2Impl as unknown) as any function* chainGenerator< Actions extends { @@ -121,13 +118,13 @@ function* chainGenerator< } >( pattern: RS.Pattern, - f: (state: TypedState, action: Actions, logger: SagaLogger) => Iterable, + f: (state: TypedState, action: Actions, logger: SagaLogger) => Generator, // tag for logger fcnTag?: string -): Iterable { +): Generator { // @ts-ignore TODO fix return yield Effects.takeEvery(pattern, function* chainGeneratorHelper(action: Actions) { - const sl = new SagaLogger(action.type, fcnTag || 'unknown') + const sl = new SagaLogger(action.type as ActionType, fcnTag || 'unknown') try { const state: TypedState = yield* selectState() yield* f(state, action, sl) @@ -150,23 +147,7 @@ function* chainGenerator< }) } -/*** - * Until TS 3.6 this can't be property typed: https://github.com/Microsoft/TypeScript/issues/2983 - */ -function* callPromise( - fn: (...args: Array) => Promise, - ...args: Array -): Iterable { - // @ts-ignore - return yield Effects.call(fn, ...args) -} - -// Used to delegate in a typed way (NOT WITH TS anymore) to what engine saga returns. short term use this but longer term -// generate generators instead and yield * directly -function* callRPCs(e: Effects.CallEffect): Iterable { - return yield e -} -function* selectState(): Iterable { +function* selectState(): Generator { // @ts-ignore codemod issue const state: TypedState = yield Effects.select() return state @@ -200,4 +181,4 @@ export { throttle, } from 'redux-saga/effects' -export {selectState, put, sequentially, chainGenerator, callPromise, callRPCs} +export {selectState, put, sequentially, chainGenerator} diff --git a/shared/yarn.lock b/shared/yarn.lock index c6f76c9ac73c..3edd9295c3ac 100644 --- a/shared/yarn.lock +++ b/shared/yarn.lock @@ -2320,10 +2320,10 @@ resolved "https://registry.yarnpkg.com/@types/base64-js/-/base64-js-1.2.5.tgz#582b2476169a6cba460a214d476c744441d873d5" integrity sha1-WCskdhaabLpGCiFNR2x0REHYc9U= -"@types/classnames@2.2.8": - version "2.2.8" - resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.2.8.tgz#17139e1e1104203572caa4368f6796f6225b70b4" - integrity sha512-3UrLzPnz8u+MMXuJTF++389IfLSQUbl5F3ry9WCxva0BKG5H/oo5NuPRXk+HrpPU1+5pVHSWhnVWRzIaFQ7QuQ== +"@types/classnames@2.2.9": + version "2.2.9" + resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.2.9.tgz#d868b6febb02666330410fe7f58f3c4b8258be7b" + integrity sha512-MNl+rT5UmZeilaPxAVs6YaPC2m6aA8rofviZbhbxpPpl61uKodfdQVsBtgJGTqGizEf02oW3tsVe7FYB8kK14A== "@types/emoji-mart@2.8.4": version "2.8.4" @@ -2399,16 +2399,21 @@ dependencies: moment "*" -"@types/mousetrap@1.6.2": - version "1.6.2" - resolved "https://registry.yarnpkg.com/@types/mousetrap/-/mousetrap-1.6.2.tgz#5f48bdbd28c8a447167263ae436488f1d8be072d" - integrity sha512-m67PUdzoHJGmYJ6Fno4iXocl+azw9cuz8tdUG21M04UzMRUT1YfxPIIIt3lQkXLMGwlGSKXYNGxCOMxKlGegIw== +"@types/mousetrap@1.6.3": + version "1.6.3" + resolved "https://registry.yarnpkg.com/@types/mousetrap/-/mousetrap-1.6.3.tgz#3159a01a2b21c9155a3d8f85588885d725dc987d" + integrity sha512-13gmo3M2qVvjQrWNseqM3+cR6S2Ss3grbR2NZltgMq94wOwqJYQdgn8qzwDshzgXqMlSUtyPZjysImmktu22ew== "@types/node@*": version "10.12.15" resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.15.tgz#20e85651b62fd86656e57c9c9bc771ab1570bc59" integrity sha512-9kROxduaN98QghwwHmxXO2Xz3MaWf+I1sLVAA6KJDF5xix+IyXVhds0MAfdNwtcpSrzhaTsNB0/jnL86fgUhqA== +"@types/node@12.7.3": + version "12.7.3" + resolved "https://registry.yarnpkg.com/@types/node/-/node-12.7.3.tgz#27b3f40addaf2f580459fdb405222685542f907a" + integrity sha512-3SiLAIBkDWDg6vFo0+5YJyHPWU9uwu40Qe+v+0MH8wRKYBimHvvAOyk3EzMrD/TrIlLYfXrqDqrg913PynrMJQ== + "@types/node@^10.12.18": version "10.12.18" resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.18.tgz#1d3ca764718915584fcd9f6344621b7672665c67" @@ -2431,10 +2436,10 @@ resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.1.tgz#48fd98c1561fe718b61733daed46ff115b496e18" integrity sha512-eqz8c/0kwNi/OEHQfvIuJVLTst3in0e7uTKeuY+WL/zfKn0xVujOTp42bS/vUUokhK5P2BppLd9JXMOMHcgbjA== -"@types/react-dom@16.8.4": - version "16.8.4" - resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.8.4.tgz#7fb7ba368857c7aa0f4e4511c4710ca2c5a12a88" - integrity sha512-eIRpEW73DCzPIMaNBDP5pPIpK1KXyZwNgfxiVagb5iGiz6da+9A5hslSX6GAQKdO7SayVCS/Fr2kjqprgAvkfA== +"@types/react-dom@16.9.0": + version "16.9.0" + resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.9.0.tgz#ba6ddb00bf5de700b0eb91daa452081ffccbfdea" + integrity sha512-OL2lk7LYGjxn4b0efW3Pvf2KBVP0y1v3wip1Bp7nA79NkOpElH98q3WdCEdDj93b2b0zaeBG9DvriuKjIK5xDA== dependencies: "@types/react" "*" @@ -2459,18 +2464,18 @@ dependencies: "@types/react" "*" -"@types/react-native@*", "@types/react-native@0.60.2": - version "0.60.2" - resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.60.2.tgz#2dca78481a904419c2a5907288dd97d1090c6e3c" - integrity sha512-K4+/etirpv52xu24xAc++OdhbD0VQEt0Kq0h6dZrLU82OlA+I7BhpKF3JBvx9tbmrFaZDxhHp8N4TEvRYS4fdQ== +"@types/react-native@*", "@types/react-native@0.60.9": + version "0.60.9" + resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.60.9.tgz#89135a6ac9a71a64837e2100dc8dbc7a71b4fe34" + integrity sha512-fsceCFV6UQOoQ/DzLS0ya82mZdGmUhMvkkVIq3pjMmxcxR6ENb0noPw6ssE4aVx61J6ukth+MT2PNFgy6eQ9iQ== dependencies: "@types/prop-types" "*" "@types/react" "*" -"@types/react-navigation@3.0.7": - version "3.0.7" - resolved "https://registry.yarnpkg.com/@types/react-navigation/-/react-navigation-3.0.7.tgz#5d327b00de2bb58203977002c3ea21302da72034" - integrity sha512-JFsNeCAQEQGTpObiD1QczDyCyQkFBaQA/F85Fo2W8QML1b6UNYHlUDtEYJA6jcfXqPoL15dVPBVj9NBJlHToqA== +"@types/react-navigation@3.0.8": + version "3.0.8" + resolved "https://registry.yarnpkg.com/@types/react-navigation/-/react-navigation-3.0.8.tgz#770d5217a4795fe8526e2a69cc6ccb8600c911e4" + integrity sha512-r8UQvBmOz7XjPE8AHTHh0SThGqModhQtSsntkmob7rczhueJIqDwBOgsEn54SJa25XzD/KBlelAWeVZ7+Ggm8A== dependencies: "@types/react" "*" "@types/react-native" "*" @@ -2489,25 +2494,25 @@ dependencies: "@types/react" "*" -"@types/react-window@1.8.0": - version "1.8.0" - resolved "https://registry.yarnpkg.com/@types/react-window/-/react-window-1.8.0.tgz#0649a855fd20e0541f5bc0079b14ae5e1ba60b93" - integrity sha512-+3pDwfns884TPYCCFFQObruGI1cOeVHAJ34KvyyhsFGTgCQtfR6Fhnh5TKdvATeHE2AslnU/dHx+tcfJgbhZ8Q== +"@types/react-window@1.8.1": + version "1.8.1" + resolved "https://registry.yarnpkg.com/@types/react-window/-/react-window-1.8.1.tgz#6e1ceab2e6f2f78dbf1f774ee0e00f1bb0364bb3" + integrity sha512-V3k1O5cbfZIRa0VVbQ81Ekq/7w42CK1SuiB9U1oPMTxv270D9qUn7rHb3sZoqMkIJFfB1NZxaH7NRDlk+ToDsg== dependencies: "@types/react" "*" -"@types/react@*", "@types/react@16.8.22": - version "16.8.22" - resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.22.tgz#7f18bf5ea0c1cad73c46b6b1c804a3ce0eec6d54" - integrity sha512-C3O1yVqk4sUXqWyx0wlys76eQfhrQhiDhDlHBrjER76lR2S2Agiid/KpOU9oCqj1dISStscz7xXz1Cg8+sCQeA== +"@types/react@*", "@types/react@16.9.2": + version "16.9.2" + resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.2.tgz#6d1765431a1ad1877979013906731aae373de268" + integrity sha512-jYP2LWwlh+FTqGd9v7ynUKZzjj98T8x7Yclz479QdRhHfuW9yQ+0jjnD31eXSXutmBpppj5PYNLYLRfnZJvcfg== dependencies: "@types/prop-types" "*" csstype "^2.2.0" -"@types/recompose@0.30.6": - version "0.30.6" - resolved "https://registry.yarnpkg.com/@types/recompose/-/recompose-0.30.6.tgz#f6ffae2008b84df916ed6633751f9287f344ea3e" - integrity sha512-A9c880h07JMrvVe+PwyjVihrQRyKWp4/GFjfA9YE4NgxdEuQD74gSdDhInhUNctO/dkCcR66rexEXevzBy85cQ== +"@types/recompose@0.30.7": + version "0.30.7" + resolved "https://registry.yarnpkg.com/@types/recompose/-/recompose-0.30.7.tgz#0d47f3da3bdf889a4f36d4ca7531fac1eee1c6bd" + integrity sha512-kEvD7XMguXgG7jJJS//cE1QTbkFj2qDtIPAg1FvXxE8D6jD1C0WabJjT7cVitC7TK0N5I3yp2955hqNFFZV0wg== dependencies: "@types/react" "*" @@ -2536,10 +2541,10 @@ resolved "https://registry.yarnpkg.com/@types/url-parse/-/url-parse-1.4.3.tgz#fba49d90f834951cb000a674efee3d6f20968329" integrity sha512-4kHAkbV/OfW2kb5BLVUuUMoumB3CP8rHqlw48aHvFy5tf9ER0AfOonBlX29l/DD68G70DmyhRlSYfQPSYpC5Vw== -"@types/uuid@3.4.4": - version "3.4.4" - resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-3.4.4.tgz#7af69360fa65ef0decb41fd150bf4ca5c0cefdf5" - integrity sha512-tPIgT0GUmdJQNSHxp0X2jnpQfBSTfGxUMc/2CXBU2mnyTFVYVa2ojpoQ74w0U2yn2vw3jnC640+77lkFFpdVDw== +"@types/uuid@3.4.5": + version "3.4.5" + resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-3.4.5.tgz#d4dc10785b497a1474eae0ba7f0cb09c0ddfd6eb" + integrity sha512-MNL15wC3EKyw1VLF+RoVO4hJJdk9t/Hlv3rt1OL65Qvuadm4BYo6g9ZJQqoq7X8NBFSsQXgAujWciovh2lpVjA== dependencies: "@types/node" "*" @@ -2560,10 +2565,10 @@ "@types/unist" "*" "@types/vfile-message" "*" -"@types/webpack-env@1.13.9": - version "1.13.9" - resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.13.9.tgz#a67287861c928ebf4159a908d1fb1a2a34d4097a" - integrity sha512-p8zp5xqkly3g4cCmo2mKOHI9+Z/kObmDj0BmjbDDJQlgDTiEGTbm17MEwTAusV6XceCy+bNw9q/ZHXHyKo3zkg== +"@types/webpack-env@1.14.0": + version "1.14.0" + resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.14.0.tgz#8edfc5f8e6eae20eeed3ca0d02974ed4ee5e4efc" + integrity sha512-Fv+0gYJzE/czLoRKq+gnXWr4yBpPM3tO3C8pDLFwqVKlMICQUq5OsxwwFZYDaVr7+L6mgNDp16iOcJHEz3J5RQ== "@types/whatwg-url@6.4.0": version "6.4.0" @@ -16026,10 +16031,10 @@ typedarray@^0.0.6: resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= -typescript@3.5.3: - version "3.5.3" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.5.3.tgz#c830f657f93f1ea846819e929092f5fe5983e977" - integrity sha512-ACzBtm/PhXBDId6a6sDJfroT2pOWt/oOnk4/dElG5G33ZL776N3Y6/6bKZJBFpd+b05F3Ct9qDjMeJmRWtE2/g== +typescript@3.6.3: + version "3.6.3" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.6.3.tgz#fea942fabb20f7e1ca7164ff626f1a9f3f70b4da" + integrity sha512-N7bceJL1CtRQ2RiG0AQME13ksR7DiuQh/QehubYcghzv20tnh+MQnQIuJddTmsbqYj+dztchykemz0zFzlvdQw== ua-parser-js@^0.7.18, ua-parser-js@^0.7.19: version "0.7.19"