Showing preview only (2,718K chars total). Download the full file or copy to clipboard to get everything.
Repository: microsoft/reactxp
Branch: master
Commit: 9faae700c7fd
Files: 790
Total size: 2.5 MB
Directory structure:
gitextract_wyk0on54/
├── .eslintrc.json
├── .gitignore
├── .npmignore
├── .npmrc
├── .travis.yml
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── README_Hindi.md
├── SECURITY.md
├── azure-pipelines.yml
├── docs/
│ ├── Gemfile
│ ├── _config.yml
│ ├── _data/
│ │ ├── authors.yml
│ │ └── nav_docs.yml
│ ├── _includes/
│ │ ├── blog_post.html
│ │ ├── footer.html
│ │ ├── hero.html
│ │ ├── nav_blog.html
│ │ ├── nav_docs.html
│ │ └── navigation.html
│ ├── _layouts/
│ │ ├── default.html
│ │ ├── docs.html
│ │ ├── hero.html
│ │ └── post.html
│ ├── _plugins/
│ │ └── sass.rb
│ ├── _posts/
│ │ ├── 2017-04-06-introducing-reactxp.md
│ │ ├── 2017-04-27-building-skype-on-reactxp.md
│ │ ├── 2017-05-24-performance-tuning.md
│ │ └── 2017-06-29-asset-loading.md
│ ├── _sass/
│ │ ├── _typography.scss
│ │ └── _variables.scss
│ ├── blog/
│ │ ├── all.html
│ │ └── index.html
│ ├── community/
│ │ └── support.md
│ ├── css/
│ │ ├── reactxp.scss
│ │ └── syntax.css
│ ├── docs/
│ │ ├── accessibility.md
│ │ ├── animations.md
│ │ ├── apis/
│ │ │ ├── accessibility.md
│ │ │ ├── alert.md
│ │ │ ├── app.md
│ │ │ ├── clipboard.md
│ │ │ ├── input.md
│ │ │ ├── international.md
│ │ │ ├── linking.md
│ │ │ ├── location.md
│ │ │ ├── modal.md
│ │ │ ├── network.md
│ │ │ ├── platform.md
│ │ │ ├── popup.md
│ │ │ ├── statusbar.md
│ │ │ ├── storage.md
│ │ │ ├── userinterface.md
│ │ │ └── userpresence.md
│ │ ├── components/
│ │ │ ├── activityindicator.md
│ │ │ ├── button.md
│ │ │ ├── gestureview.md
│ │ │ ├── image.md
│ │ │ ├── link.md
│ │ │ ├── picker.md
│ │ │ ├── scrollview.md
│ │ │ ├── text.md
│ │ │ ├── textinput.md
│ │ │ ├── view.md
│ │ │ └── webview.md
│ │ ├── extensions/
│ │ │ ├── database.md
│ │ │ ├── imagesvg.md
│ │ │ ├── navigator.md
│ │ │ ├── netinfo.md
│ │ │ ├── restclient.md
│ │ │ ├── video.md
│ │ │ ├── virtuallistview.md
│ │ │ └── webview.md
│ │ ├── extensions.md
│ │ ├── faq.md
│ │ ├── getting-started.md
│ │ ├── react_concepts.md
│ │ ├── react_lifecycle.md
│ │ ├── react_stores.md
│ │ ├── styles.md
│ │ └── using-reactxp.md
│ ├── index.md
│ └── versions/
│ └── version_history.md
├── extensions/
│ ├── README.md
│ ├── imagesvg/
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── .npmignore
│ │ ├── README.md
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.js
│ │ ├── index.macos.js
│ │ ├── index.windows.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── android/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── common/
│ │ │ │ ├── Interfaces.ts
│ │ │ │ ├── PluginBaseChecker.ts
│ │ │ │ ├── Types.ts
│ │ │ │ └── assert.ts
│ │ │ ├── ios/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── macos/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── native-common/
│ │ │ │ ├── ImageSvg.tsx
│ │ │ │ ├── SvgPath.tsx
│ │ │ │ └── SvgRect.tsx
│ │ │ ├── typings/
│ │ │ │ └── react-native-svg.d.ts
│ │ │ ├── web/
│ │ │ │ ├── ImageSvg.tsx
│ │ │ │ ├── PluginBase.ts
│ │ │ │ ├── SvgPath.tsx
│ │ │ │ └── SvgRect.tsx
│ │ │ └── windows/
│ │ │ ├── ImageSvg.tsx
│ │ │ ├── PluginBase.ts
│ │ │ ├── SvgPath.tsx
│ │ │ └── SvgRect.tsx
│ │ └── tsconfig.json
│ ├── navigation/
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── .npmignore
│ │ ├── README.md
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.js
│ │ ├── index.macos.js
│ │ ├── index.windows.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── common/
│ │ │ │ ├── Types.ts
│ │ │ │ ├── assert.ts
│ │ │ │ └── lodashMini.ts
│ │ │ ├── native-common/
│ │ │ │ ├── Navigator.tsx
│ │ │ │ └── NavigatorExperimentalDelegate.tsx
│ │ │ ├── typings/
│ │ │ │ ├── react-native-deprecated-custom-components.d.ts
│ │ │ │ └── rebound.d.ts
│ │ │ └── web/
│ │ │ ├── Navigator.tsx
│ │ │ └── NavigatorSceneConfigFactory.tsx
│ │ └── tsconfig.json
│ ├── netinfo/
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── .npmignore
│ │ ├── README.md
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.js
│ │ ├── index.macos.js
│ │ ├── index.windows.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── android/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── common/
│ │ │ │ ├── Interfaces.ts
│ │ │ │ ├── PluginBaseChecker.ts
│ │ │ │ └── Types.ts
│ │ │ ├── ios/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── macos/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── native-common/
│ │ │ │ └── NetInfo.tsx
│ │ │ ├── web/
│ │ │ │ ├── NetInfo.tsx
│ │ │ │ └── PluginBase.ts
│ │ │ └── windows/
│ │ │ └── PluginBase.ts
│ │ └── tsconfig.json
│ ├── video/
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── .npmignore
│ │ ├── README.md
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.js
│ │ ├── index.macos.js
│ │ ├── index.windows.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── android/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── common/
│ │ │ │ ├── Interfaces.ts
│ │ │ │ ├── PluginBaseChecker.ts
│ │ │ │ └── Types.ts
│ │ │ ├── ios/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── macos/
│ │ │ │ └── PluginBase.tsx
│ │ │ ├── native-common/
│ │ │ │ └── Video.tsx
│ │ │ ├── typings/
│ │ │ │ └── react-native-video.d.ts
│ │ │ ├── web/
│ │ │ │ ├── PluginBase.ts
│ │ │ │ └── Video.tsx
│ │ │ └── windows/
│ │ │ ├── PluginBase.ts
│ │ │ └── Video.tsx
│ │ └── tsconfig.json
│ ├── virtuallistview/
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── .npmignore
│ │ ├── LICENSE
│ │ ├── README.md
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.js
│ │ ├── index.macos.js
│ │ ├── index.windows.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── VirtualListCell.tsx
│ │ │ ├── VirtualListView.tsx
│ │ │ └── assert.ts
│ │ └── tsconfig.json
│ └── webview/
│ ├── .eslintrc.json
│ ├── .gitignore
│ ├── .npmignore
│ ├── README.md
│ ├── index.android.js
│ ├── index.ios.js
│ ├── index.js
│ ├── index.macos.js
│ ├── index.windows.js
│ ├── package.json
│ ├── src/
│ │ ├── android/
│ │ │ └── PluginBase.tsx
│ │ ├── common/
│ │ │ ├── Interfaces.ts
│ │ │ ├── PluginBaseChecker.ts
│ │ │ └── Types.ts
│ │ ├── ios/
│ │ │ └── PluginBase.tsx
│ │ ├── macos/
│ │ │ └── PluginBase.tsx
│ │ ├── native-common/
│ │ │ └── WebView.tsx
│ │ ├── web/
│ │ │ ├── PluginBase.ts
│ │ │ └── WebView.tsx
│ │ └── windows/
│ │ └── PluginBase.ts
│ └── tsconfig.json
├── index.android.js
├── index.ios.js
├── index.js
├── index.macos.js
├── index.windows.js
├── package.json
├── samples/
│ ├── ImageList/
│ │ ├── .eslintrc
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── android/
│ │ │ ├── app/
│ │ │ │ ├── BUCK
│ │ │ │ ├── build.gradle
│ │ │ │ ├── build_defs.bzl
│ │ │ │ ├── proguard-rules.pro
│ │ │ │ └── src/
│ │ │ │ ├── debug/
│ │ │ │ │ ├── AndroidManifest.xml
│ │ │ │ │ └── res/
│ │ │ │ │ └── xml/
│ │ │ │ │ └── react_native_config.xml
│ │ │ │ └── main/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ ├── assets/
│ │ │ │ │ └── .gitignore
│ │ │ │ ├── java/
│ │ │ │ │ └── com/
│ │ │ │ │ └── rxpimagelist/
│ │ │ │ │ ├── MainActivity.java
│ │ │ │ │ └── MainApplication.java
│ │ │ │ └── res/
│ │ │ │ └── values/
│ │ │ │ ├── strings.xml
│ │ │ │ └── styles.xml
│ │ │ ├── build.gradle
│ │ │ ├── gradle/
│ │ │ │ └── wrapper/
│ │ │ │ ├── gradle-wrapper.jar
│ │ │ │ └── gradle-wrapper.properties
│ │ │ ├── gradle.properties
│ │ │ ├── gradlew
│ │ │ ├── gradlew.bat
│ │ │ ├── keystores/
│ │ │ │ ├── BUCK
│ │ │ │ └── debug.keystore.properties
│ │ │ └── settings.gradle
│ │ ├── babel.config.js
│ │ ├── index.js
│ │ ├── ios/
│ │ │ ├── RXPImageList/
│ │ │ │ ├── AppDelegate.h
│ │ │ │ ├── AppDelegate.m
│ │ │ │ ├── Base.lproj/
│ │ │ │ │ └── LaunchScreen.xib
│ │ │ │ ├── Images.xcassets/
│ │ │ │ │ ├── AppIcon.appiconset/
│ │ │ │ │ │ └── Contents.json
│ │ │ │ │ └── Contents.json
│ │ │ │ ├── Info.plist
│ │ │ │ └── main.m
│ │ │ ├── RXPImageList-tvOS/
│ │ │ │ └── Info.plist
│ │ │ ├── RXPImageList-tvOSTests/
│ │ │ │ └── Info.plist
│ │ │ ├── RXPImageList.xcodeproj/
│ │ │ │ ├── project.pbxproj
│ │ │ │ └── xcshareddata/
│ │ │ │ └── xcschemes/
│ │ │ │ ├── RXPImageList-tvOS.xcscheme
│ │ │ │ └── RXPImageList.xcscheme
│ │ │ └── RXPImageListTests/
│ │ │ ├── Info.plist
│ │ │ └── RXPImageListTests.m
│ │ ├── jest/
│ │ │ ├── enzyme.config.js
│ │ │ └── jest.config.js
│ │ ├── metro.config.js
│ │ ├── package.json
│ │ ├── scripts/
│ │ │ └── react-native.js
│ │ ├── src/
│ │ │ ├── App.tsx
│ │ │ ├── config.ts
│ │ │ ├── controls/
│ │ │ │ └── SearchField.tsx
│ │ │ ├── index.tsx
│ │ │ ├── services/
│ │ │ │ └── GiphyClient.ts
│ │ │ ├── stores/
│ │ │ │ └── ImageStore.ts
│ │ │ └── views/
│ │ │ ├── ImageList.tsx
│ │ │ └── RootView.tsx
│ │ ├── tsconfig.json
│ │ ├── web/
│ │ │ ├── index.hmr.js
│ │ │ ├── template.html
│ │ │ └── webpack/
│ │ │ ├── common.js
│ │ │ ├── dev.js
│ │ │ └── prod.js
│ │ └── windows/
│ │ ├── .gitignore
│ │ ├── RXPImageList/
│ │ │ ├── App.xaml
│ │ │ ├── App.xaml.cs
│ │ │ ├── MainReactNativeHost.cs
│ │ │ ├── Package.appxmanifest
│ │ │ ├── Properties/
│ │ │ │ ├── AssemblyInfo.cs
│ │ │ │ └── Default.rd.xml
│ │ │ ├── RXPImageList.csproj
│ │ │ ├── RXPImageList_TemporaryKey.pfx
│ │ │ └── ReactAssets/
│ │ │ └── .gitignore
│ │ └── RXPImageList.sln
│ ├── README.md
│ ├── RXPTest/
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── android/
│ │ │ ├── app/
│ │ │ │ ├── BUCK
│ │ │ │ ├── build.gradle
│ │ │ │ ├── build_defs.bzl
│ │ │ │ ├── proguard-rules.pro
│ │ │ │ └── src/
│ │ │ │ ├── debug/
│ │ │ │ │ └── AndroidManifest.xml
│ │ │ │ └── main/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ ├── java/
│ │ │ │ │ └── com/
│ │ │ │ │ └── rxphelloworld/
│ │ │ │ │ ├── MainActivity.java
│ │ │ │ │ └── MainApplication.java
│ │ │ │ └── res/
│ │ │ │ └── values/
│ │ │ │ ├── strings.xml
│ │ │ │ └── styles.xml
│ │ │ ├── build.gradle
│ │ │ ├── gradle/
│ │ │ │ └── wrapper/
│ │ │ │ ├── gradle-wrapper.jar
│ │ │ │ └── gradle-wrapper.properties
│ │ │ ├── gradle.properties
│ │ │ ├── gradlew
│ │ │ ├── gradlew.bat
│ │ │ ├── keystores/
│ │ │ │ ├── BUCK
│ │ │ │ └── debug.keystore.properties
│ │ │ └── settings.gradle
│ │ ├── index.android.js
│ │ ├── index.html
│ │ ├── index.ios.js
│ │ ├── index.windows.js
│ │ ├── ios/
│ │ │ ├── RXPTest/
│ │ │ │ ├── AppDelegate.h
│ │ │ │ ├── AppDelegate.m
│ │ │ │ ├── Base.lproj/
│ │ │ │ │ └── LaunchScreen.xib
│ │ │ │ ├── Images.xcassets/
│ │ │ │ │ └── AppIcon.appiconset/
│ │ │ │ │ └── Contents.json
│ │ │ │ ├── Info.plist
│ │ │ │ └── main.m
│ │ │ └── RXPTest.xcodeproj/
│ │ │ ├── project.pbxproj
│ │ │ └── xcshareddata/
│ │ │ └── xcschemes/
│ │ │ ├── RXPTest-tvOS.xcscheme
│ │ │ └── RXPTest.xcscheme
│ │ ├── metro.config.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ ├── App.tsx
│ │ │ ├── CommonStyles.tsx
│ │ │ ├── Test.tsx
│ │ │ ├── TestContainer.tsx
│ │ │ ├── TestListView.tsx
│ │ │ ├── TestRegistry.ts
│ │ │ ├── Tests/
│ │ │ │ ├── AccessibilityTest.tsx
│ │ │ │ ├── ActivityIndicatorTest.tsx
│ │ │ │ ├── AlertTest.tsx
│ │ │ │ ├── AnimationTest.tsx
│ │ │ │ ├── AppTest.tsx
│ │ │ │ ├── ButtonTest.tsx
│ │ │ │ ├── ClipboardTest.tsx
│ │ │ │ ├── DragAndDropTest.tsx
│ │ │ │ ├── GestureViewTest.tsx
│ │ │ │ ├── ImageApiTest.tsx
│ │ │ │ ├── ImageInteractiveTest.tsx
│ │ │ │ ├── InputTest.tsx
│ │ │ │ ├── InternationalTest.tsx
│ │ │ │ ├── LinkTest.tsx
│ │ │ │ ├── LinkingTest.tsx
│ │ │ │ ├── LocationTest.tsx
│ │ │ │ ├── ModalTest.tsx
│ │ │ │ ├── NetworkTest.tsx
│ │ │ │ ├── PickerTest.tsx
│ │ │ │ ├── PlatformTest.tsx
│ │ │ │ ├── PopupTest.tsx
│ │ │ │ ├── ScrollViewBasicTest.tsx
│ │ │ │ ├── ScrollViewEventTest.tsx
│ │ │ │ ├── StatusBarTest.tsx
│ │ │ │ ├── StorageTest.tsx
│ │ │ │ ├── TextInputApiTest.tsx
│ │ │ │ ├── TextInputInteractiveTest.tsx
│ │ │ │ ├── TextTest.tsx
│ │ │ │ ├── UserInterfaceTest.tsx
│ │ │ │ ├── UserPresenceTest.tsx
│ │ │ │ ├── ViewBasicTest.tsx
│ │ │ │ ├── ViewMouseTest.tsx
│ │ │ │ ├── ViewTouchTest.tsx
│ │ │ │ ├── WebViewBasicTest.tsx
│ │ │ │ └── WebViewDynamicTest.tsx
│ │ │ ├── Utilities.ts
│ │ │ └── index.tsx
│ │ ├── tsconfig.json
│ │ ├── tslint.json
│ │ ├── webpack.config.ts
│ │ └── windows/
│ │ ├── .gitignore
│ │ ├── rxptest/
│ │ │ ├── App.xaml
│ │ │ ├── App.xaml.cs
│ │ │ ├── MainReactNativeHost.cs
│ │ │ ├── Package.appxmanifest
│ │ │ ├── Properties/
│ │ │ │ ├── AssemblyInfo.cs
│ │ │ │ └── Default.rd.xml
│ │ │ ├── ReactAssets/
│ │ │ │ └── .gitignore
│ │ │ ├── rxptest.csproj
│ │ │ └── rxptest_TemporaryKey.pfx
│ │ └── rxptest.sln
│ ├── TodoList/
│ │ ├── .babelrc
│ │ ├── .eslintrc.json
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── android/
│ │ │ ├── app/
│ │ │ │ ├── BUCK
│ │ │ │ ├── build.gradle
│ │ │ │ ├── build_defs.bzl
│ │ │ │ ├── debug.keystore
│ │ │ │ ├── proguard-rules.pro
│ │ │ │ └── src/
│ │ │ │ ├── debug/
│ │ │ │ │ ├── AndroidManifest.xml
│ │ │ │ │ └── java/
│ │ │ │ │ └── com/
│ │ │ │ │ └── rxptodolist/
│ │ │ │ │ └── ReactNativeFlipper.java
│ │ │ │ └── main/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ ├── java/
│ │ │ │ │ └── com/
│ │ │ │ │ └── rxptodolist/
│ │ │ │ │ ├── MainActivity.java
│ │ │ │ │ └── MainApplication.java
│ │ │ │ └── res/
│ │ │ │ └── values/
│ │ │ │ ├── strings.xml
│ │ │ │ └── styles.xml
│ │ │ ├── build.gradle
│ │ │ ├── gradle/
│ │ │ │ └── wrapper/
│ │ │ │ ├── gradle-wrapper.jar
│ │ │ │ └── gradle-wrapper.properties
│ │ │ ├── gradle.properties
│ │ │ ├── gradlew
│ │ │ ├── gradlew.bat
│ │ │ └── settings.gradle
│ │ ├── app.json
│ │ ├── babel.config.js
│ │ ├── buildconfig.js
│ │ ├── buildtools/
│ │ │ └── inline-require.js
│ │ ├── gulpfile.js
│ │ ├── index.android.js
│ │ ├── index.ios.js
│ │ ├── index.windows.js
│ │ ├── ios/
│ │ │ ├── Podfile
│ │ │ ├── rxptodolist/
│ │ │ │ ├── AppDelegate.h
│ │ │ │ ├── AppDelegate.m
│ │ │ │ ├── Base.lproj/
│ │ │ │ │ └── LaunchScreen.xib
│ │ │ │ ├── Images.xcassets/
│ │ │ │ │ ├── AppIcon.appiconset/
│ │ │ │ │ │ └── Contents.json
│ │ │ │ │ └── Contents.json
│ │ │ │ ├── Info.plist
│ │ │ │ └── main.m
│ │ │ ├── rxptodolist-tvOS/
│ │ │ │ └── Info.plist
│ │ │ ├── rxptodolist-tvOSTests/
│ │ │ │ └── Info.plist
│ │ │ ├── rxptodolist.xcodeproj/
│ │ │ │ ├── project.pbxproj
│ │ │ │ └── xcshareddata/
│ │ │ │ └── xcschemes/
│ │ │ │ ├── rxptodolist-tvOS.xcscheme
│ │ │ │ └── rxptodolist.xcscheme
│ │ │ └── rxptodolistTests/
│ │ │ ├── Info.plist
│ │ │ └── rxptodolistTests.m
│ │ ├── metro.config.js
│ │ ├── nodeserver.js
│ │ ├── package.json
│ │ ├── src/
│ │ │ └── ts/
│ │ │ ├── app/
│ │ │ │ ├── AppBootstrapper.tsx
│ │ │ │ ├── AppBootstrapperNative.tsx
│ │ │ │ ├── AppBootstrapperWeb.tsx
│ │ │ │ ├── AppConfig.ts
│ │ │ │ ├── DeepLinkConverter.ts
│ │ │ │ ├── LocalDb.ts
│ │ │ │ ├── NavActions.ts
│ │ │ │ ├── README.md
│ │ │ │ └── Styles.tsx
│ │ │ ├── controls/
│ │ │ │ ├── HoverButton.tsx
│ │ │ │ ├── Modal.tsx
│ │ │ │ ├── README.md
│ │ │ │ ├── SimpleButton.tsx
│ │ │ │ ├── SimpleDialog.tsx
│ │ │ │ ├── SimpleMenu.tsx
│ │ │ │ └── VerticalSeparator.tsx
│ │ │ ├── index.web.tsx
│ │ │ ├── models/
│ │ │ │ ├── IdentityModels.ts
│ │ │ │ ├── NavModels.ts
│ │ │ │ ├── README.md
│ │ │ │ ├── ResponsiveWidthModels.ts
│ │ │ │ └── TodoModels.ts
│ │ │ ├── modules/
│ │ │ │ ├── README.md
│ │ │ │ ├── fonts/
│ │ │ │ │ ├── Fonts.ts
│ │ │ │ │ ├── index.native.ts
│ │ │ │ │ ├── index.web.ts
│ │ │ │ │ └── index.windows.ts
│ │ │ │ └── images/
│ │ │ │ ├── Images.ts
│ │ │ │ ├── index.native.ts
│ │ │ │ └── index.web.ts
│ │ │ ├── services/
│ │ │ │ ├── PageUrlService.ts
│ │ │ │ ├── README.md
│ │ │ │ ├── ServiceManager.ts
│ │ │ │ └── ServiceRegistrar.ts
│ │ │ ├── stores/
│ │ │ │ ├── CurrentUserStore.ts
│ │ │ │ ├── NavContextStore.ts
│ │ │ │ ├── README.md
│ │ │ │ ├── ResponsiveWidthStore.ts
│ │ │ │ └── TodosStore.tsx
│ │ │ ├── typings/
│ │ │ │ └── defines.d.ts
│ │ │ ├── utilities/
│ │ │ │ ├── ExceptionReporter.ts
│ │ │ │ ├── KeyCodes.ts
│ │ │ │ ├── README.md
│ │ │ │ └── ShimHelpers.ts
│ │ │ └── views/
│ │ │ ├── AccountMenuButton.tsx
│ │ │ ├── CreateTodoPanel.tsx
│ │ │ ├── README.md
│ │ │ ├── RootView.tsx
│ │ │ ├── TodoCompositeView.tsx
│ │ │ ├── TodoListItem.tsx
│ │ │ ├── TodoListPanel.tsx
│ │ │ ├── TopBarComposite.tsx
│ │ │ ├── TopBarStack.tsx
│ │ │ └── ViewTodoPanel.tsx
│ │ ├── tsconfig.json
│ │ ├── web/
│ │ │ ├── css/
│ │ │ │ └── app.css
│ │ │ └── index.html
│ │ ├── webpack.config.ts
│ │ └── windows/
│ │ ├── .gitignore
│ │ ├── TodoList/
│ │ │ ├── App.xaml
│ │ │ ├── App.xaml.cs
│ │ │ ├── MainPage.cs
│ │ │ ├── Package.appxmanifest
│ │ │ ├── Properties/
│ │ │ │ ├── AssemblyInfo.cs
│ │ │ │ └── Default.rd.xml
│ │ │ ├── TodoList.csproj
│ │ │ └── TodoList_TemporaryKey.pfx
│ │ └── TodoList.sln
│ ├── hello-world/
│ │ ├── .eslintrc
│ │ ├── .gitignore
│ │ ├── README.md
│ │ ├── android/
│ │ │ ├── app/
│ │ │ │ ├── BUCK
│ │ │ │ ├── build.gradle
│ │ │ │ ├── build_defs.bzl
│ │ │ │ ├── proguard-rules.pro
│ │ │ │ └── src/
│ │ │ │ ├── debug/
│ │ │ │ │ ├── AndroidManifest.xml
│ │ │ │ │ └── res/
│ │ │ │ │ └── xml/
│ │ │ │ │ └── react_native_config.xml
│ │ │ │ └── main/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ ├── java/
│ │ │ │ │ └── com/
│ │ │ │ │ └── rxphelloworld/
│ │ │ │ │ ├── MainActivity.java
│ │ │ │ │ └── MainApplication.java
│ │ │ │ └── res/
│ │ │ │ └── values/
│ │ │ │ ├── strings.xml
│ │ │ │ └── styles.xml
│ │ │ ├── build.gradle
│ │ │ ├── gradle/
│ │ │ │ └── wrapper/
│ │ │ │ ├── gradle-wrapper.jar
│ │ │ │ └── gradle-wrapper.properties
│ │ │ ├── gradle.properties
│ │ │ ├── gradlew
│ │ │ ├── gradlew.bat
│ │ │ ├── keystores/
│ │ │ │ ├── BUCK
│ │ │ │ └── debug.keystore.properties
│ │ │ └── settings.gradle
│ │ ├── babel.config.js
│ │ ├── index.js
│ │ ├── ios/
│ │ │ ├── RXPHelloWorld/
│ │ │ │ ├── AppDelegate.h
│ │ │ │ ├── AppDelegate.m
│ │ │ │ ├── Base.lproj/
│ │ │ │ │ └── LaunchScreen.xib
│ │ │ │ ├── Images.xcassets/
│ │ │ │ │ ├── AppIcon.appiconset/
│ │ │ │ │ │ └── Contents.json
│ │ │ │ │ └── Contents.json
│ │ │ │ ├── Info.plist
│ │ │ │ └── main.m
│ │ │ ├── RXPHelloWorld-tvOS/
│ │ │ │ └── Info.plist
│ │ │ ├── RXPHelloWorld-tvOSTests/
│ │ │ │ └── Info.plist
│ │ │ ├── RXPHelloWorld.xcodeproj/
│ │ │ │ ├── project.pbxproj
│ │ │ │ └── xcshareddata/
│ │ │ │ └── xcschemes/
│ │ │ │ ├── RXPHelloWorld-tvOS.xcscheme
│ │ │ │ └── RXPHelloWorld.xcscheme
│ │ │ └── RXPHelloWorldTests/
│ │ │ ├── Info.plist
│ │ │ └── RXPHelloWorldTests.m
│ │ ├── jest/
│ │ │ ├── enzyme.config.js
│ │ │ └── jest.config.js
│ │ ├── metro.config.js
│ │ ├── package.json
│ │ ├── scripts/
│ │ │ └── react-native.js
│ │ ├── src/
│ │ │ ├── App.tsx
│ │ │ ├── config.ts
│ │ │ ├── controls/
│ │ │ │ ├── ProgressIndicator.tsx
│ │ │ │ └── ToggleSwitch.tsx
│ │ │ ├── index.tsx
│ │ │ └── views/
│ │ │ ├── MainPanel.tsx
│ │ │ ├── RootView.tsx
│ │ │ └── SecondPanel.tsx
│ │ ├── tsconfig.json
│ │ ├── web/
│ │ │ ├── index.hmr.js
│ │ │ ├── template.html
│ │ │ └── webpack/
│ │ │ ├── common.js
│ │ │ ├── dev.js
│ │ │ └── prod.js
│ │ └── windows/
│ │ ├── .gitignore
│ │ ├── RXPHelloWorld/
│ │ │ ├── App.xaml
│ │ │ ├── App.xaml.cs
│ │ │ ├── MainReactNativeHost.cs
│ │ │ ├── Package.appxmanifest
│ │ │ ├── Properties/
│ │ │ │ ├── AssemblyInfo.cs
│ │ │ │ └── Default.rd.xml
│ │ │ ├── RXPHelloWorld.csproj
│ │ │ ├── RXPHelloWorld_TemporaryKey.pfx
│ │ │ └── ReactAssets/
│ │ │ └── .gitignore
│ │ └── RXPHelloWorld.sln
│ └── hello-world-js/
│ ├── .eslintrc
│ ├── .gitignore
│ ├── README.md
│ ├── android/
│ │ ├── app/
│ │ │ ├── BUCK
│ │ │ ├── build.gradle
│ │ │ ├── build_defs.bzl
│ │ │ ├── proguard-rules.pro
│ │ │ └── src/
│ │ │ ├── debug/
│ │ │ │ ├── AndroidManifest.xml
│ │ │ │ └── res/
│ │ │ │ └── xml/
│ │ │ │ └── react_native_config.xml
│ │ │ └── main/
│ │ │ ├── AndroidManifest.xml
│ │ │ ├── java/
│ │ │ │ └── com/
│ │ │ │ └── rxphelloworld/
│ │ │ │ ├── MainActivity.java
│ │ │ │ └── MainApplication.java
│ │ │ └── res/
│ │ │ └── values/
│ │ │ ├── strings.xml
│ │ │ └── styles.xml
│ │ ├── build.gradle
│ │ ├── gradle/
│ │ │ └── wrapper/
│ │ │ ├── gradle-wrapper.jar
│ │ │ └── gradle-wrapper.properties
│ │ ├── gradle.properties
│ │ ├── gradlew
│ │ ├── gradlew.bat
│ │ ├── keystores/
│ │ │ ├── BUCK
│ │ │ └── debug.keystore.properties
│ │ └── settings.gradle
│ ├── babel.config.js
│ ├── index.js
│ ├── ios/
│ │ ├── RXPHelloWorld/
│ │ │ ├── AppDelegate.h
│ │ │ ├── AppDelegate.m
│ │ │ ├── Base.lproj/
│ │ │ │ └── LaunchScreen.xib
│ │ │ ├── Images.xcassets/
│ │ │ │ ├── AppIcon.appiconset/
│ │ │ │ │ └── Contents.json
│ │ │ │ └── Contents.json
│ │ │ ├── Info.plist
│ │ │ └── main.m
│ │ ├── RXPHelloWorld-tvOS/
│ │ │ └── Info.plist
│ │ ├── RXPHelloWorld-tvOSTests/
│ │ │ └── Info.plist
│ │ ├── RXPHelloWorld.xcodeproj/
│ │ │ ├── project.pbxproj
│ │ │ └── xcshareddata/
│ │ │ └── xcschemes/
│ │ │ ├── RXPHelloWorld-tvOS.xcscheme
│ │ │ └── RXPHelloWorld.xcscheme
│ │ └── RXPHelloWorldTests/
│ │ ├── Info.plist
│ │ └── RXPHelloWorldTests.m
│ ├── jest/
│ │ ├── enzyme.config.js
│ │ └── jest.config.js
│ ├── metro.config.js
│ ├── package.json
│ ├── scripts/
│ │ └── react-native.js
│ ├── src/
│ │ ├── App.js
│ │ ├── config.js
│ │ ├── controls/
│ │ │ ├── ProgressIndicator.js
│ │ │ └── ToggleSwitch.js
│ │ ├── index.js
│ │ └── views/
│ │ ├── MainPanel.js
│ │ ├── RootView.js
│ │ └── SecondPanel.js
│ ├── web/
│ │ ├── index.hmr.js
│ │ ├── template.html
│ │ └── webpack/
│ │ ├── common.js
│ │ ├── dev.js
│ │ └── prod.js
│ └── windows/
│ ├── .gitignore
│ ├── RXPHelloWorld/
│ │ ├── App.xaml
│ │ ├── App.xaml.cs
│ │ ├── MainReactNativeHost.cs
│ │ ├── Package.appxmanifest
│ │ ├── Properties/
│ │ │ ├── AssemblyInfo.cs
│ │ │ └── Default.rd.xml
│ │ ├── RXPHelloWorld.csproj
│ │ ├── RXPHelloWorld_TemporaryKey.pfx
│ │ └── ReactAssets/
│ │ └── .gitignore
│ └── RXPHelloWorld.sln
├── src/
│ ├── ReactXP.ts
│ ├── android/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityUtil.ts
│ │ ├── GestureView.tsx
│ │ ├── Image.tsx
│ │ ├── ReactXP.ts
│ │ ├── StatusBar.ts
│ │ └── Text.tsx
│ ├── common/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityUtil.ts
│ │ ├── AppConfig.ts
│ │ ├── Bezier.ts
│ │ ├── Easing.ts
│ │ ├── GestureView.tsx
│ │ ├── Image.ts
│ │ ├── Interfaces.ts
│ │ ├── Linking.ts
│ │ ├── Location.ts
│ │ ├── ModuleInterface.ts
│ │ ├── PopupContainerViewBase.tsx
│ │ ├── StyleLeakDetector.ts
│ │ ├── Types.ts
│ │ ├── assert.ts
│ │ ├── lodashMini.ts
│ │ └── utils/
│ │ ├── AutoFocusHelper.ts
│ │ ├── EventHelpers.ts
│ │ ├── FocusManager.ts
│ │ ├── PromiseDefer.ts
│ │ └── Timers.ts
│ ├── ios/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityUtil.ts
│ │ ├── GestureView.tsx
│ │ ├── Linking.ts
│ │ ├── ReactXP.ts
│ │ └── StatusBar.ts
│ ├── macos/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityUtil.ts
│ │ ├── GestureView.tsx
│ │ ├── Input.ts
│ │ ├── Linking.ts
│ │ ├── ReactXP.ts
│ │ ├── StatusBar.ts
│ │ └── View.tsx
│ ├── native-common/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityUtil.ts
│ │ ├── ActivityIndicator.tsx
│ │ ├── Alert.ts
│ │ ├── Animated.tsx
│ │ ├── App.ts
│ │ ├── Button.tsx
│ │ ├── Clipboard.ts
│ │ ├── FrontLayerViewManager.tsx
│ │ ├── GestureView.tsx
│ │ ├── Image.tsx
│ │ ├── Input.ts
│ │ ├── International.ts
│ │ ├── Link.tsx
│ │ ├── Linking.ts
│ │ ├── MainViewStore.ts
│ │ ├── Modal.ts
│ │ ├── ModalContainer.tsx
│ │ ├── Picker.tsx
│ │ ├── Platform.ts
│ │ ├── Popup.ts
│ │ ├── PopupContainerView.tsx
│ │ ├── RootView.tsx
│ │ ├── ScrollView.tsx
│ │ ├── Storage.ts
│ │ ├── StyleLeakDetector.ts
│ │ ├── Styles.ts
│ │ ├── Text.tsx
│ │ ├── TextInput.tsx
│ │ ├── UserInterface.tsx
│ │ ├── UserPresence.ts
│ │ ├── View.tsx
│ │ ├── ViewBase.tsx
│ │ └── utils/
│ │ ├── EventHelpers.ts
│ │ └── lodashMini.ts
│ ├── native-desktop/
│ │ ├── App.ts
│ │ ├── Input.ts
│ │ ├── RootView.tsx
│ │ ├── ScrollView.tsx
│ │ └── utils/
│ │ └── FocusManager.ts
│ ├── tslint/
│ │ ├── groupedImportRule.ts
│ │ ├── incorrectThisPropsRule.ts
│ │ └── noUnreferencedStylesRule.ts
│ ├── typings/
│ │ ├── prop-types.d.ts
│ │ ├── react-native-extensions.d.ts
│ │ ├── react-native-windows.d.ts
│ │ ├── rebound.d.ts
│ │ └── window.d.ts
│ ├── web/
│ │ ├── Accessibility.ts
│ │ ├── AccessibilityAnnouncer.tsx
│ │ ├── AccessibilityUtil.ts
│ │ ├── ActivityIndicator.tsx
│ │ ├── Alert.tsx
│ │ ├── AlertModalContent.tsx
│ │ ├── Animated.tsx
│ │ ├── App.ts
│ │ ├── Button.tsx
│ │ ├── Clipboard.ts
│ │ ├── CustomScrollbar.ts
│ │ ├── FrontLayerViewManager.tsx
│ │ ├── GestureView.tsx
│ │ ├── Image.tsx
│ │ ├── Input.ts
│ │ ├── International.ts
│ │ ├── Link.tsx
│ │ ├── Linking.ts
│ │ ├── Modal.ts
│ │ ├── ModalContainer.tsx
│ │ ├── Picker.tsx
│ │ ├── Platform.ts
│ │ ├── Popup.ts
│ │ ├── PopupContainerView.tsx
│ │ ├── ReactXP.ts
│ │ ├── RootView.tsx
│ │ ├── ScrollView.tsx
│ │ ├── ScrollViewConfig.ts
│ │ ├── StatusBar.tsx
│ │ ├── Storage.ts
│ │ ├── Styles.ts
│ │ ├── Text.tsx
│ │ ├── TextInput.tsx
│ │ ├── UserInterface.ts
│ │ ├── UserPresence.ts
│ │ ├── View.tsx
│ │ ├── ViewBase.tsx
│ │ ├── animated/
│ │ │ └── executeTransition.ts
│ │ ├── listAnimations/
│ │ │ ├── AnimateListEdits.tsx
│ │ │ └── MonitorListEdits.tsx
│ │ ├── utils/
│ │ │ ├── AppVisibilityUtils.ts
│ │ │ ├── FocusManager.ts
│ │ │ ├── MouseResponder.ts
│ │ │ ├── lodashMini.ts
│ │ │ └── restyleForInlineText.tsx
│ │ └── window.ts
│ └── windows/
│ ├── Accessibility.ts
│ ├── AccessibilityAnnouncer.tsx
│ ├── AccessibilityUtil.ts
│ ├── App.ts
│ ├── Button.tsx
│ ├── GestureView.tsx
│ ├── Link.tsx
│ ├── ReactXP.ts
│ ├── RootView.tsx
│ ├── StatusBar.ts
│ ├── Text.tsx
│ ├── TextInput.tsx
│ └── View.tsx
└── tsconfig.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .eslintrc.json
================================================
{
"parserOptions": {
"project": "./tsconfig.json"
},
"extends": ["skype", "skype/react"],
"rules": {
"no-console": [
"error",
{
"allow": [
"error",
"warn",
"log"
]
}
],
"camelcase": "off",
"@typescript-eslint/camelcase": [
"error",
{
"allow": [
"^reactxp_",
"^mixin_",
"^UNSAFE_",
"^Radio_button_" /* Android properties only */
]
}
],
"@typescript-eslint/no-parameter-properties": "off"
},
"overrides": [
{
"files": [
"*.tsx"
],
"rules": {
"@typescript-eslint/explicit-function-return-type": "off"
}
},
{
"files": [
"ReactXP.ts",
"ModuleInterface.ts"
],
"rules": {
"no-self-assign": "off",
"prefer-const": "off",
"@typescript-eslint/no-namespace": "off",
"@typescript-eslint/no-unused-vars": "off",
"@typescript-eslint/prefer-namespace-keyword": "off"
}
},
{
"files": [
"Easing.ts"
],
"rules": {
"@typescript-eslint/member-naming": [
"error",
{
"public": "^[A-Z]\\w+$"
}
]
}
},
{
"files": [
"*.d.ts"
],
"rules": {
"@typescript-eslint/prefer-namespace-keyword": "off",
"@typescript-eslint/no-unused-vars": "off"
}
},
{
"files": [
"*/web/Animated.tsx",
"*/native-desktop/RootView.tsx"
],
"rules": {
"@typescript-eslint/member-naming": "off"
}
}
]
}
================================================
FILE: .gitignore
================================================
# Logs
logs
*.log
npm-debug.log*
# Runtime data
pids
*.pid
*.seed
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules
/samples/*/node_modules
# Optional npm cache directory
.npm
# Optional REPL history
.node_repl_history
# Build artifacts
/src/.vs
/src/bin
/src/obj
/dist
# Miscellaneous user files
*.user
.vscode
.DS_STORE
.idea/*
.vs
================================================
FILE: .npmignore
================================================
/node_modules
/src/.vs
/src/bin
/src/obj
/samples
/extensions
/docs
*.user
.eslintrc
================================================
FILE: .npmrc
================================================
================================================
FILE: .travis.yml
================================================
language: node_js
node_js:
- "node"
dist: trusty
sudo: false
addons:
chrome: stable
install:
- node --version
- npm --version
- npm i
script:
- npm run lint
- npm run build
cache:
directories:
- node_modules
================================================
FILE: CONTRIBUTING.md
================================================
# Contributing to ReactXP
We welcome contributions to ReactXP! This gude provides some tips for a successful contributions.
For complex changes, we recommend filing a GitHub issue to start a discussion with project maintainers before implementing the change.
## Pull Requests
Please make sure the following is done when submitting a pull request:
1. Fork the repo and create your branch from `master`.
2. If you've added code that should be tested, add test code to the RXPTest sample app.
3. If you've changed APIs, update the documentation files.
4. Ensure the test suite passes.
5. If you haven't already, complete the Contributor License Agreement ("CLA").
## Testing Your Change
To test your change:
1. Rebuild reactxp: `npm i` and `npm run build`
2. Switch to the RXPTest sample directory: `cd ./samples/RXPTest`
3. Update dependencies: `npm i`
4. Copy the locally-built reactxp library: `cp -r ../../dist/* ./node_modules/reactxp/dist`
5. Rebuild the test app: `npm run web-watch` or `npm run rn-watch`
6. If testing the web version:
- for desktop: open the test in the browser: `open ./index.html` and run the test
- for mobile: run `npm run web -- -host YOUR_LOCAL_IP` then on your mobile enter `http://YOUR_LOCAL_IP:8080`
7. If testing one or more RN versions, open the corresponding native project and build and run the test
## Contributor License Agreement ("CLA")
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
You must sign a Contribution License Agreement (CLA) before your PR will be merged. This is a one-time requirement for Microsoft projects in GitHub. You can read more about [Contribution License Agreements (CLA)](https://en.wikipedia.org/wiki/Contributor_License_Agreement) on Wikipedia. You can sign the Microsoft Contribution License Agreement by visiting https://cla.microsoft.com/. Use your GitHub account to login.
## Issues
We use GitHub issues to track bugs.
## Coding Style
ReactXP is written in TypeScript and uses tslint to help enforce an internally-consistent coding style. Contributions should be consistent with this style.
================================================
FILE: LICENSE
================================================
ReactXP
Copyright (c) Microsoft Corporation
All rights reserved.
MIT License
Permission is hereby granted, free of charge, to any person obtaining a copy of this
software and associated documentation files (the Software), to deal in the Software
without restriction, including without limitation the rights to use, copy, modify, merge,
publish, distribute, sublicense, and/or sell copies of the Software, and to permit
persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies
or substantial portions of the Software.
THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR
PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE
FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
DEALINGS IN THE SOFTWARE.
================================================
FILE: README.md
================================================
# ReactXP
[](https://github.com/Microsoft/reactxp/blob/master/LICENSE) [](https://www.npmjs.com/package/reactxp) [](https://dev.azure.com/ms/reactxp/_build/latest?definitionId=16) [](https://travis-ci.org/Microsoft/reactxp) [](https://www.npmjs.com/package/reactxp) [](https://github.com/Microsoft/reactxp#contributing) [](https://gitter.im/msreactxp/Lobby)
ReactXP is a library for cross-platform app development using React and React Native.
## ReactXP End of Life
The ReactXP library is no longer being maintained and is is considered “end of life”. We recommend alternatives such as [React Native for Web](https://necolas.github.io/react-native-web/docs/). The ReactXP github project will be put into “archive” mode and will remain available in read-only form for the benefit of those who are still using it within older projects, but no new versions will be published.
## Why ReactXP
With React and React Native, your web app can share most of its logic with your iOS and Android apps, but the view layer needs to be implemented separately for each platform. We have taken this a step further and developed a thin cross-platform layer we call ReactXP. If you write your app to this abstraction, you can share your view definitions, styles and animations across multiple target platforms. Of course, you can still provide platform-specific UI variants, but this can be done selectively where desired.
## Getting Started
The [samples](/samples) directory contains a minimal “Hello World” app that demonstrates some basic ReactXP functionality. You can use this as a starting point. Just follow the build instructions in the README file.
Also included in the samples directory is the [RXPTest app](/samples/RXPTest) which attempts to exercise all of the functionality of ReactXP. It is a good source to consult for sample usage of APIs, components, and props.
You can read more about ReactXP and its APIs from the [ReactXP official Documentation](https://microsoft.github.io/reactxp/docs/getting-started.html).
Use the command-line tool called [create-rx-app](https://github.com/a-tarasyuk/create-rx-app) to create a starter project.
```sh
npm install create-rx-app -g
create-rx-app AppName
```
or
```sh
npx create-rx-app AppName
```
By default the project will be created in TypeScript. However if you prefer JavaScript instead, add `--javascript` when creating the project.
This will create a directory called **AppName** inside the current working directory. Inside **AppName**, this will generate the initial project structure and install all of its dependencies. Once this installation is done, there are some commands you can run in the project directory:
- `npm run start:web` - runs the Web version of the app in the development mode
- `npm run build:web` - builds the Web version of the app for production to the **dist-web** folder
- `npm run start:ios` - runs the iOS version of the app and attempts to open in the iOS Simulator if you're on a Mac and have it installed
- `npm run start:android` - runs the Android version of the app and attempts to open your app on a connected Android device or emulator
- `npm run start:windows` - runs the Windows version of the app
- `npm start:rn-dev-server` - runs react native (RN) development server
### Prerequisites
* [Node.Js](https://nodejs.org/) ([Setup Instructions](https://nodejs.org/en/download/package-manager/))
* [React Native](https://facebook.github.io/react-native/) ([Setup Instructions](https://facebook.github.io/react-native/docs/getting-started))
## ESLint rules
> [TSLint will be deprecated some time in 2019](https://github.com/palantir/tslint)
If you plan to migrate your projects from TSLint to ESlint and want to continue using the [_rules_](https://github.com/microsoft/reactxp/tree/master/src/tslint) to automate search common problems in *ReactXP* usage, you can use [eslint-plugin-reactxp](https://github.com/a-tarasyuk/eslint-plugin-reactxp).
## Contributing
We welcome contributions to ReactXP. See the [CONTRIBUTING](./CONTRIBUTING.md) file for how to help out.
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details
================================================
FILE: README_Hindi.md
================================================
# ReactXP
[](https://github.com/Microsoft/reactxp/blob/master/LICENSE) [](https://www.npmjs.com/package/reactxp) [](https://travis-ci.org/Microsoft/reactxp) [](https://www.npmjs.com/package/reactxp) [](https://github.com/Microsoft/reactxp#contributing) [](https://gitter.im/msreactxp/Lobby)
ReactXP एक क्रॉस-प्लॅटफॉर्म ऍप डेवलपमेंट लाइब्रेरी है जिसमे React और React Native का उपयोग किया जाता है.
##ReactXP क्यों ?
React और React Native के साथ आपका वेब ऍप, iOS और Android ऍप के साथ ज्यादातर तार्किक शेयर कर सकता है, लेकिन view layer आपको अलग से इम्प्लीमेंट करना होगा हर एक प्लॅटफॉर्म के लिए. हमने एक कदम आगे लेकर एक हल्का क्रॉस-प्लॅटफॉर्म लेयर विकसित किया है जिसे हम ReactXP बुलाते है. अगर आप आपके ऍप को इस abstraction के हिसाब से लिखते है फिर आप आपके view definitions, styles और animations को शेयर कर सकते है मल्टिपल टारगेट प्लेटफॉर्म्स पर. आप प्लेटफार्म स्पेसिफिक UI variants भी प्रदान कर सकते है जैसे आप चुनेंगे जब आपकी मर्ज़ी हो|
## शुरुआत
दिए हुए [samples](/samples) directory में आपको एक आसान सा “Hello World” ऍप मिलेगा जिसमे ReactXP के बुनियादी कार्यक्षमता दिखाई गई है. आप उससे स्टार्टिंग पॉइंट की तरह प्रयोग कर सकते है. दिए हुए README के सूचनाओं का पालन कर सकते है.
samples directory[RXPTest app](/samples/RXPTest) में RXPTest ऍप भी दिया गया है जो ReactXP के सारे कार्यक्षमताओं का उपयोग करने का प्रयास करता है.
ये एक अछि सोर्स है APIs, components और props का उपयोग जान्ने के लिए.
आप ReactXP और उसके APIs के बारे में और पड़ सकते है इस वेबसाइट पर [ReactXP official Documentation](https://microsoft.github.io/reactxp/docs/getting-started.html).
[create-rx-app](https://github.com/a-tarasyuk/create-rx-app) नाम के कमांड-लाइन टूल का उपयोग करके स्टार्टर प्रोजेक्ट बनाइये.
```sh
npm install create-rx-app -g
create-rx-app AppName
```
अथवा
```sh
npx create-rx-app AppName
```
शुरुवात में प्रोजेक्ट TypeScript में उपलब्ध किया जाता hai. लेकिन अगर आपको JavaScript में करना हो तोह प्रोजेक्ट बनाते समय फिर `--javascript` का उपयोग करें.
ये **AppName** नाम का डायरेक्टरी बनाएगा वर्किंग डायरेक्टरी में. **AppName** के अंदर शुरुवाती प्रोजेक्ट का आकार बना हुआ रहेगा और सारे dependencies इनस्टॉल किये हुए रहेंगे. इंस्टालेशन ख़तम होने के बाद निचे दिए हुए कुछ commands आप रन कर सकते है प्रोजेक्ट डायरेक्टरी में :
- `npm run start:web` - ऍप के Web version को development mode में run करने के लिए
- `npm run build:web` - ऍप के Web version को बनता है production के लिए **dist-web** फोल्डर में
- `npm run start:ios` - ऍप के iOS version को run करके iOS Simulator में खोलके की कोशिश करता है अगर आप Mac इस्तेमाल कर रहे हो और उसमे इनस्टॉल किया हुआ हो
- `npm run start:android` - ऍप के Android version को run करके आपके ऍप को connected Android device या फिर emulator पर खोलने के कोशिश करता है
- `npm run start:windows` - ऍप के Windows version को run करता है
- `npm start:rn-dev-server` - React native (RN) development server run करता है
### Prerequisites
* [Node.Js](https://nodejs.org/) ([Setup Instructions](https://nodejs.org/en/download/package-manager/))
* [React Native](https://facebook.github.io/react-native/) ([Setup Instructions](https://facebook.github.io/react-native/docs/getting-started))
## Contributing
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
You must sign a Contribution License Agreement (CLA) before your PR will be merged. This is a one-time requirement for Microsoft projects in GitHub. You can read more about [Contribution License Agreements (CLA)](https://en.wikipedia.org/wiki/Contributor_License_Agreement) on Wikipedia. You can sign the Microsoft Contribution License Agreement by visiting https://cla.microsoft.com/. Use your GitHub account to login.
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details
================================================
FILE: SECURITY.md
================================================
<!-- BEGIN MICROSOFT SECURITY.MD V0.0.8 BLOCK -->
## Security
Microsoft takes the security of our software products and services seriously, which includes all source code repositories managed through our GitHub organizations, which include [Microsoft](https://github.com/microsoft), [Azure](https://github.com/Azure), [DotNet](https://github.com/dotnet), [AspNet](https://github.com/aspnet), [Xamarin](https://github.com/xamarin), and [our GitHub organizations](https://opensource.microsoft.com/).
If you believe you have found a security vulnerability in any Microsoft-owned repository that meets [Microsoft's definition of a security vulnerability](https://aka.ms/opensource/security/definition), please report it to us as described below.
## Reporting Security Issues
**Please do not report security vulnerabilities through public GitHub issues.**
Instead, please report them to the Microsoft Security Response Center (MSRC) at [https://msrc.microsoft.com/create-report](https://aka.ms/opensource/security/create-report).
If you prefer to submit without logging in, send email to [secure@microsoft.com](mailto:secure@microsoft.com). If possible, encrypt your message with our PGP key; please download it from the [Microsoft Security Response Center PGP Key page](https://aka.ms/opensource/security/pgpkey).
You should receive a response within 24 hours. If for some reason you do not, please follow up via email to ensure we received your original message. Additional information can be found at [microsoft.com/msrc](https://aka.ms/opensource/security/msrc).
Please include the requested information listed below (as much as you can provide) to help us better understand the nature and scope of the possible issue:
* Type of issue (e.g. buffer overflow, SQL injection, cross-site scripting, etc.)
* Full paths of source file(s) related to the manifestation of the issue
* The location of the affected source code (tag/branch/commit or direct URL)
* Any special configuration required to reproduce the issue
* Step-by-step instructions to reproduce the issue
* Proof-of-concept or exploit code (if possible)
* Impact of the issue, including how an attacker might exploit the issue
This information will help us triage your report more quickly.
If you are reporting for a bug bounty, more complete reports can contribute to a higher bounty award. Please visit our [Microsoft Bug Bounty Program](https://aka.ms/opensource/security/bounty) page for more details about our active programs.
## Preferred Languages
We prefer all communications to be in English.
## Policy
Microsoft follows the principle of [Coordinated Vulnerability Disclosure](https://aka.ms/opensource/security/cvd).
<!-- END MICROSOFT SECURITY.MD BLOCK -->
================================================
FILE: azure-pipelines.yml
================================================
# Node.js
# Build a general Node.js project with npm.
# Add steps that analyze code, save build artifacts, deploy, and more:
# https://docs.microsoft.com/azure/devops/pipelines/languages/javascript
pool:
vmImage: 'Ubuntu 16.04'
steps:
- task: NodeTool@0
inputs:
versionSpec: '8.x'
displayName: 'Install Node.js'
- script: |
npm ci
npm run lint
npm run build
displayName: 'npm install and build'
================================================
FILE: docs/Gemfile
================================================
source 'https://rubygems.org'
# jekyll, which builds it all
# 3.0 includes sass processing
gem 'jekyll', '~>3.1'
# Jekyll extensions
gem 'jekyll-redirect-from'
gem 'jekyll-paginate'
================================================
FILE: docs/_config.yml
================================================
theme: jekyll-theme-slate
name: ReactXP
description: A library for building cross-platform apps
url: https://microsoft.github.io
baseurl: /reactxp
permalink: /blog/:year/:month/:day/:title.html
paginate_path: /blog/page:num/
paginate: 5
timezone: America/Los_Angeles
defaults:
- scope:
path: blog
type: pages
values:
layout: post
sectionid: blog
- scope:
path: docs
type: pages
values:
layout: docs
sectionid: docs
- scope:
path: community
type: pages
values:
layout: default
sectionid: community
- scope:
path: versions
type: pages
values:
layout: default
sectionid: versions
exclude:
- Gemfile
- README.md
sass:
sass_dir: ./_sass
gems:
- jekyll-redirect-from
- jekyll-paginate
================================================
FILE: docs/_data/authors.yml
================================================
# Map of short name to more information. `name` will be used but if you don't
# want to use your real name, just use whatever. If url is included, your name
# will be a link to the provided url.
erictraut:
name: Eric Traut
url: https://github.com/erictraut
================================================
FILE: docs/_data/nav_docs.yml
================================================
- title: Quick Start
items:
- id: getting-started
title: Getting Started
- id: using-reactxp
title: Using ReactXP
- id: faq
title: FAQ
- id: react_concepts
title: React Concepts
- id: react_lifecycle
title: Component Lifecycle
- id: react_stores
title: Stores & Services
- id: styles
title: Styles
- id: animations
title: Animations
- id: accessibility
title: Accessibility
- id: extensions
title: Extensions
- title: Components
items:
- id: components/activityindicator
title: ActivityIndicator
- id: components/button
title: Button
- id: components/gestureview
title: GestureView
- id: components/image
title: Image
- id: components/link
title: Link
- id: components/picker
title: Picker
- id: components/scrollview
title: ScrollView
- id: components/text
title: Text
- id: components/textinput
title: TextInput
- id: components/view
title: View
- id: components/webview
title: WebView
- title: APIs
items:
- id: apis/accessibility
title: Accessibility
- id: apis/alert
title: Alert
- id: apis/app
title: App
- id: apis/clipboard
title: Clipboard
- id: apis/input
title: Input
- id: apis/international
title: International
- id: apis/linking
title: Linking
- id: apis/location
title: Location
- id: apis/modal
title: Modal
- id: apis/network
title: Network
- id: apis/platform
title: Platform
- id: apis/popup
title: Popup
- id: apis/statusbar
title: StatusBar
- id: apis/storage
title: Storage
- id: apis/userinterface
title: UserInterface
- id: apis/userpresence
title: UserPresence
- title: Extensions
items:
- id: extensions/database
title: Database
- id: extensions/imagesvg
title: ImageSvg
- id: extensions/navigator
title: Navigator
- id: extensions/netinfo
title: NetInfo
- id: extensions/restclient
title: REST Client
- id: extensions/video
title: Video
- id: extensions/virtuallistview
title: VirtualListView
- id: extensions/webview
title: WebView
================================================
FILE: docs/_includes/blog_post.html
================================================
{% assign page = include.page %}
<h1>
{% if include.isPermalink %}
{{ page.title }}
{% else %}
<a href="/reactxp{{ page.url }}">{{ page.title }}</a>
{% endif %}
</h1>
<p class="meta">
{{ page.date | date: "%B %e, %Y" }}
by
<a href="{{ site.data.authors[page.author].url }}">{{ site.data.authors[page.author].name }}</a>
</p>
<hr>
<div class="post">
{{ include.content }}
</div>
================================================
FILE: docs/_includes/footer.html
================================================
<footer class="nav-footer">
<section class="sitemap">
<a href="/reactxp/" class="nav-home">
</a>
<div>
<a href="/reactxp/docs/">Docs</a>
<a href="/reactxp/blog/">Blog</a>
<a href="/reactxp/community/">Community</a>
</div>
<div>
<a href="https://github.com/microsoft/reactxp" target="_blank">GitHub</a>
<a href="http://facebook.github.io/react/" target="_blank">React</a>
<a href="http://facebook.github.io/react-native/" target="_blank">React Native</a>
</div>
</section>
<section class="copyright">
Copyright © {{ site.time | date: '%Y' }} Microsoft Corp.
</section>
</footer>
================================================
FILE: docs/_includes/hero.html
================================================
<div class="hero">
<div class="wrap">
<div class="text"><strong>ReactXP</strong></div>
<div class="minitext">
A library for building cross-platform apps
</div>
<div class="buttons-unit">
<a href="/reactxp/docs/getting-started.html" class="button">Get Started</a>
</div>
</div>
</div>
================================================
FILE: docs/_includes/nav_blog.html
================================================
<div class="nav-docs nav-blog">
<div class="nav-docs-section">
<h3>Recent posts</h3>
<ul>
{% for post in site.posts limit:10 %}
<li><a href="/reactxp{{ post.url }}"{% if page.title == post.title %} class="active"{% endif %}>{{ post.title }}</a></li>
{% endfor %}
<li><a href="/reactxp/blog/all.html">All posts ...</a></li>
</ul>
</div>
</div>
================================================
FILE: docs/_includes/nav_docs.html
================================================
<div class="nav-docs">
<!-- Docs Nav -->
{% for section in site.data.nav_docs %}
<div class="nav-docs-section">
<h3>{{ section.title }}</h3>
<ul>
{% for item in section.items %}
<li>
<a href="/reactxp/docs/{{ item.id }}.html" {% if page.id == item.id %} class="active"{% endif %}>
{{ item.title }}
</a>
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
================================================
FILE: docs/_includes/navigation.html
================================================
<div class="nav-main">
<div class="wrap">
<a class="nav-home" href="/reactxp/">
ReactXP
</a>
<div class="nav-lists">
<ul class="nav-site nav-site-internal">
<li><a href="/reactxp/docs/getting-started.html"{% if page.sectionid == 'docs' %} class="active"{% endif %}>Docs</a></li>
<li><a href="/reactxp/community/support.html"{% if page.sectionid == 'community' %} class="active"{% endif %}>Community</a></li>
<li><a href="/reactxp/versions/version_history.html"{% if page.sectionid == 'versions' %} class="active"{% endif %}>Versions</a></li>
<li><a href="/reactxp/blog/"{% if page.sectionid == 'blog' %} class="active"{% endif %}>Blog</a></li>
</ul>
<ul class="nav-site nav-site-external">
<li><a href="https://github.com/microsoft/reactxp">GitHub</a></li>
</ul>
</div>
</div>
</div>
================================================
FILE: docs/_layouts/default.html
================================================
{% if page.excerpt %}
{% assign type = 'article' %}
{% assign sectionTitle = 'ReactXP Blog' %}
{% assign description = page.excerpt | strip_html %}
{% else %}
{% assign type = 'website' %}
{% assign sectionTitle = 'ReactXP' %}
{% assign description = 'A library for cross-platform development' %}
{% endif %}
{% assign title = page.title | append: ' - ' | append: sectionTitle %}
<!DOCTYPE html>
<!--[if IE]><![endif]-->
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>{{ title }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="{{ title }}">
<meta property="og:type" content="{{ type }}">
<meta property="og:url" content="https://microsoft.github.io/reactxp{{ page.url }}">
<meta property="og:image" content="https://microsoft.github.io/reactxp/img/logo_og.png">
<meta property="og:description" content="{{ description }}">
<link rel="stylesheet" href="/reactxp/css/syntax.css">
<link rel="stylesheet" href="/reactxp/css/reactxp.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script>
</head>
<body>
<div class="container">
{% include navigation.html %}
{{ content }}
{% include footer.html %}
</div>
</body>
</html>
================================================
FILE: docs/_layouts/docs.html
================================================
---
layout: default
sectionid: docs
---
<section class="content wrap documentationContent">
<div class="inner-content">
<h1>
{{ page.title }}
</h1>
<div class="subHeader">{{ page.description }}</div>
{{ content }}
<div class="docs-prevnext">
{% if page.prev %}
<a class="docs-prev" href="/reactxp/docs/{{ page.prev }}">← Prev</a>
{% endif %}
{% if page.next %}
<a class="docs-next" href="/reactxp/docs/{{ page.next }}">Next →</a>
{% endif %}
</div>
</div>
{% include nav_docs.html %}
</section>
================================================
FILE: docs/_layouts/hero.html
================================================
---
layout: default
---
{% if page.id == 'home' %}
{% include hero.html %}
{% endif %}
<section class="content wrap">
{{ content }}
</section>
================================================
FILE: docs/_layouts/post.html
================================================
---
layout: default
sectionid: blog
---
<section class="content wrap blogContent">
<div class="inner-content">
{% include blog_post.html isPermalink="true" page=page content=content %}
</div>
{% include nav_blog.html %}
</section>
================================================
FILE: docs/_plugins/sass.rb
================================================
module Jekyll
require 'sass'
class SassConverter < Converter
safe true
priority :low
def matches(ext)
ext =~ /scss/i
end
def output_ext(ext)
".css"
end
def convert(content)
engine = Sass::Engine.new(content, :syntax => :scss, :load_paths => ["#{@config['source']}/_sass/"])
engine.render
rescue StandardError => e
puts "!!! SASS Error: " + e.message
end
end
end
================================================
FILE: docs/_posts/2017-04-06-introducing-reactxp.md
================================================
---
title: Introducing ReactXP
author: erictraut
---
The Skype team at Microsoft are happy to announce that we are open sourcing ReactXP, a library that we developed for cross-platform development. It builds upon React JS and React Native, allowing you to create apps that span both web and native with a single code base.
### History of ReactXP
Skype runs on many platforms --- desktops, laptops, mobile phones, tablets, browsers, and even TVs and cars. Historically, the UI for each Skype client was written from scratch in the "native" language of each platform (Objective C on iOS, Java on Android, HTML and javascript on the web, etc.). About a year ago, we embarked on an effort to reinvent Skype. We decided that we needed to take a fresh approach to client development - one that would maximize our engineering efficiency and agility. We wanted to move away from implementing each new feature multiple times in different code bases. We wanted to minimize duplication of effort. We explored a number of available options. Web wrappers like Cordova (PhoneGap) didn't provide the performance or "native feel" we were looking for. Xamarin, which is a great solution for cross-platform mobile development, didn't help us on the web. We ultimately decided to build our new client on top of React JS and React Native. ReactXP was our attempt to unify the behaviors and interfaces across React JS and the various React Native implementations. (We initially referred to it as ReactX, hence the references to this term within the sources.)
The Skype team also made many contributions to the React Native code base to fix bugs, improve performance, and eliminate behavioral differences between React JS and React Native. The biggest contribution was a major rework of the React Native layout engine. The original implementation loosely followed the W3C flexbox standard, but it differed from the standard in some important ways. The updated layout engine now reliably produces the same layout as all compliant web browsers.
### ReactXP Design Philosophy
ReactXP was designed to be a thin, lightweight cross-platform abstraction layer on top of React and React Native. It implements a dozen or so foundational components that can be used to build more complex components. It also implements a collection of API namespaces that are required by most applications.
ReactXP currently supports the following platforms: web (React JS), iOS (React Native), Android (React Native) and Windows UWP (React Native). Windows UWP is still a work in progress, and some components and APIs are not yet complete.
The ReactXP "core" contains only general-purpose functionality. More specialized cross-platform functionality can be delivered in the form of ReactXP extensions. The Skype team has developed about twenty such extensions, and we plan to open source some of these over time. Extensions allow us to expand ReactXP without increasing its footprint or complexity.
When we were deciding which props and style attributes to expose in ReactXP, we tried to stick with those that could be implemented uniformly on all supported platforms. For example, we don't expose any HTML-specific props or CSS-specific attributes that are not also supported in React Native. In a few cases, we decided to expose select platform-specific props or style attributes and documented them as being "no ops" on other platforms, but this was done only when we could find no other viable workaround.
### Future of ReactXP
The Skype team will continue to maintain and build upon ReactXP. Other teams within Microsoft are also starting to use it and make contributions. Today we are opening it to the broader open source community. We hope that others will find it useful, and we welcome feedback and contributions.
We plan to snap a new version of ReactXP approximately monthly, roughly aligned to React Native releases.
================================================
FILE: docs/_posts/2017-04-27-building-skype-on-reactxp.md
================================================
---
title: Building Skype on ReactXP
author: erictraut
---
ReactXP was developed by the Skype team at Microsoft as a way to improve development agility and efficiency. In this article, I'll talk more about the architecture of the new Skype app.
<center><img src="/reactxp/img/blog/skype-app-architecture.png" width="739" height="391" alt="Skype application architecture" /></center>
### Implementing Stores with ReSub
We initially tried using [Flux](https://facebook.github.io/react/blog/2014/05/06/flux.html), an architectural pattern created by Facebook engineers. We liked some of its properties, but we found it cumbersome because it required us to implement a bunch of helper classes (dispatcher, actions, action creators). State management also became hard to manage within our more complex components. For these reasons, we developed a new mechanism that we call [ReSub](https://github.com/Microsoft/ReSub), short for "React Subscriptions". ReSub provides coarse-grained data binding between components and stores, and it automates the process of subscribing and unsubscribing. More details and sample code can be found on the ReSub github site.
Some stores within the app are singleton objects and are allocated --- and perhaps even populated --- at startup time. Others are allocated on demand and have a well-defined lifetime that corresponds to a user interaction or mode.
### Caching Data Locally
Stores are responsible for maintaining in-memory data representations. We also had the need to persist data in a structured manner. Storing data locally allows the app to run in "offline" mode. It also allows for fast startup, since we don't need to wait for data to download over the network.
For local storage, we developed a [cross-platform no-SQL database abstraction](https://github.com/Microsoft/NoSQLProvider). It uses the native database implementation for each platform (sqlite for iOS, indexDB for some browsers, etc.). The abstraction allows us to create and query multiple tables. Each table can have multiple indexes, including composite (multi-key) indexes. It also supports transactions and string indexing for full text searches.
### Services & Startup Management
Background tasks, such as fetching new messages, are handled by modules we refer to as "Services". These are singleton objects that are instantiated at app startup time. Some services are responsible for updating stores and saving information to the local database. Others are responsible for listening to one or more other stores and synthesizing information from those stores (e.g. notifications that are generated for incoming messages that require the user's immediate attention).
In some cases, a service was so tightly bound to the operation of a particular store that we merged their functionality into a single module. For example, we created a ConfigurationStore to track app-level configuration settings (e.g. which features are enabled for a particular user). We could have implemented a corresponding ConfigurationService that fetches configuration updates, but we opted to implement this functionality within the ConfigurationStore out of pragmatism.
At startup time, the app needs to instantiate all of its singleton stores and services, some of which have dependencies on others. To facilitate this startup process, we created a startup manager. Each store or service that wants to be started must implement an interface called "IStartupable", which includes a "startup" method that returns a promise. Modules register themselves with the startup manager and specify which other modules (if any) they depend upon. This allows the startup manager to run startup routines in parallel. Once a startup promise is resolved, it unblocks the startup of any dependent modules. This continues until all registered modules have been started.
Here is a startup routine that populates its store with data from the database. Note that the startup routine returns a promise, which isn't resolved until after the async database access is completed.
``` javascript
startup(): SyncTasks.Promise<void> {
return ClientDatabase.getRecentConversations().then(conversations => {
this._conversations = conversations;
});
}
```
### Communicating with the REST of the World
Skype is built upon over a dozen different micro-services that run on Azure. For example, one micro-service handles message delivery, another handles the storage and retrieval of photos and videos, and yet another provides dynamic updates of emoticon packs. Each micro-service exposes its functionality through a simple REST API. For each service, we implement a REST Client that exposes the API to the rest of the app. Each REST Client is a subclass of the [Simple REST Client](/reactxp/docs/extensions/restclient.html), which handles retry logic, authentication, and setting of HTTP header values.
### Responsive Behavior
The Skype app runs on a wide variety of devices from phones to desktop PCs with large screens. It is able to adapt to screen size (and orientation) changes at runtime. This is mostly the responsibility of components at the upper layers of the view hierarchy, which change their behavior based on the available screen width. They subscribe to a store that we call "ResponsiveWidthStore". Despite its name, this store also tracks the screen (or window) height and the device orientation (landscape vs portrait).
As is common with most responsive websites, we defined several "break point" widths. In our case, we chose three such break points, meaning that our app works in one of four different responsive "modes".
<center><img src="/reactxp/img/blog/responsive-navigation.png" width="714" height="260" alt="Responsive breakpoints" /></center>
In the narrowest mode, the app uses a "stack navigation" mode, where UI panels are stacked one on top of another. This is a typical navigation pattern for phones. For wider modes, the app uses a "composite navigation" mode, where panels are positioned beside each other, allowing for better use of the expanded screen real estate.
### Navigation
The app coordinates navigation changes through the use of a NavigationStateStore. Components can subscribe to this store to determine whether the app is currently in "stack navigation" or "composite navigation" mode. When in stack navigation mode, this store records the contents of the stack. When in composite navigation mode, it records which panels and sub-panels are currently displayed (and in some cases, which mode they are in). This is tracked through a NavigationContext object. The parts of the view hierarchy that respond to navigation changes each have a corresponding NavigationContext. Some context have references to other child contexts, reflecting the hierarchical nature of the UI. When the user performs an action that results in a navigation change, the NavigationAction module is responsible for updating the NavigationContext and writing it back to the NavigationStateStore. This, in turn, causes the UI to update.
Here is some code that demonstrates the typical flow. We start with an event handler within a button.
``` javascript
private _onClickConversationButton() {
// Navigate to the conversation.
NavigationActions.navigateToConversation(this.props.conversationId);
}
```
The NavigationActions module then updates the current navigation context. It needs to handle both the stack and composite cases.
``` javascript
navigateToConversation(conversationId: string) {
let convContext = this.createConversationNavContext(conversationId);
if (NavigationStateStore.isUsingStackNav()) {
NavigationStateStore.pushNewStackContext(convContext);
} else {
NavigationStateStore.updateRightPanel(convContext);
}
}
```
This causes the NavigationStateStore to update its internal state and trigger a change, which notifies any subscribers.
``` javascript
pushNewStackContext(context: NavigationContext) {
this._navStack.push(context);
// Tell subscribers that the nav context changed.
this.trigger();
}
```
The primary subscriber to the NavigationStateStore is a component called RootNavigationView. It is responsible for rendering either a RootStackNavigationView or RootCompositeNavigationView.
``` javascript
protected _buildState(/* params omitted */): RootNavigationViewState {
return {
isStackNav: NavigationStateStore.isUsingStackNav(),
compositeNavContext: NavigationStateStore.getCompositeNavContext(),
stackNavContext: NavigationStateStore.getStackNavContext()
};
}
render() {
if (this.state.isStackNav) {
return (
<RootStackNavigationView navContext={ this.state.stackNavContext } />
);
} else {
return (
<RootCompositeNavigationView navContext={ this.state.compositeNavContext } />
);
}
}
```
================================================
FILE: docs/_posts/2017-05-24-performance-tuning.md
================================================
---
title: Performance Tuning
author: erictraut
---
Performance tuning is an important part of any app development effort. In this article, I'll talk about some of the tools and techniques we used to identify and address performance bottlenecks within the ReactXP-based Skype app.
One of the benefits of a cross-platform code base is that many performance improvements benefit all platforms.
### Measurement and Analysis
It has been said that you can't improve what you can't measure. This is especially true for performance tuning. We use a variety of tools to determine which code paths are performance-critical.
Regardless of the analysis tool, you may want to use the production build of the app when measuring performance. The React JavaScript code performs many expensive runtime checks when it executes in "dev mode", and this can significantly distort your measurements.
#### Chrome Performance Tools
The Chrome browser offers excellent tracing and visualization tools. Open the Developer Tools window, click on the Performance tab, and click on the "record" button. Once you're done recording, Chrome will display a detailed timeline with call hierarchies. Zoom in and out to determine where your time is going.
#### Systrace
React Native provides a way to enable and disable Systrace, a method-level trace recording facility. It records both native and JavaScript methods, so it provides a good overview of what's happening throughout the app. To use Systrace, build and deploy a dev build to your device. Shake the device to display the developer menu (or press command-D if you're running within the iOS simulator). Select "Start Systrace", then perform the action that you want to measure. When you stop Systrace, an HTML trace file will be created. You can visualize and interact with this trace in Chrome. Recent versions of Chrome deprecated a feature used in the Systrace code, so you will need to edit it as follows. Simply add the following line to the head section of the generated HTML file.
```
<script src="https://rawgit.com/MaxArt2501/object-observe/master/dist/object-observe.min.js"></script>
```
#### Console Logging
Primitive console logging is often an effective way to measure performance. Log entries can be emitted with millisecond-resolution timestamps. Simply call Date.now() to get the current time. Durations of performance-critical operations (such as app startup) can also be computed and output in the log.
#### Instrumentation
Once your app is deployed at scale, it's important to monitor performance of critical operations. To do this, we log instrumentation that is sent to our servers and aggregated across all users. We're then able to visualize the data over time, by platform, by device type, etc.
### Crossing the Bridge
React Native apps contain two separate execution environments --- JavaScript and Native. These environments are relatively independent. They each run on separate threads and have access to their own data. All communication between the two environments takes place over the React Native "bridge". You can think of the bridge as a bidirectional message queue. Messages are processed in the order in which they are placed on each of the queues.
Data is passed in a serialized form --- UTF16 text in JSON format. All I/O occurs in the native environment. This means any storage or networking request initiated by the JavaScript code must go across the bridge, and the resulting data must then be serialized and sent back across the bridge in the other direction. This works fine for small pieces of data, but it is expensive once the data sizes or the message counts grow.
One way to mitigate this bottleneck is to avoid passing large pieces of data across the bridge. If it doesn't require processing within the JavaScript environment, leave it on the native side. It can be represented as a "handle" within the JavaScript code. This is how we handle all images, sounds, and complex animation definitions.
### Cooperative Multitasking
JavaScript runs on a single thread. If your app's JavaScript code runs for long periods of time, it blocks execution of event handlers, message handlers, etc., and the app will feel non-responsive. If you need to do a long-running operation, you have several options:
1. Implement it as a native module and run it on a separate thread (applicable only to React Native).
2. Break the operation into smaller blocks and execute them as chained tasks.
3. Compute only the portion of the result that is needed at the time.
### Virtualization
When dealing with long lists of data that appear within a user interface, it is important to use some form of virtualization. A virtualized view renders only the visible contents. As the user scrolls through the list, newly-disclosed items are rendered. We looked at all of the available virtualized views, but we didn't find any that provided both the speed and flexibility that we needed, so we ended up writing our own implementation. Our [VirtualListView](https://microsoft.github.io/reactxp/docs/extensions/virtuallistview.html) went through six major iterations before we landed on a design and implementation that we were happy with.
### Launching Your Startup
App startup time is perhaps the biggest performance challenge with React Native apps. This is especially true on slower Android devices. We continue to struggle to reduce the startup times on such devices. Here are several tips that we learned along the way.
#### Defer Module Initialization
In TypeScript or JavaScript code, it's common practice to include a bunch of import statements at the top of each module. For example, here's what you'll find at the top of the App.tsx file in the hello-world sample.
```
import RX = require('reactxp');
import MainPanel = require('./MainPanel');
import SecondPanel = require('./SecondPanel');
```
Each of these "require" calls initializes the specified module the first time it's encountered. A reference to that module is then cached, so subequent calls to "require" the same module are almost free. At startup time, the first module requires several other modules, each of which requires several other modules, etc. This continues until the entire tree of module dependencies have been initialized. This all occurs before the first line of your first module executes. As the number of modules within your app increases, the initialization time increases.
The way to fix this problem is through deferred initialization. Why pay the cost of initializing a module for some seldom-used UI panel at startup? Just defer its initialization until it is needed. To do this, we make use of a babel plugin created by Facebook called [inline-requires](https://github.com/facebook/fbjs/blob/master/packages/babel-preset-fbjs/plugins/inline-requires.js). Just download the script and create a ".babelrc" file that looks something like this:
```
{
"presets": ["react-native"],
"plugins": ["./build/inline-requires.js"]
}
```
What does this script do? It eliminates the require calls at the top of your modules. Whenever the imported variable is used within the file, it inserts a call to require. This means all modules are initialized immediately before their first use rather than at app startup time. For large apps, this can shave seconds from the app's startup time on slower devices.
#### Minification
For production builds, it's important to "minify" your JavaScript. This process eliminates extraneous whitespace and shortens variable and method names where possible. It reduces the size of your JavaScript bundle on disk and in memory and speeds up parsing of your code.
#### Native Module Initialization
React Native includes a number of built-in "native modules". These provide functionality that you can invoke from JavaScript. Many apps will not make use of all of the default native modules. Each native module can add tens of milliseconds to the app initialization time, so it's wasteful to initialize native modules that your app won't use. On Android, you can eliminate this overhead by creating a subclass of [MainReactPackage](https://github.com/facebook/react-native/blob/master/ReactAndroid/src/main/java/com/facebook/react/shell/MainReactPackage.java) that is specific to your app. Copy the createViewManagers() method into your subclass and comment out the view managers that you don't use. Then change the getPackages() method within your app's ReactInstanceHost class to instantiate your custom class rather than the normal MainReactPackage. This technique can shave 100ms or more off the startup time on slow Android devices.
### Additional Resources
For additional tips on performance tuning, refer to the [Performance](https://facebook.github.io/react-native/docs/performance.html) page on Facebook's React Native documentation site. [This blog](https://code.facebook.com/posts/895897210527114/) also contains useful tips.
================================================
FILE: docs/_posts/2017-06-29-asset-loading.md
================================================
---
title: Asset Loading
author: erictraut
---
We've received questions about how we handle assets (images, videos, sounds) in a way that works for both React Native and React JS (web).
### Specifying Asset Locations
On the web, assets are simply referenced by URL and are loaded asynchronously by the browser.
``` javascript
<RX.Image source={ 'https://mydomain.com/images/appLogoSmall.jpg' }/>
```
React Native apps typically package assets in the app bundle, so they are loaded from the local device storage. In this case, the path is specified in the form of a relative file system path. However, instead of passing the path directly, you need to invoke the React Native packager by calling "require".
``` javascript
<RX.Image source={ require('./images/appLogoSmall.jpg') }/>
```
The packager requires that the asset path is specified as a string literal. In other words, it cannot be constructed at runtime or returned by a helper method. For more details about this limitation, refer to the [React Native documentation](https://facebook.github.io/react-native/docs/images.html).
This makes it difficult to write cross-platform code that runs on both web and native platforms. Here's how we solved this problem in the Skype app.
### AppAssets Module
We created an "AppAssets" interface that includes an accessor method for each of the assets in our app.
``` javascript
// File: AppAssets.d.ts
declare module 'AppAssets' {
interface IAppAssets {
appLogoSmall: string;
appLogoLarge: string;
notificationIcon: string;
// ... etc.
}
const Assets: IAppAssets;
}
```
We then implemented this interface for both web and native platforms.
``` javascript
// File: AppAssetsWeb.ts
import AppAssets = require('AppAssets');
import AppConfig = require('./AppConfig');
class AppAssetsImpl implements AppAssets.IAppAssets {
appLogoSmall = AppConfig.getImagePath('skypeLogoSmall.png');
appLogoLarge = AppConfig.getImagePath('skypeLogoLarge.png');
notificationIcon = AppConfig.getImagePath('notificationIcon.gif');
// ... etc.
}
export const Assets: AppAssets.IAppAssets = new AppAssetsImpl();
```
``` javascript
// File: AppAssetsNative.ts
import AppAssets = require('AppAssets');
class AppAssetsImpl implements IAppAssets.Collection {
get appLogoSmall() { return require('..images/skypeLogoSmall.png'); }
get appLogoLarge() { return require('..images/skypeLogoLarge.png'); }
get notificationIcon() { return require('../images/notificationIcon.gif'); }
// ... etc.
}
export const Assets: AppAssets.IAppAssets = new AppAssetsImpl();
```
There are a few things worth noting in the code above. First, we're making use of an interface to ensure that the web and native implementations stay in sync. If you forget to add an asset to both files, the TypeScript compiler will detect the error at build time.
Second, the web implementation is using a helper method ```getImagePath``` to construct the full URL. It builds this using a dynamically-configurable domain name, allowing us to stage the app to a test web server or publish it to the production server.
Third, the native implementation makes use of accessors. This defers the loading of the asset until the first time it is first accessed. Without this trick, all assets would be loaded at the time the AppAssetsNative module was initialized, adding to app startup time.
Now we can reference the assets in a cross-platform way.
``` javascript
import AppAssets = require('AppAssets');
<RX.Image source={ AppAssets.Assets.appLogoSmall }/>
```
### Aliasing
Now that we have two implementations (one for web and a second for native), how do we "link" the correct version based on the platform that we're building? We do this through a lightweight "aliasing" step in our build process. This step replaces the ```require('AppAssets')``` with either ```require('./ts/AppAssetsWeb')``` or ```require('./ts/AppAssetsNative')``` depending on the platform being built.
I'll provide examples in [gulp](http://gulpjs.com/) syntax, but the same technique can be used in [grunt](https://gruntjs.com/) or other task scripting runtimes.
``` javascript
var config = {
aliasify: {
src: './.temp/' + argv.platform,
dest: getBuildPath() + 'js/',
aliases: (argv.platform === 'web') ?
// Web Aliases
{
'AppAssets': './ts/AppAssetsWeb'
} :
// Native Aliases
{
'AppAssets': './ts/AppAssetsNative'
}
}
}
function aliasify(aliases) {
var reqPattern = new RegExp(/require\(['"]([^'"]+)['"]\)/g);
// For all files in the stream, apply the replacement.
return eventStream.map(function(file, done) {
if (!file.isNull()) {
var fileContent = file.contents.toString();
if (reqPattern.test(fileContent)) {
file.contents = new Buffer(fileContent.replace(reqPattern, function(req, oldPath) {
if (!aliases[oldPath]) {
return req;
}
return "require('" + aliases[oldPath] + "')";
}));
}
}
done(null, file);
});
}
gulp.task('apply-aliases', function() {
return gulp.src(path.join(config.aliasify.src, '**/*.js'))
.pipe(aliasify(config.aliasify.aliases))
.pipe(gulp.dest(config.aliasify.dest))
.on('error', handleError);
});
// Here's our full build task pipeline. I haven't provided the task
// definitions for all of these stages, but you can see where the
// 'apply-aliases' task fits into the pipeline.
gulp.task('run', function(callback) {
runSequence('clean', 'build', 'apply-aliases', 'watch', 'lint', callback);
});
```
================================================
FILE: docs/_sass/_typography.scss
================================================
@import 'variables';
$textColor: $mediumColor;
$textColorLight: lighten($textColor, 20%);
html {
font-family: $helvetica;
font-family: proxima-nova, $helvetica;
color: $textColor;
line-height: 1.28;
}
p {
margin: 0 0 10px;
}
.subHeader {
font-size: 21px;
font-weight: 200;
line-height: 30px;
margin-bottom: 10px;
}
em {
font-style: italic;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 10px 0;
font-family: inherit;
font-weight: bold;
line-height: 20px;
color: inherit;
text-rendering: optimizelegibility;
}
h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
font-weight: normal;
color: $textColorLight
}
h1,
h2,
h3 {
line-height: 40px;
}
h1 {
font-size: 39px;
}
h2 {
font-size: 31px;
}
h3 {
font-size: 23px;
}
h4 {
font-size: 16px;
}
h5 {
font-size: 14px;
}
h6 {
font-size: 11px;
}
h1 small {
font-size: 24px;
}
h2 small {
font-size: 18px;
}
h3 small {
font-size: 16px;
}
h4 small {
font-size: 14px;
}
ul,
ol {
margin: 0 0 10px 25px;
padding: 0;
}
ul ul,
ul ol,
ol ol,
ol ul {
margin-bottom: 0;
}
li {
line-height: 20px;
}
a {
color: $linkColor;
text-decoration: none;
&:hover,
&:focus {
color: $linkInteract;
text-decoration: underline;
}
&:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
}
.center {
text-align: center;
}
input {
font-family: inherit;
}
================================================
FILE: docs/_sass/_variables.scss
================================================
$primary: #59b941;
$linkColor: darken($primary, 9%);
$linkInteract: darken($linkColor, 9%);
$pageBg: #f9f9f9;
$lightColor: #e9e9e9;
$mediumestColor: #666;
$mediumColor: #484848;
$darkColor: #2d2d2d;
$darkestColor: #222222;
$rxpColor: #59b941;
$lightTextColor: #fafafa;
$mediumTextColor: #aaa;
$darkTextColor: $mediumColor;
$buttonBlueTop: #77a3d2;
$buttonBlueBottom: #4783c2;
$buttonGreyTop: #9a9a9a;
$buttonGreyBottom: #646464;
$helvetica: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
@mixin clearfix {
&:after {
content:"";
display:table;
clear:both;
}
}
// HiDPI mixin. Default value set to 1.3 to target Google Nexus 7 (http://bjango.com/articles/min-device-pixel-ratio/)
@mixin hidpi($ratio: 1.3) {
@media only screen and (-webkit-min-device-pixel-ratio: $ratio),
only screen and (min--moz-device-pixel-ratio: $ratio),
only screen and (-o-min-device-pixel-ratio: #{$ratio}/1),
only screen and (min-resolution: #{round($ratio*96)}dpi),
only screen and (min-resolution: #{$ratio}dppx) {
@content;
}
}
@mixin retina-image($filename, $background-size, $extension: png, $retina-filename: null, $retina-suffix: _2x) {
background-image: url("#{$filename}.#{$extension}");
@include hidpi {
@if $retina-filename {
background-image: url("#{$retina-filename}.#{$extension}");
}
@else {
background-image: url("#{$filename}#{$retina-suffix}.#{$extension}");
}
background-size: $background-size;
}
}
================================================
FILE: docs/blog/all.html
================================================
---
title: Blog
layout: default
sectionid: blog
id: all-posts
---
<section class="content wrap documentationContent nosidebar">
<div class="inner-content">
<h1>All Posts</h1>
{% for page in site.posts %}
<p><strong><a href="/reactxp{{ page.url }}">{{ page.title }}</a></strong> on {{ page.date | date: "%B %e, %Y" }} by
<a href="{{ site.data.authors[page.author].url }}">{{ site.data.authors[page.author].name }}</a>
</p>
{% endfor %}
</div>
</section>
================================================
FILE: docs/blog/index.html
================================================
---
title: Blog
layout: default
sectionid: blog
---
<section class="content wrap blogContent">
{% include nav_blog.html %}
<div class="inner-content">
{% for page in paginator.posts %}
<div class="post-list-item">
{% include blog_post.html page=page content=page.content%}
</div>
{% endfor %}
<div class="pagination">
{% if paginator.previous_page %}
<a href="/reactxp{{ paginator.previous_page_path }}" class="previous">
« Previous Page
</a>
{% endif %}
{% if paginator.next_page %}
<a href="/reactxp{{ paginator.next_page_path }}" class="next">
Next Page »
</a>
{% endif %}
</div>
</div>
</section>
================================================
FILE: docs/community/support.md
================================================
---
id: support
title: Where To Get Support
layout: hero
sectionid: community
permalink: community/support.html
redirect_from:
- "community/index.html"
---
# ReactXP Community
### Maintainers
ReactXP was initially developed by the Skype team at Microsoft. It has since been adopted by other teams at Microsoft. You can contact the maintainers by email at [reactxp@microsoft.com](mailto:reactxp@microsoft.com).
### Bug Reports & Feature Requests
For bug reports or feature requests, please create an issue in [GitHub](https://github.com/microsoft/reactxp/issues).
### Forums
For general discussions or questions, use this [Gitter room](https://gitter.im/msreactxp).
================================================
FILE: docs/css/reactxp.scss
================================================
---
title: reactxp.css
---
@import 'variables';
@import 'typography';
@mixin code-typography {
font-family: 'source-code-pro', Menlo, Consolas, 'Courier New', monospace;
line-height: 1.5;
font-size: 13px;
-webkit-text-size-adjust: none;
}
$skinnyContentWidth: 650px;
$contentWidth: 920px;
$contentPadding: 20px;
$columnWidth: 280px;
$columnGutter: 40px;
$twoColumnWidth: 2 * $columnWidth + $columnGutter;
$navHeight: 50px;
// Breakpoints
$bp-large: 960px;
$bp-medium: 640px;
$bp-small: 480px;
@mixin bp-small {
@media (max-width: $bp-small) {
@content;
}
}
@mixin bp-medium {
@media (max-width: $bp-medium) {
@content;
}
}
@mixin bp-large {
@media (max-width: $bp-large) {
@content;
}
}
// basic reset
* {
box-sizing: border-box;
border: none;
margin: 0;
padding: 0;
}
html {
background: $pageBg;
}
.left {
float: left;
}
.right {
float: right;
}
.container {
padding-top: $navHeight;
width: 100%;
background-color: white;
}
.wrap {
max-width: $contentWidth + (2 * $contentPadding);
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
@include bp-large {
padding-left: 10px;
padding-right: 10px;
}
}
.skinnyWrap {
width: $skinnyContentWidth + (2 * $contentPadding);
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
}
hr {
height: 0;
border-top: 1px solid #ccc;
border-bottom: 1px solid #eee;
}
ul,
li {
margin-left: 20px;
}
li + li {
margin-top: 10px;
}
// Make header navigation linkable and on the screen. Used in documentation and
// blog posts.
h1, h2, h3, h4, h5, h6 {
.anchor {
margin-top: -$navHeight;
position: absolute;
}
&:hover .hash-link {
display: inline;
}
}
.hash-link {
color: $mediumTextColor;
display: none;
padding-left: 8px;
}
// Main Nav
.nav-main {
@include clearfix;
background: $darkestColor;
color: $lightTextColor;
position: fixed;
top: 0;
height: $navHeight;
box-shadow: 0 0 5px rgba(0, 0, 0, .5);
width: 100%;
z-index: 100;
@include bp-large {
height: auto;
}
a {
color: $lightColor;
text-decoration: none;
}
.nav-site {
display: inline-flex;
display: -ms-flexbox;
flex: 1;
-ms-flex: 1;
li {
margin: 0;
}
li > a {
box-sizing: content-box;
padding: 0 10px;
line-height: $navHeight;
display: inline-block;
height: $navHeight;
color: #ddd;
white-space: nowrap;
@include bp-large {
display: flex;
display: -ms-flex;
justify-content: center;
align-items: center;
padding: 0 5px;
line-height: inherit;
}
&:hover {
color: #fff;
}
&.active {
position: relative;
color: $lightTextColor;
background: #333;
&:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
border-bottom: 3px solid $primary;
}
@include bp-large {
background: inherit;
}
}
}
.nav-site-item {
&--hidden-sm {
@include bp-large {
display: none;
}
}
}
.nav-site-search {
@include bp-large {
position: absolute;
z-index: 1;
right: 0;
top: 0;
margin: 0 10px;
&:focus {
width: 170px;
}
}
}
}
.nav-site-internal {
margin: 0 0 0 20px;
@include bp-large {
margin: 0;
}
}
.nav-site-external {
float: right;
margin: 0;
@include bp-large {
position: absolute;
top: 0;
right: 55px;
float: none;
}
}
.nav-home {
color: $rxpColor;
font-size: 24px;
line-height: $navHeight;
height: $navHeight;
display: inline-block;
@include bp-large {
font-size: 20px;
}
}
.nav-logo {
vertical-align: middle;
display: inline-block;
@include bp-large {
height: 30px;
width: auto;
}
}
ul {
display: inline-block;
vertical-align: top;
}
li {
display: inline;
}
}
.nav-lists {
display: inline-block;
vertical-align: top;
width: calc(100% - 120px);
@include bp-large {
display: flex;
display: -ms-flex;
width: calc(100% + 20px);
margin: 0 -10px;
font-size: 0.9em;
li {
display: flex;
display: -ms-flex;
-ms-flex: 1 0 auto;
align-items: center;
a {
-ms-flex: 1;
text-align: center;
line-height: 1.2;
}
}
}
}
// Hero
.hero {
min-height: 300px;
background: $darkColor;
padding-top: 50px;
color: $lightColor;
font-weight: 300;
.text {
font-size: 64px;
text-align: center;
}
.minitext {
font-size: 16px;
text-align: center;
text-transform: uppercase;
}
strong {
color: $rxpColor;
font-weight: 400;
}
}
.buttons-unit {
display: flex;
display: flex;
justify-content: center;
flex-wrap: wrap;
margin-top: 60px;
text-align: center;
font-size: 1em;
a {
color: $rxpColor;
}
.button {
font-size: 24px;
background: $primary;
color: $lightTextColor;
&:active {
background: darken($primary, 5%);
}
@include bp-large {
margin: 5px;
font-size: 1em;
}
}
}
// Downloads
.buttons-unit.downloads {
margin: 30px 0;
}
// Docs Nav
.nav-docs {
color: $darkColor;
font-size: 14px;
float: left;
width: 210px;
@include bp-medium {
width: 100%;
padding-bottom: 40px;
}
ul {
list-style: none;
margin: 0;
}
ul ul {
margin: 0 0 6px 20px;
}
li {
line-height: 16px;
margin: 0 0 6px;
}
h3 {
text-transform: uppercase;
font-size: 14px;
}
a {
color: $mediumestColor;
display: block;
&:hover {
text-decoration: none;
color: $primary;
}
&.active {
color: $primary;
}
&.external {
&:after {
content: "";
display: inline-block;
width: 10px;
height: 10px;
padding-left: 5px;
@include retina-image('../img/external', 10px 10px);
background-position: 100% 0;
background-repeat: no-repeat;
font-size: 10px;
line-height: 1em;
opacity: 0.5;
}
}
}
.nav-docs-section {
border-bottom: 1px solid #ccc;
border-top: 1px solid #eee;
padding: 12px 0;
&:first-child {
padding-top: 0;
border-top: 0;
}
&:last-child {
padding-bottom: 0;
border-bottom: 0;
}
> ul {
@include bp-medium {
columns: 2
}
@include bp-small {
columns: 1;
}
li {
margin: 0;
a {
padding: 0;
line-height: 1.6;
}
}
}
}
}
.nav-blog {
li {
margin-bottom: 5px;
}
}
// Home Page specifics
.home-section {
margin: 50px 0;
}
.home-divider {
border-top-color: #bbb;
margin: 0 auto;
width: 100%;
max-width: 400px;
}
.skinny-row {
@include clearfix;
}
.skinny-col {
float: left;
margin-left: $columnGutter;
width: ($skinnyContentWidth - $columnGutter) / 2;
&:first-child {
margin-left: 0;
}
}
.marketing-row {
@include clearfix;
margin: 50px 0;
}
.marketing-col {
float: left;
margin-left: 40px;
width: $columnWidth;
@include bp-large {
margin: 0;
width: 100%;
}
h3 {
color: $darkColor;
font-size: 24px;
line-height: 28px;
font-weight: normal;
}
p {
font-size: 16px;
}
}
.marketing-col:first-child {
margin-left: 0;
}
#overview h3, .home-presentation h3 {
color: $darkColor;
font-size: 24px;
font-weight: normal;
margin-bottom: 5px;
}
#overview {
p {
margin: 0 0 25px 0;
}
.overview-section {
margin-top: 60px;
}
}
.home-bottom-section {
margin-bottom: 100px;
}
.docs-nextprev {
@include clearfix;
}
/* JSX Compiler */
.jsxCompiler {
margin: 0 auto;
padding-top: 20px;
width: 1220px;
label.compiler-option {
display: block;
margin-top: 5px;
}
#jsxCompiler {
margin-top: 20px;
}
.playgroundPreview {
padding: 0;
width: 600px;
word-wrap: break-word;
pre {
@include code-typography;
}
}
.playgroundError {
// The compiler view kills padding in order to render the CodeMirror code
// more nicely. For the error view, put a padding back
padding: 15px 20px;
}
}
.docs-prev {
float: left;
}
.docs-next {
float: right;
}
section.black content {
padding-bottom: 18px;
}
/**
* Blog
*/
.blogContent {
@include clearfix;
padding-top: 20px;
padding-bottom: 80px;
@include bp-medium {
padding-bottom: 0;
}
blockquote {
padding: 5px 15px;
margin: 20px 0;
background-color: #f8f5ec;
border-left: 5px solid #f7ebc6;
}
h2 > code {
font-size: inherit;
line-height: inherit;
color: #555;
background-color: rgba(0,0,0,0.04);
}
}
/**
* Docs
*/
.documentationContent {
@include clearfix;
.subHeader {
font-size: 24px;
}
// H2s form documentation topic dividers. Extra space helps.
h2 {
margin-top: 30px;
}
padding-top: 20px;
padding-bottom: 80px;
@include bp-medium {
padding-bottom: 0;
}
// Make a notice box out of blockquotes in the documentation:
blockquote {
padding: 15px 30px 15px 15px;
margin: 20px 0;
background-color: rgba(248, 245, 236, 0.5);
border-left: 5px solid rgba(191, 87, 73, 0.2);
h4 {
margin-top: 0;
}
p {
margin-bottom: 0;
}
// Treat first child as the title - promote to H4.
p:first-child {
font-weight: bold;
font-size: 17.5px;
line-height: 20px;
margin-top: 0;
text-rendering: optimizelegibility;
}
}
}
.docs-prevnext {
padding-top: 40px;
padding-bottom: 40px;
}
/* Button */
.button {
background: linear-gradient($buttonGreyTop, $buttonGreyBottom);
border-radius: 4px;
padding: 8px 16px;
font-size: 18px;
font-weight: 400;
margin: 0 12px;
display: inline-block;
color: $lightTextColor;
text-decoration: none;
text-shadow: 0 1px 3px rgba(0, 0, 0, .3);
box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
text-decoration: none;
&:hover {
text-decoration: none;
}
&:active {
box-shadow: none;
}
}
.home {
.button {
box-shadow: 1px 3px 3px rgba(0, 0, 0, .3);
}
}
.button.blue {
background: linear-gradient($buttonBlueTop, $buttonBlueBottom);
}
/* Row */
.row {
padding-bottom: 4px;
}
.row .span4 {
width: 33.33%;
display: table-cell;
}
.row .span8 {
width: 66.66%;
display: table-cell;
}
.row .span6 {
width: 50%;
display: table-cell;
}
/* Content */
p {
margin: 10px 0;
}
.highlight {
padding: 10px;
margin-bottom: 20px;
}
figure {
text-align: center;
}
.content {
font-size: 15px;
}
.inner-content {
float: right;
width: 100%;
max-width: $skinnyContentWidth;
font-size: 15px;
@include bp-large {
width: calc(100% - 240px);
max-width: 100%;
}
@include bp-medium {
width: 100%;
}
}
.nosidebar .inner-content {
float: none;
margin: 0 auto;
}
h1 {
@include clearfix;
}
.edit-page-link {
float: right;
font-size: 16px;
font-weight: normal;
line-height: 20px;
margin-top: 17px;
@include bp-medium {
float: left;
width: 100%;
}
}
/**
* Community
*/
.communityContent {
@include clearfix;
h3 {
margin-top: 30px;
}
padding-top: 20px;
blockquote {
padding: 5px 15px;
margin: 20px 0;
background-color: #f8f5ec;
border-left: 5px solid #f7ebc6;
}
th {
padding-right: 6px;
text-align: right;
vertical-align: top;
font-weight: normal;
@include code-typography;
}
td {
vertical-align: top;
text-align: left;
}
}
/* Blog */
.post-list-item + .post-list-item {
margin-top: 60px;
}
/* CodeMirror */
div.CodeMirror pre, div.CodeMirror-linenumber, code {
@include code-typography;
}
div.CodeMirror-linenumber {
text-align: right;
}
.CodeMirror, div.CodeMirror-gutters, div.highlight {
border: none;
}
/* hide the cursor. Mostly used when code's in plain JS */
.CodeMirror-readonly div.CodeMirror-cursor {
visibility: hidden;
}
small code,
li code,
p code {
color: #555;
background-color: rgba(0, 0, 0, .04);
padding: 1px 3px;
}
small a code,
li a code,
p a code {
color: inherit;
}
.cm-s-default span.cm-string-2 {
color: inherit;
}
.playground {
@include clearfix;
}
.playground-tab {
border-bottom: none !important;
border-radius: 3px 3px 0 0;
padding: 6px 8px;
font-size: 12px;
font-weight: bold;
color: #c2c0bc;
background-color: #f1ede4;
display: inline-block;
cursor: pointer;
}
.playgroundCode,
.playground-tab,
.playgroundPreview {
border: 1px solid rgba(16,16,16,0.1);
}
.playground-tab-active {
color: $darkestColor;
}
.playgroundCode {
border-radius: 0 3px 3px 3px;
float: left;
overflow: hidden;
width: 100%;
max-width: $twoColumnWidth;
}
.playgroundPreview {
background-color: white;
border-radius: 3px;
float: right;
padding: 15px 20px;
width: $columnWidth;
word-wrap: break-word;
}
.playgroundError {
color: darken($primary, 5%);
font-size: 15px;
}
.MarkdownEditor textarea {
width: 100%;
height: 100px
}
.MarkdownEditor .content {
white-space: pre-wrap;
word-break: break-word;
}
.hll {
background-color: #f7ebc6;
border-left: 5px solid #f7d87c;
display: block;
margin-left: -14px;
margin-right: -14px;
padding-left: 9px;
}
/* CodeMirror doesn't support <jsx> syntax. Instead of highlighting it
as error, just ignore it */
.highlight .javascript .err {
background-color: transparent;
color: inherit;
}
.highlight {
position: relative;
margin-bottom: 14px;
padding: 30px 14px 14px;
border: none;
border-radius: 0;
overflow: auto;
}
.highlight pre {
padding: 0;
margin-top: 0;
margin-bottom: 0;
background-color: transparent;
border: 0;
float: left;
min-width: 100%;
}
.highlight pre code {
/* Respect line-height defined in <code> styles above */
display: block;
/* Cancel out styles for `li code` in case we have a <pre> within an <li>. */
background: none;
padding: 0;
}
.highlight pre .lineno {
display: inline-block;
width: 22px;
padding-right: 5px;
margin-right: 10px;
color: #bebec5;
text-align: right;
}
/* Echo out a label for the example */
div.highlight:after {
position: absolute;
top: 0;
right: 0;
left: 0;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
color: #c2c0bc;
background-color: #f1ede4;
content: "Code";
}
.downloadCenter {
text-align: center;
margin-top: 20px;
margin-bottom: 25px;
}
.downloadSection:hover {
text-decoration: none !important;
}
@include bp-large {
.nav-main {
position: relative;
}
.container {
padding-top: 0;
}
}
.post {
margin-bottom: 30px;
}
.post img {
max-width: 100%;
height: auto;
}
.pagination {
margin-bottom: 30px;
/* Trick to get the wrapper to expand to fit floating elements */
width: 100%;
overflow: hidden;
.next {
float: right;
}
}
// Twitter embeds. Need to !important because they inline margin on the iframe.
div[data-twttr-id] iframe {
margin: 10px auto !important;
width: 100% !important;
}
.fb_iframe_widget {
max-width: 100%;
* {
max-width: 100%;
}
}
#twitter-widget-0 {
@include bp-large {
display: none !important; // Need !important because they inline display on the iframe.
}
}
/* Acknowledgements */
.three-column {
@include clearfix;
}
.three-column > ul {
float: left;
margin-left: 30px;
width: 190px;
}
.three-column > ul:first-child {
margin-left: 20px;
}
/* Algolia Doc Search */
input#algolia-doc-search {
background: transparent url('/react/img/search.png') no-repeat 10px center;
background-size: 16px 16px;
position: relative;
vertical-align: top;
margin-left: 10px;
padding: 0 10px;
padding-left: 35px;
height: 30px;
margin-top: 10px;
font-size: 16px;
line-height: 20px;
background-color: #333;
border-radius: 4px;
color: white;
outline: none;
width: 170px;
transition: width .2s ease;
&:focus {
width: 240px;
}
@include bp-large {
background-color: transparent;
width: 0;
cursor: pointer;
&:focus {
width: 200px;
background-color: #333;
}
}
}
.algolia-autocomplete .aa-dropdown-menu {
margin-left: -110px;
margin-top: -4px;
}
.algolia-autocomplete {
vertical-align: top;
height: 53px;
}
.algolia-docsearch-suggestion {
border-bottom-color: #c05b4d;
}
.algolia-docsearch-suggestion--category-header {
background-color: #cc7a6f;
}
.algolia-docsearch-suggestion--highlight {
color: #c05b4d;
}
.algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--highlight {
background-color: #c05b4d;
}
.aa-cursor .algolia-docsearch-suggestion--content {
color: #c05b4d;
}
.aa-cursor .algolia-docsearch-suggestion {
background: #f1f3f5;
}
/**
* Footer
*/
footer.nav-footer {
box-sizing: border-box;
border: none;
font-weight: 300;
color: #202020;
font-size: 15px;
line-height: 24px;
background: #2D2D2D;
box-shadow: inset 0 10px 10px -5px #0d1116;
padding-top: 2em;
padding-bottom: 2em;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
footer .sitemap {
display: flex;
display: -ms-flexbox;
justify-content: space-between;
max-width: 1080px;
margin: 0 auto 3em;
}
footer .sitemap div {
flex: 1;
-ms-flex: 1;
}
footer .sitemap .nav-home {
display: table;
margin: -12px 20px 0 0;
padding: 10px;
width: 60px;
height: 60px;
transition: opacity 0.15s ease-in-out;
background: url("../img/logo_small_gray.png") no-repeat content-box;
}
footer .sitemap .nav-home:hover,
footer .sitemap .nav-home:focus {
background-image: url("../img/logo_small.png");
}
@media screen and (max-width: 740px) {
footer .sitemap {
display: none;
}
}
footer .sitemap a {
color: white;
display: table;
margin: 2px -10px;
padding: 3px 10px;
}
footer .sitemap a:hover,
footer .sitemap a:focus {
color: #61dafb;
text-decoration: none;
}
footer .sitemap h6 > a:hover,
footer .sitemap h6 > a:focus {
color: #61dafb;
text-decoration: none;
}
footer .sitemap h5,
footer .sitemap h6 {
margin: 0 0 10px;
}
footer .sitemap h5,
footer .sitemap h6,
footer .sitemap h5 > a,
footer .sitemap h6 > a {
color: white;
}
footer .sitemap h5 > a,
footer .sitemap h6 > a {
margin: 0 -10px;
}
footer .fbOpenSource {
display: block;
margin: 1em auto;
opacity: 0.4;
transition: opacity 0.15s ease-in-out;
width: 170px;
}
footer .fbOpenSource:hover {
opacity: 1.0;
}
footer .copyright {
color: rgba(255, 255, 255, 0.4);
text-align: center;
}
================================================
FILE: docs/css/syntax.css
================================================
.highlight pre code {
color: #637c84;
}
.highlight {
color: #333333;
background: #f8f5ec;
}
.highlight .c {
color: #93a1a1;
}
.highlight .g {
color: #637c84;
}
/* Generic */
.highlight .k {
color: #859900;
}
/* Keyword */
.highlight .l {
color: #637c84;
}
/* Literal */
.highlight .n {
color: #637c84;
}
/* Name */
.highlight .o {
color: #859900;
}
/* Operator */
.highlight .x {
color: #cc7a6f;
}
/* Other */
.highlight .p {
color: #637c84;
}
/* Punctuation */
.highlight .cm {
color: #93a1a1;
}
/* Comment.Multiline */
.highlight .cp {
color: #859900;
}
/* Comment.Preproc */
.highlight .c1 {
color: #93a1a1;
}
/* Comment.Single */
.highlight .cs {
color: #859900;
}
/* Comment.Special */
.highlight .gd {
color: #36958e;
}
/* Generic.Deleted */
.highlight .ge {
font-style: italic;
color: #637c84;
}
/* Generic.Emph */
.highlight .gr {
color: #dc322f;
}
/* Generic.Error */
.highlight .gh {
color: #cc7a6f;
}
/* Generic.Heading */
.highlight .gi {
color: #859900;
}
/* Generic.Inserted */
.highlight .go {
color: #637c84;
}
/* Generic.Output */
.highlight .gp {
color: #637c84;
}
/* Generic.Prompt */
.highlight .gs {
font-weight: bold;
color: #637c84;
}
/* Generic.Strong */
.highlight .gu {
color: #cc7a6f;
}
/* Generic.Subheading */
.highlight .gt {
color: #637c84;
}
/* Generic.Traceback */
.highlight .kc {
color: #cc7a6f;
}
/* Keyword.Constant */
.highlight .kd {
color: #268bd2;
}
/* Keyword.Declaration */
.highlight .kn {
color: #859900;
}
/* Keyword.Namespace */
.highlight .kp {
color: #859900;
}
/* Keyword.Pseudo */
.highlight .kr {
color: #268bd2;
}
/* Keyword.Reserved */
.highlight .kt {
color: #dc322f;
}
/* Keyword.Type */
.highlight .ld {
color: #637c84;
}
/* Literal.Date */
.highlight .m {
color: #36958e;
}
/* Literal.Number */
.highlight .s {
color: #36958e;
}
/* Literal.String */
.highlight .na {
color: #637c84;
}
/* Name.Attribute */
.highlight .nb {
color: #b58900;
}
/* Name.Builtin */
.highlight .nc {
color: #268bd2;
}
/* Name.Class */
.highlight .no {
color: #cc7a6f;
}
/* Name.Constant */
.highlight .nd {
color: #268bd2;
}
/* Name.Decorator */
.highlight .ni {
color: #cc7a6f;
}
/* Name.Entity */
.highlight .ne {
color: #cc7a6f;
}
/* Name.Exception */
.highlight .nf {
color: #268bd2;
}
/* Name.Function */
.highlight .nl {
color: #637c84;
}
/* Name.Label */
.highlight .nn {
color: #637c84;
}
/* Name.Namespace */
.highlight .nx {
color: #637c84;
}
/* Name.Other */
.highlight .py {
color: #637c84;
}
/* Name.Property */
.highlight .nt {
color: #268bd2;
}
/* Name.Tag */
.highlight .nv {
color: #268bd2;
}
/* Name.Variable */
.highlight .ow {
color: #859900;
}
/* Operator.Word */
.highlight .w {
color: #637c84;
}
/* Text.Whitespace */
.highlight .mf {
color: #36958e;
}
/* Literal.Number.Float */
.highlight .mh {
color: #36958e;
}
/* Literal.Number.Hex */
.highlight .mi {
color: #36958e;
}
/* Literal.Number.Integer */
.highlight .mo {
color: #36958e;
}
/* Literal.Number.Oct */
.highlight .sb {
color: #93a1a1;
}
/* Literal.String.Backtick */
.highlight .sc {
color: #36958e;
}
/* Literal.String.Char */
.highlight .sd {
color: #637c84;
}
/* Literal.String.Doc */
.highlight .s2 {
color: #36958e;
}
/* Literal.String.Double */
.highlight .se {
color: #cc7a6f;
}
/* Literal.String.Escape */
.highlight .sh {
color: #637c84;
}
/* Literal.String.Heredoc */
.highlight .si {
color: #36958e;
}
/* Literal.String.Interpol */
.highlight .sx {
color: #36958e;
}
/* Literal.String.Other */
.highlight .sr {
color: #dc322f;
}
/* Literal.String.Regex */
.highlight .s1 {
color: #36958e;
}
/* Literal.String.Single */
.highlight .ss {
color: #36958e;
}
/* Literal.String.Symbol */
.highlight .bp {
color: #268bd2;
}
/* Name.Builtin.Pseudo */
.highlight .vc {
color: #268bd2;
}
/* Name.Variable.Class */
.highlight .vg {
color: #268bd2;
}
/* Name.Variable.Global */
.highlight .vi {
color: #268bd2;
}
/* Name.Variable.Instance */
.highlight .il {
color: #36958e;
}
================================================
FILE: docs/docs/accessibility.md
================================================
---
id: accessibility
title: Accessibility
layout: docs
category: Overview
permalink: docs/accessibility.html
next: extensions
---
ReactXP exposes a common way to implement accessibility features across platforms.
A screen reader is an assistive technology available for visually-impaired users. It allows users to navigate through an application by focusing actionable components and announcing the purpose of those components.
ReactXP components [View](components/view), [Button](components/button), [GestureView](components/gestureview) and [TextInput](components/textinput) implement a common set of accessibility-related props described below.
Additional [Accessibility APIs](apis/accessibility) are provided for programmatically invoking the screen reader to announce events.
Accessibility traits override the default screen reader behaviors where appropriate. For example, the default behavior for [Button](components/button) is to append the text "Button" at the end of the label. In most cases, the default traits provide the desired behavior, but it is sometimes useful to provide additional information to the screen reader.
## Types
``` javascript
export enum ImportantForAccessibility {
// Platform decides which views are important for accessibility and brings
// the screen reader focus on those views
Auto,
// Groups all subviews under the view, allowing the screen reader to focus
// just this view; if the accessibilityLabel is specified, it is announced;
// otherwise, the labels of its children are used
Yes,
// Tells the screen reader that it can focus the subviews of this view
No,
// Hides the view and its subviews from the screen reader
NoHideDescendants
}
```
## Props
``` javascript
// Array of strings that will be added as custom actions on iOS
accessibilityActions?: string[] = undefined;
// Label that is read by the screen reader
accessibilityLabel?: string = undefined;
// Overrides or augments default screen reader behavior
accessibilityTraits?: AccessibilityTrait | AccessibilityTrait[] = undefined;
// Screen reader focus behavior
importantForAccessibility?: ImportantForAccessibility = Auto;
// Callback function invoked for accessibility action events
onAccessibilityAction?: (e: SyntheticEvent) => void;
// Keyboard tab order
tabIndex?: number = undefined; // web only
// Used to define the current value for a range widget such as a slider, spinbutton or progressbar
ariaValueNow?: number = undefined; // web only
```
================================================
FILE: docs/docs/animations.md
================================================
---
id: animations
title: Animations
layout: docs
category: Overview
permalink: docs/animations.html
next: accessibility
---
ReactXP supports a powerful animation abstraction. Individual style elements (e.g. transforms, opacity, or backgroundColor) can be animated.
## Animatable Components
Four base RX classes can have animatable styles:
* Animated.View
* Animated.Image
* Animated.Text
* Animated.TextInput
These component types should be used in place of the normal [View](components/view), [Image](components/image), [Text](components/text) or [TextInput](components/textinput) in the render method. In general, style properties expressed as numeric values or colors can be animated. Properties with text values (e.g. flexDirection or fontWeight) cannot be animated.
## Animated Values
The following example shows how to create animated values with an initial value. Animated values are typically stored as instance variables within a component class. They can also be stored in the state structure.
``` javascript
let animatedOpacityValue = RX.Animated.createValue(1.0);
let animatedScaleValue = RX.Animated.createValue(1.0);
```
For animated color values, it is possible to create interpolated values that map from a numeric range to a color range. In this example, the value smoothly transitions from white to red to black as the value increases from 0 to 1.
``` javascript
let animatedColorValue = RX.Animated.createValue(0.0);
let interpolatedValue = RX.Animated.interpolate(animatedColorValue,
[0.0, 0.5, 1.0], ['white', 'red', 'black']);
```
## Animated Styles
Once an animated value is created, it can be associated with an animated style.
Some animated style values are more expensive than others. Some affect the layout of elements (e.g. width, height, top, left), so the layout engine needs to be invoked during each stage of the animations. It's faster to avoid these and stick to styles that don't affect the layout (e.g. opacity and transforms).
This example demonstrates how a style sheet can contain multiple animated values.
``` javascript
let animatedStyle = RX.Styles.createAnimatedViewStyle({
opacity: animatedOpacityValue,
transform: [{
scale: animatedScaleValue
}]
});
```
Animated style sheets can be combined with other static styles.
``` javascript
render() {
<RX.Animated.View style={ [_styles.staticStyle, animatedStyle] } />
}
```
## Simple Timing Animations
To describe an animation, specify the final value of the animated value and a duration (specified in milliseconds). An optional easing function allows for a variety of animation curves including linear, step-wise, and cubic bezier.
Once an animation is defined, a call to the start() method starts the animation. The start method takes an optional parameter, a callback that is executed when the animation completes.
``` javascript
let opacityAnimation = RX.Animated.timing(animatedScaleValue,
{ toValue: 0.0, duration: 250, easing: RX.Animated.Easing.InOut() }
);
opacityAnimation.start(() => this._doSomethingWhenAnimationCompletes());
```
## Composite Animations
Sometimes it's useful to execute multiple animations in parallel or in sequence. This is easily accommodated by calling RX.Animated.parallel() or RX.Animated.sequence(). Composite animations can be nested to create sophisticated sequences.
``` javascript
let compositeAnimation = RX.Animated.parallel([
RX.Animated.timing(animatedScaleValue,
{ toValue: 0.0, duration: 250, easing: RX.Animated.Easing.InOut() }
),
RX.Animated.timing(animatedOpacityValue,
{ toValue: 1.1, duration: 250, easing: RX.Animated.Easing.Linear() }
)
]);
compositeAnimation.start();
```
## Directly Setting Animated Value
The value of an Animated Value can be set directly by calling the method ```setValue```. If this method is called while the value is being animated, the behavior is undefined. Setting the value of an Animated Value directly is faster than using a non-animated style attribute and re-rendering the component with a new attribute value.
``` javascript
let animatedOpacityValue = RX.Animated.createValue(1.0);
animatedOpacityValue.setValue(0.0);
```
## Web Limitations
ReactXP animation APIs on the web are implemented using DOM style transitions, as opposed to using JavaScript code to drive the animation. This results in much better performance and (in most cases) glitch-free animations, but it imposes some limitations on the use of the animation APIs.
* All active animated values associated with a particular element must share the same timing parameters (duration, easing function, delay, loop) and must be started at the same time.
* Each animated value can be associated with only one animated attribute that is actively running.
* Interpolated values used with startTransition are limited to only two values -- a begin and end value -- and must be specified in increasing order.
* Interpolated values not used with startTransition must have numeric outputValues, since we're interpolating between them ourselves.
* For interpolated values, the starting and ending values of a transition animation must correspond to the two interpolation keys.
* If an animation is stopped, the value will not reflect the intermediate position in the case of transforms and interpolated values.
================================================
FILE: docs/docs/apis/accessibility.md
================================================
---
id: apis/accessibility
title: Accessibility
layout: docs
category: Interfaces
permalink: docs/apis/accessibility.html
next: apis/alert
---
This interface provides methods and events related to accessibility.
Sometimes it's important to announce state changes in the app (for example, an incoming message) so visually-impaired users are aware that something changed on the screen. Multiple announcements can be queued.
## Events
``` javascript
// Triggered when the high-contrast setting changes.
highContrastChangedEvent: SubscribableEvent<(isEnabled: boolean) => void>;
// Triggered when the screen reader setting changes.
screenReaderChangedEvent: SubscribableEvent<(isEnabled: boolean) => void>;
```
## Methods
``` javascript
// Sends the specified string to the screen reader.
announceForAccessibility(announcement: string): void;
// Indicates whether a screen reader is currently enabled.
isScreenReaderEnabled(): boolean;
// Indicates whether the OS-level "high-contrast" setting is enabled.
isHighContrastEnabled(): boolean;
```
================================================
FILE: docs/docs/apis/alert.md
================================================
---
id: apis/alert
title: Alert
layout: docs
category: Interfaces
permalink: docs/apis/alert.html
next: apis/app
---
This interface displays an OS-specific alert over the top of the current screen. The appearance of the alert is dictated by the underlying OS platform. Some platforms allow alerts to be displayed even when the app is not in the foreground.
There is no ability to customize the alert by embedding ReactXP views within it or using ReactXP styles.
## Types
``` javascript
interface AlertButtonSpec {
// Button text
text?: string;
// Invoked when button is pressed
onPress?: () => void;
// Alert style to use (supported on some platforms)
style?: 'default' | 'cancel' | 'destructive';
}
interface AlertModalTheme {
// Modal background style
bodyStyle?: StyleRuleSet<ViewStyle>;
// Style for title text
titleTextStyle?: StyleRuleSet<TextStyle>;
// Style for message text
messageTextStyle?: StyleRuleSet<TextStyle>;
// Style for button control
buttonStyle?: StyleRuleSet<ButtonStyle>;
// Style applied when hovering over button
buttonHoverStyle?: StyleRuleSet<ButtonStyle>;
// Style for button text
buttonTextStyle?: StyleRuleSet<TextStyle>;
// Override style for cancel button
cancelButtonStyle?: StyleRuleSet<ButtonStyle>;
// Override style for cancel button hover state
cancelButtonHoverStyle?: StyleRuleSet<ButtonStyle>;
// Override style for cancel button
cancelButtonTextStyle?: StyleRuleSet<TextStyle>;;
}
interface AlertOptions {
// Optional icon (web only)
icon?: string;
// Optional theme (web only)
theme?: AlertModalTheme;
// (Android, iOS, and Windows only)
// Optional: the id of the root view this alert is associated with.
// Defaults to the view set by UserInterface.setMainView().
rootViewId?: string;
// Optional: Prevent the dialog from being dismissed when pressing away from the dialog
preventDismissOnPress?: boolean;
}
```
## Methods
``` javascript
// Displays an alert over the top of the current screen. Theming support is
// provided for web only and is ignored on other platforms.
show(title: string, message?: string, buttons? AlertButtonSpec[], options?: AlertOptions): void;
```
================================================
FILE: docs/docs/apis/app.md
================================================
---
id: apis/app
title: App
layout: docs
category: Interfaces
permalink: docs/apis/app.html
next: apis/clipboard
---
This interface provides core methods associated with the application. It also exposes events for low-memory conditions and activity state changes.
## Types
``` javascript
// Indicates whether the app is active or inactive
enum AppActivationState {
// App is running and in foreground
Active = 1,
// App is running and in background
Background = 2,
// App is inactive
// On RN mobile platforms, it is an intermediate state between when app transitions between foreground and background.
// On desktop platforms, this is currently not being used.
Inactive = 3,
// iOS specific activation state for extensions implemented
// with react-native
Extension = 4
}
```
## Methods
``` javascript
// Initializes the app. This should be one of the first calls made.
// Specifies whether app is running in "debug" mode, typically with
// asserts and unminified code. Also specifies whether in "development"
// mode, which can indicate that additional logging or fewer security
// checks are appropriate.
initialize(debug: boolean, development: boolean): void;
// Returns the current activitation state for the app
getActivationState(): AppActivationState;
```
## Events
``` javascript
// Triggered when the activation state changes
activationStateChangedEvent: SubscribableEvent<
(state: AppActivationState) => void>;
// Triggered when a low-memory warning occurs
memoryWarningEvent: SubscribableEvent<() => void>;
```
================================================
FILE: docs/docs/apis/clipboard.md
================================================
---
id: apis/clipboard
title: Clipboard
layout: docs
category: Interfaces
permalink: docs/apis/clipboard.html
next: apis/input
---
This interface provides access to the system's clipboard.
## Methods
``` javascript
// Retrieves the text from the clipboard (not supported on web)
getText(): SyncTasks.Promise<string>;
// Places the specified text on the clipboard
setText(text: string): void;
```
================================================
FILE: docs/docs/apis/input.md
================================================
---
id: apis/input
title: Input
layout: docs
category: Interfaces
permalink: docs/apis/input.html
next: apis/international
---
This interface provides events that are triggered when specific user input events occur.
## Events
``` javascript
// Triggered when the hardware back button is pressed (Android only).
// Events are triggered in the reverse order in which they were registered.
// Pass true to stop propagation.
backButtonEvent: SubscribableEvent<() => boolean>();
// Triggered when a hardware key up/down event occurs. Events are triggered
// in the reverse order in which they were registered. Pass true to stop
// propagation.
keyDownEvent: SubscribableEvent<(e: Types.KeyboardEvent) => boolean>();
keyUpEvent: SubscribableEvent<(e: Types.KeyboardEvent) => boolean>();
```
================================================
FILE: docs/docs/apis/international.md
================================================
---
id: apis/international
title: International
layout: docs
category: Interfaces
permalink: docs/apis/international.html
next: apis/linking
---
This interface provides interfaces related to globalization (g11n) and internationalization (i18n).
Some languages read right to left. In such cases, it's preferable for the UI to be "mirrored". Buttons that are on the left side of the screen in left-to-right languages are flipped to the right side of the screen for right-to-left languages. This mirroring is mostly automatic, but some code changes may be required --- for example, to flip icons or images that depend on placement. For more details about React Native's support for right-to-left languages, see this helpful [blog article](https://facebook.github.io/react-native/blog/2016/08/19/right-to-left-support-for-react-native-apps.html).
## Methods
``` javascript
// By default, right-to-left mirroring is enabled based on the
// OS or browser settings. This method allows the app to disable
// right-to-left mirroring.
allowRTL(allow: boolean): void;
// This method overrides the right-to-left setting of the system
// or browser, forcing right-to-left mirroring behavior if true.
forceRTL(force: boolean): void;
// Indicates whether the app is currently running in right-to-left mode.
isRTL(): boolean;
```
================================================
FILE: docs/docs/apis/linking.md
================================================
---
id: apis/linking
title: Linking
layout: docs
category: Interfaces
permalink: docs/apis/linking.html
next: apis/location
---
This interface handles deep linking in both incoming and outgoing directions. Incoming deep links instruct the app to take actions requested by other apps. Outgoing deep links instruct other apps to perform actions.
## Types
``` javascript
// Information used to invoke the default SMS app
interface SmsInfo {
phoneNumber?: string;
body?: string;
}
// Information used to invoke the default email app
interface EmailInfo {
to?: string[];
cc?: string[];
bcc?: string[];
subject?: string;
body?: string;
}
// Error returned by promise if the request fails
interface LinkingErrorInfo {
code: LinkingError;
url: string;
error?: string;
}
enum LinkingErrorCode {
NoAppFound = 0,
UnexpectedFailure = 1,
Blocked = 2,
InitialUrlNotFound = 3
}
```
## Methods
``` javascript
// Returns the URL that was used to launch the application
getInitialUrl(): SyncTasks.Promise<string>;
// Requests the URL to be opened by the default app for that protocol
// (e.g. http or https would typically open the system browser)
openUrl(url: string): SyncTasks.Promise<void>;
// Requests the default SMS app to be invoked
launchSms(smsData: SmsInfo): SyncTasks.Promise<void>;
// Requests the default mail app to be invoked
launchEmail(emailData: EmailInfo): SyncTasks.Promise<void>;
```
## Events
``` javascript
// Triggered when a new deep link request arrives
deepLinkRequestEvent: SubscribableEvent<(url: string) => void>;
```
================================================
FILE: docs/docs/apis/location.md
================================================
---
id: apis/location
title: Location
layout: docs
category: Interfaces
permalink: docs/apis/location.html
next: apis/modal
---
This interface provides access to geolocation data.
## Types
``` javascript
enum LocationErrorType {
// User has not granted the app access to location data
PermissionDenied,
// Geolocation information is not currently available
PositionUnavailable,
// Geolocation request has timed out
Timeout
}
interface PositionOptions {
// Enable high-accuracy mode; consumes more battery
enableHighAccuracy?: boolean;
// Number of milliseconds before timeout
timeout?: number;
// Max age (in milliseconds) before cached location is invalidated
maximumAge?: number;
}
// ID for a pending "watch" request
type LocationWatchId = number;
// Delegates that are invoked when call succeeds or fails
type LocationSuccessCallback = (position: Position) => void;
type LocationFailureCallback = (error: LocationErrorType) => void;
```
## Methods
``` javascript
// Indicates whether geolocation services are available on this platform
isAvailable(): boolean;
// Returns the current location
getCurrentPosition(options?: PositionOptions): SyncTasks.Promise<Position>;
// Requests a callback when the position changes; useful for geofencing
watchPosition(successCallback: LocationSuccessCallback,
errorCallback?: LocationFailureCallback,
options?: PositionOptions): SyncTasks.Promise<LocationWatchId>;
// Clears a location watch request
clearWatch(watchID: LocationWatchId): void;
```
================================================
FILE: docs/docs/apis/modal.md
================================================
---
id: apis/modal
title: Modal
layout: docs
category: Interfaces
permalink: docs/apis/modal.html
next: apis/network
---
This interface displays a view that overlays all other views rendered by the app, preventing any direct user interaction with the overlayed views.
A modal is identified by a caller-supplied "modal ID". These should be unique.
Only one modal can be displayed at a time. If a modal is already displayed, a newly-displayed modal is pushed onto the modal stack. When a modal is dismissed, it is popped off the stack, and the next modal becomes visible.
A modal can be displayed and dismissed using methods within the ReactXP.App namespace.
A modal covers the entire screen but is transparent. Its children define the visible contents and their position on the screen.
## Types
``` javascript
interface ModalOptions {
// Android, iOS, and Windows only.
// The id of the root view this modal is associated with.
// Defaults to the view set by UserInterface.setMainView();
rootViewId?: string;
}
```
## Methods
``` javascript
// Removes the modal from the modal stack, unmounting it if it's currently
// on the top of the stack and showing the next modal in the stack.
dismiss(modalId: string);
// Removes all modals from the modal stack.
dismissAll();
// Indicates whether the specified modal is in the modal stack. If no id provided indicates if some modal is displayed.
isDisplayed(modalId?: string): boolean;
// Pushes the modal onto the modal stack.
show(modal: React.ReactElement<ViewProps>, modalId: string, options?: ModalOptions);
```
## Sample Usage
``` javascript
const _modalId = 'ErrorDialog';
showDialog() {
let dialog = (
<RX.View style={ _styles.errorDialog }>
<RX.Text style={ _styles.descriptionText }>
'An error occurred'
</RX.Text>
<RX.Button style={ _styles.button }
onPress={ this._onOkButtonPress }>
<RX.Text style={ _styles.buttonText }>
'OK'
</RX.Text>
</RX.Button>
</RX.View>
);
RX.Modal.show(dialog, _modalId);
}
private _onOkButtonPress = (e: RX.Types.SyntheticEvent) => {
RX.Modal.dismiss(_modalId);
};
```
================================================
FILE: docs/docs/apis/network.md
================================================
---
id: apis/network
title: Network
layout: docs
category: Interfaces
permalink: docs/apis/network.html
next: apis/platform
---
This has been deprecated from ReactXP Core and moved to an extension (reactxp-netinfo) inline with the React Native Lean Core initiative.
================================================
FILE: docs/docs/apis/platform.md
================================================
---
id: apis/platform
title: Platform
layout: docs
category: Interfaces
permalink: docs/apis/platform.html
next: apis/popup
---
This interface provides information about the OS or runtime platform on which the app is running.
## Types
``` javascript
type PlatformType = 'web' | 'ios' | 'android' | 'windows';
```
## Methods
``` javascript
// Returns the platform type
getType(): Types.PlatformType;
// Returns the value in `specifics` for the current platform type.
select<T>(specifics: { [ platform in Types.PlatformType | 'default' ]?: T }): T | undefined;
```
================================================
FILE: docs/docs/apis/popup.md
================================================
---
id: apis/popup
title: Popup
layout: docs
category: Interfaces
permalink: docs/apis/popup.html
next: apis/statusbar
---
A popup is not technically a component. Rather, it's a collection of methods on the ReactXP.App namespace that allow the app to display a view that overlays a portion of the screen. Popups can be "anchored" to mounted components and follow them as they move around the screen (e.g. in reaction to scroll events).
When a popup is displayed, the caller specifies a PopupOptions structure that includes several callbacks, including a renderPopup method.
Popups by default will not act like a toggle. When Popup.show is called, it will always show the Popup. If a Popup is required to act like a toggle, PopupOptions.dismissIfShown should be set to true. In this case, if Popup.show is called once for a component, it will show the popup. A subsequent call from the same component will dismiss the popup and so on.
The overall dimensions of a popup are assumed to remain constant for the lifetime of the popup. This allows the dimensions to be measured once, and the popup can then be positioned relative to the anchor.
Popups are identified by a caller-specified ID that should be unique.
## Types
``` javascript
// 'context' mode makes it attempt to behave like a context menu -- defaulting
// to the lower right of the anchor element and working its way around. It is not supported
// with inner positioning and will throw an exception if used there.
type PopupPosition = 'top' | 'right' | 'bottom' | 'left' | 'context';
interface PopupOptions {
// Returns a mounted component instance that serves as the
// "anchor" for the popup. Often a button.
getAnchor: () => React.Component<any, any>;
// Renders the contents of the popup. This is called twice. The
// first time it is called, the parameters are all defaults
// (default position and 0 offset and dimensions). This allows
// the popup to be measured and positioned. It is called a second
// time with the position, offset and dimensions specified. This
// allows the method to modify the appearance based on these
// parameters. The dimensions should not be modified, however.
renderPopup: (anchorPosition: PopupPosition, anchorOffset: number,
popupWidth: number, popupHeight: number) => ReactNode;
// Returns a mounted component instance that controls the triggering
// of the popup. In the majority of cases, "anchor" of popup has
// handlers to control when the popup will be seen and this function
// is not required. In a few cases, where anchor is not the same as
// the whole component that triggers when the popup wil be seen,
// this can be used. For instance, a button combined with a chevron
// icon, which on click triggers a popup below the chevron icon. In
// this example, getElementTriggeringPopup() can return the container
// with button and chevron icon.
getElementTriggeringPopup?: () => React.Component<any, any>;
// Called when the popup is dismissed. Popup.isDisplayed() will return
// false for the popup being dismissed when this callback runs.
onDismiss?: () => void;
// Prioritized order of positions. Popup is positioned
// relative to the anchor such that it remains on screen.
// Default is ['bottom', 'right', 'top', 'left'].
positionPriorities?: string[];
// Position the popup inside its anchor.
// In this mode only the first position priority will be used.
useInnerPositioning?: boolean;
// On pressed handler to notify whoever wanted to create the popup
// that its anchor has been pressed.
// IMPORTANT NOTE: This handler may be called when the component is
// already unmounted as it uses a time delay accommodate
// fade-out animations.
onAnchorPressed?: (e: SyntheticEvent) => void;
// Determines if the anchor invoking the popup should behave like a toggle.
// If true, calling Popup.show will show the popup. A subsequent call
// will hide the popup. If false or undefined (default), calling Popup.show
// will always show the popup.
dismissIfShown?: boolean;
// By default, clicks or taps outside of a popup (unless they are on the
// anchor) will not dismiss the active popup. If true, this overrides the
// default behavior, in which case the popup must be dismissed explicitly.
preventDismissOnPress?: boolean;
// The popup may be left in the DOM after it's dismissed. This is a
// performance optimization to make the popup appear faster when it's shown
// again, intended for popups that tend to be shown repeatedly. Note that
// this is only a hint, so callers shouldn't rely on caching behavior.
cacheable?: boolean;
// Android, iOS, and Windows only.
// The id of the root view this popup is associated with.
// Defaults to the view set by UserInterface.setMainView();
rootViewId?: string;
}
```
## Methods
``` javascript
// Dismisses an already-displayed popup after a specified number
// of milliseconds
autoDismiss(popupId: string, dismissDelay: number = 0): void;
// Dismisses an already-displayed popup immediately
dismiss(popupId: string): void;
// Dismisses all popups immediately
dismissAll(): void;
// Displays a popup. Returns true if successful, false if the popup is
// already displayed
show(options: PopupOptions, popupId: string, showDelay: number = 0): boolean;
// Indicates whether the specified popup is displayed. If no id provided indicates if some popup is displayed.
isDisplayed(popupId?: string): boolean;
```
## Sample Usage
``` javascript
const _popupId = 'myPopup';
let _popupDisplayed = false;
onHoverStart() {
if (!this._popupDisplayed) {
this.displayPopup();
}
};
onHoverEnd() {
RX.Popup.autoDismiss(_popupId, 2000);
};
displayPopup() {
let popupOptions: RX.Types.PopupOptions = {
getAnchor: () => {
return this._mountedButton;
},
renderPopup: (anchorPosition: Types.PopupPosition, anchorOffset: number,
popupWidth: number, popupHeight: number) => {
return this._renderPopupView(anchorPosition,
anchorOffset, popupWidth, popupHeight);
},
positionPriorities: ['right', 'left', 'bottom', 'top'],
onDismiss: () => {
this._popupDisplayed = false;
}
};
RX.Popup.show(popupOptions, _popupId, 500);
this._popupDisplayed = true;
}
```
================================================
FILE: docs/docs/apis/statusbar.md
================================================
---
id: apis/statusbar
title: StatusBar
layout: docs
category: Interfaces
permalink: docs/apis/statusbar.html
next: apis/storage
---
This interface provides control over the system status bar at the top of the screen on mobile platforms.
## Methods
``` javascript
// Indicates whether the status bar overlays the app's main view (e.g. on iOS)
isOverlay(): boolean;
// Hides or shows the status bar with an optional animation
setHidden(hidden: boolean, showHideTransition: 'fade' | 'slide'): void;
// Specifies the status bar visual style
setBarStyle(style: 'default' | 'light-content' | 'dark-content',
animated: boolean): void;
// Specifies whether the network activity indicator is visible.
setNetworkActivityIndicatorVisible(value: boolean): void;
// Specifies the background color of the status bar (applies on Android only)
setBackgroundColor(color: string, animated: boolean): void;
// Specifies whether the status bar is translucent or transparent
setTranslucent(translucent: boolean): void;
```
================================================
FILE: docs/docs/apis/storage.md
================================================
---
id: apis/storage
title: Storage
layout: docs
category: Interfaces
permalink: docs/apis/storage.html
next: apis/userinterface
---
This interface provides a simple key-based local storage mechanism. If you need more powerful options to persist data and work with them, consider using ReactXP's [Database Extension](/reactxp/docs/extensions/database).
## Methods
``` javascript
// Clears all local storage keys
clear(): SyncTasks.Promise<void>;
// Returns an item by key
getItem(key: string): SyncTasks.Promise<string>;
// Deletes an item by key
removeItem(key: string): SyncTasks.Promise<void>;
// Sets or replaces the value of an item by key
setItem(key: string, value: string): SyncTasks.Promise<void>;
```
================================================
FILE: docs/docs/apis/userinterface.md
================================================
---
id: apis/userinterface
title: UserInterface
layout: docs
category: Interfaces
permalink: docs/apis/userinterface.html
next: apis/userpresence
---
This interface provides a variety of UI-related methods.
## Types
``` javascript
interface LayoutInfo {
x: number;
y: number;
width: number;
height: number;
}
```
## Methods
``` javascript
// Specifies the "main view" of the app, which is rendered on the full
// screen beneath any open modals or popups
setMainView(element: React.ReactElement<any>): void;
// Android & iOS only.
// Wrapper around RN.AppRegistry.registerComponent();
// IMPORTANT: Some APIs, e.g. Popup & Modal, require a string
// `reactxp_rootViewId` prop to be set on the component from the
// native-side.
registerRootView(viewKey: string, getComponentFunc: Function);
// Specifies whether custom scrollbars should be enabled (applies
// to web only)
useCustomScrollbars(enable: boolean): void;
// Indicates whether the screen is "high density" (e.g. retina displays)
isHighPixelDensityScreen(): boolean;
// Measure the location and dimensions of a mounted component relative
// to the window or one of its other containing views
measureLayoutRelativeToWindow(component: React.Component<any, any>):
SyncTasks.Promise<LayoutInfo>;
measureLayoutRelativeToAncestor(component: React.Component<any, any>,
ancestor: React.Component<any, any>): SyncTasks.Promise<LayoutInfo>;
// Measures the dimension of window (based on specified root view id or
// defaults to main window or screen, in the case
// of non-windowed platforms); the dimensions can also be obtained for any
// view (including your app's top-level view) using the onLayout
// callback
measureWindow(rootViewId?: string): Types.Dimensions;
// Indicates the "size multiplier" for text increase or decrease, which
// can be adjusted by users on some platforms; defaults to 1.0
getContentSizeMultiplier(): SyncTasks.Promise<number>;
// Dismisses the on-screen keyboard (on applicable platforms)
dismissKeyboard(): void;
// Enables native -> script touch event latency diagnostic events.
// When latency greater than latencyThresholdMs is observed, the
// touchLatencyEvent will fire (on applicable platforms).
enableTouchLatencyEvents(latencyThresholdMs: number): void;
// Returns true if the application is in the keyboard navigation state,
// when the user is using Tab key to navigate through the focusable
// elements (on applicable platforms).
isNavigatingWithKeyboard(): boolean;
```
## Events
``` javascript
// Triggered when the content size multiplier changes while the
// app is running
contentSizeMultiplierChangedEvent: SubscribableEvent<
(multiplier: number) => void>();
// Triggered when enableTouchLatencyEvents has been called and
// native -> script touch latency exceeding the threshold has
// been observed (on applicable platforms).
touchLatencyEvent: SubscribableEvent<
(observedLatencyMs: number) => void>();
// Triggered when the keyboard navigation state is changed
// (on applicable platforms).
keyboardNavigationEvent: SubscribableEvent<
(isNavigatingWithKeyboard: boolean) => void>();
```
================================================
FILE: docs/docs/apis/userpresence.md
================================================
---
id: apis/userpresence
title: UserPresence
layout: docs
category: Interfaces
permalink: docs/apis/userpresence.html
next: extensions/database
---
This interface provides information about whether the user is currently present. The technique for detecting presence differs by platform. On mobile platforms, the user is assumed to be present as long as the app is in the foreground. On web platforms, the user is assumed to be present if the window is in the foreground, the tab is foremost, and some mouse or keyboard activity has been seen within the window within the past minute.
# Methods
``` javascript
// Indicates whether the user is currently present
// On web platforms, it indicates whether the user has focused on the app and interacted with the app in the last 60 seconds
isUserPresent(): boolean;
```
## Events
``` javascript
// Triggered when the user presence changes
userPresenceChangedEvent: SubscribableEvent<
(isPresent: boolean) => void>();
```
================================================
FILE: docs/docs/components/activityindicator.md
================================================
---
id: components/activityindicator
title: ActivityIndicator
layout: docs
category: Components
permalink: docs/components/activityindicator.html
next: components/button
---
This component displays an animated "spinner" control that tells the user that an operation is pending. Animation continues as long as the component is displayed.
## Props
``` javascript
// Color of indicator
color: color;
// Number of ms to wait before displaying
deferTime: number = 0;
// Size of indicator (exact sizes are platform-specific)
size: 'large' | 'medium' | 'small' | 'tiny';
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
No methods
================================================
FILE: docs/docs/components/button.md
================================================
---
id: components/button
title: Button
layout: docs
category: Components
permalink: docs/components/button.html
next: components/gestureview
---
Like View, this component is a generic container for other components. However, it adds some additional capabilities -- support for presses or clicks and hovering.
## Props
In addition to the [common accessibility props](/reactxp/docs/accessibility.html), the following props are supported.
``` javascript
// Text to be used by screen readers
accessibilityLabel: boolean = false;
// Traits used to hint screen readers, etc.
accessibilityTraits: AccessibilityTrait | AccessibilityTrait[] = undefined;
// It is hard or impossible to tell by a reference to an instance of a component
// from where this component has been instantiated. You can assign this property
// and check instance.props.accessibilityId. For example accessibilityId is used
// in View's FocusArbitrator callback.
accessibilityId: string = undefined;
// Opacity value the button should animate to on button touch
activeOpacity: number = undefined; // iOS and Android only
// Id of an expandable element revealed by the button. Describes a relation
// between button and element to screen reader.
ariaControls: string = undefined; // Web only
// Specifies a unique id for an HTML element
// NOTE: This property may be going away in future versions.
id: string = undefined; // Web only
// Expose the element and/or its children as accessible to Screen readers
importantForAccessibility?: ImportantForAccessibility = ImportantForAccessibility.Yes;
// Delay in ms before onLongPress is called
delayLongPress: number = 1000;
// If disabled, touch and mouse input events are ignored
disabled: boolean = false;
// By default, opacity of a disabled element is 0.5. This value can be
// overriden with this property
disabledOpacity: number = undefined;
// Disable default opacity animation on touch of buttons
disableTouchOpacityAnimation: boolean = false; // iOS and Android only
// Should be focused when the component is mounted, see also View's arbitrateFocus
// property.
// WARNING: autoFocus=true means that this Button's requestFocus() method will be
// called, however calling requestFocus() might have no effect (for example the
// button is disabled), the application has to handle this either while setting
// this property or in the View's FocusArbitrator callback.
autoFocus: boolean = false;
// Called when VoiceOver is on and the user double tapped to
// activate a control
onAccessibilityTapIOS: (e: SyntheticEvent) => void; // iOS Only
// Focus Events
onFocus: (e: FocusEvent) => void = undefined;
onBlur: (e: FocusEvent) => void = undefined;
// Called when the mouse cursor enters or leaves the view bounds
onHoverStart: (e: SyntheticEvent) => void;
onHoverEnd: (e: SyntheticEvent) => void;
// Keyboard Events
onKeyPress: (e: KeyboardEvent) => void = undefined;
// Called when the user has pressed and held for a specified duration
onLongPress: (e: SyntheticEvent) => void;
// Called when the touch or mouse button is released within the
// bounds of the view and the press has not been canceled
onPress: (e: SyntheticEvent) => void;
// Called when touch is initiated or mouse button is pressed
onPressIn: (e: SyntheticEvent) => void;
// Called when touch or the mouse button is released or the
// user's finger or mouse cursor is no longer over the view
onPressOut: (e: SyntheticEvent) => void;
// Rasterize contents using offscreen bitmap (perf optimization)
shouldRasterizeIOS: boolean = false; // iOS only
// See below for supported styles
style: ButtonStyleRuleSet | ButtonStyleRuleSet[] = [];
// Keyboard tab order
tabIndex: number = undefined;
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Text for a tooltip
title: string = undefined;
// Background color that will be visible on button touch
underlayColor: string = undefined; // iOS and Android only
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the accessibility focus to the component.
focus(): void;
// The preferable way to focus the component. When requestFocus() is called,
// the actual focus() will be deferred, and if requestFocus() has been
// called for several components, only one of those components will actually
// get a focus() call. By default, last component for which requestFocus() is
// called will get a focus() call, but you can specify arbitrateFocus property
// of a parent View and provide the callback to decide which one of that View's
// descendants should be focused. This is useful for the accessibility: when
// consecutive focus() calls happen one after another, the next one interrupts
// the screen reader announcement for the previous one and the user gets
// confused. autoFocus property of focusable components also uses requestFocus().
requestFocus(): void;
// Blurs the component.
blur(): void;
```
================================================
FILE: docs/docs/components/gestureview.md
================================================
---
id: components/gestureview
title: GestureView
layout: docs
category: Components
permalink: docs/components/gestureview.html
next: components/image
---
This component provides support for common touch gestures -- tapping, double-tapping, long-pressing, panning, and pinching. It also handles common mouse-based gestures including double clicking and scroll wheel input.
Information about pending gestures is returned through event handlers. A caller can specify which gestures they are interested in by specifying those event handlers. For example, if you are interested in double taps and horizontal pans, provide an onDoubleTap and onPanHorizontal handler.
## Props
``` javascript
// Alternate text for screen readers.
accessibilityLabel: string = undefined;
// Traits used to hint screen readers, etc.
accessibilityTraits: AccessibilityTrait | AccessibilityTrait[] = undefined;
// Expose the element and/or its children as accessible to Screen readers
importantForAccessibility?: ImportantForAccessibility =
ImportantForAccessibility.Yes;
// Gestures and attributes that apply only to touch inputs
onPinchZoom: (gestureState: MultiTouchGestureState) => void = undefined;
onRotate: (gestureState: MultiTouchGestureState) => void = undefined;
// Gestures and attributes that apply only to mouse inputs
onScrollWheel: (gestureState: ScrollWheelGestureState) => void = undefined;
mouseOverCursor: GestureMouseCursor = undefined;
// Gestures and attributes that apply to either touch or mouse inputs
onPan: (gestureState: PanGestureState) => void = undefined;
onPanVertical: (gestureState: PanGestureState) => void = undefined;
onPanHorizontal: (gestureState: PanGestureState) => void = undefined;
onTap: (gestureState: TapGestureState) => void = undefined;
onDoubleTap: (gestureState: TapGestureState) => void = undefined;
onContextMenu: (gestureState: TapGestureState) => void = undefined;
onLongPress: (gestureState: TapGestureState) => void = undefined;
// Focus Events
onFocus: (e: FocusEvent) => void = undefined;
onBlur: (e: FocusEvent) => void = undefined;
// Keyboard Events
onKeyPress: (e: KeyboardEvent) => void = undefined;
// We can set vertical or horizontal as preferred
preferredPan: PreferredPanGesture = undefined; // Horizontal or vertical
// How many pixels (in either horizontal or vertical direction) until
// pan is recognized? Default is 10. Can be any value > 0.
panPixelThreshold: number = undefined;
// Something else wants to become responder. Should this view
// release the responder? Setting true allows release.
releaseOnRequest: boolean = false;
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the accessibility focus to the component.
focus(): void;
```
================================================
FILE: docs/docs/components/image.md
================================================
---
id: components/image
title: Image
layout: docs
category: Components
permalink: docs/components/image.html
next: components/link
---
This component displays an image, which can come from a local source or from the network. It supports JPEG, GIF and PNG formats.
If child elements are specified, the image acts as a background, and the children are rendered on top of it.
If headers contains 'Cache-Control: max-stale' with no value specified and the image fails to load, the component tries again passing cache: 'only-if-cached' to the underlying native Image (iOS only). This way the app can render otherwise inaccessible stale cached images.
## Props
``` javascript
// Alternate text to display if the image cannot be loaded
// or by screen readers
accessibilityLabel: string = undefined;
// HTTP headers to include when fetching the URL.
headers: { [headerName: string]: string } = undefined;
// Called when an error occurs that prevents the image from loading
onError: (err?: Error) => void;
// Called when the image successfully loads
onLoad: (size: Dimensions) => void;
// Android-specific resize property
resizeMethod: 'auto' | 'resize' | 'scale' = 'auto'; // Android only
// Determines how to resize the image if its natural size
// does not match the size of the container
// Note: In Web version, 'auto' doesn't scale down image
// if width/height smaller than the original image size
resizeMode: 'stretch' | 'contain' | 'cover' | 'auto' | 'repeat' = 'contain';
// URL to image
source: string = undefined;
// See below for supported styles
style: ImageStyleRuleSet | ImageStyleRuleSet[] = [];
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Tooltip for image
title: string = undefined;
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Returns the native width and height of the image. Can be called only after
// the onLoad has been called and only while the component is mounted.
getNativeHeight(): number;
getNativeWidth(): number;
```
## Static Methods
```javascript
// Prefetches a remote image and stores it in a cache. This can decrease the
// amount of time it takes when you later want to show the image because the
// image only has to be fetched from the local cache rather than over the
// network.
prefetch(url: string): Promise<boolean>;
// Similarly to [prefetch], this method loads a remote image and stores it in
// a cache. If prefetching was successful it will also get image dimensions. It will be
// useful if you need [getNativeHeight] or [getNativeWidth] after image
// was loaded because you will get this info together with prefetching and before
// you actually need to show the image.
getMetadata(url: string): Promise<ImageMetadata>
```
================================================
FILE: docs/docs/components/link.md
================================================
---
id: components/link
title: Link
layout: docs
category: Components
permalink: docs/components/link.html
next: components/picker
---
This component displays a hyperlink. On the web, it translates to an <a> tag.
## Props
``` javascript
// It is hard or impossible to tell by a reference to an instance of a component
// from where this component has been instantiated. You can assign this property
// and check instance.props.accessibilityId. For example accessibilityId is used
// in View's FocusArbitrator callback.
accessibilityId: string = undefined;
// Should fonts be scaled according to system setting?
allowFontScaling: boolean = true; // Android and iOS only
// Should be focused when the component is mounted, see also View's arbitrateFocus
// property.
autoFocus: boolean = false;
// For non-zero values, truncates with ellipsis if necessary
numberOfLines: number = 0;
// Called when the mouse cursor enters or leaves the view bounds
onHoverStart: (e: SyntheticEvent) => void = undefined;
onHoverEnd: (e: SyntheticEvent) => void = undefined;
// Event called when the touch or mouse button is released
// within the bounds of the view and the press has not been canceled
onPress: (e: SyntheticEvent, url: string) => void = undefined;
// Event called when a long touch or mouse (> 1000ms) button is released
// within the bounds of the view and the press has not been canceled
onLongPress: (e: SyntheticEvent, url:string) => void = undefined;
// Event called when context menu is triggered, either by
// right mouse button click or context menu key
onContextMenu: (e: MouseEvent) => void = undefined;
// Can the link be included in a text selection?
selectable: boolean = false;
// See below for supported styles
style: LinkStyleRuleSet | LinkStyleRuleSet[] = [];
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Text for a tooltip
title: string = undefined;
// URL to follow for hyperlink
url: string;
```
## Styles
[**Text Styles**](/reactxp/docs/styles.html#text-style-attributes)
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the focus to the component.
focus(): void;
// The preferable way to focus the component. When requestFocus() is called,
// the actual focus() will be deferred, and if requestFocus() has been
// called for several components, only one of those components will actually
// get a focus() call. By default, last component for which requestFocus() is
// called will get a focus() call, but you can specify arbitrateFocus property
// of a parent View and provide the callback to decide which one of that View's
// descendants should be focused. This is useful for the accessibility: when
// consecutive focus() calls happen one after another, the next one interrupts
// the screen reader announcement for the previous one and the user gets
// confused. autoFocus property of focusable components also uses requestFocus().
requestFocus(): void;
// Blurs the component.
blur(): void;
```
================================================
FILE: docs/docs/components/picker.md
================================================
---
id: components/picker
title: Picker
layout: docs
category: Components
permalink: docs/components/picker.html
next: components/scrollview
---
This component displays a control that allows the user to pick from a list of items.
## Types
``` javascript
interface PickerPropsItem {
label: string;
value: string;
}
```
## Props
``` javascript
// List of items to be displayed in the picker
items: PickerPropsItem[] = [];
// 'dialog': Show a modal dialog
// 'dropdown': Shows a dropdown anchored to the picker view
mode: 'dialog' | 'dropdown' = 'dialog'; // Android only
// Invoked when the selected value changes
onValueChange: (itemValue: string, itemPosition: number) => void;
// Initially-selected item
selectedValue: string;
// See below for supported styles
style: PickerStyleRuleSet | PickerStyleRuleSet[] = [];
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
```
## Styles
``` javascript
**Text Color**
color: 'string';
```
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
No methods
## Sample Usage
``` javascript
const pickerItems: RX.Types.PickerPropsItem[] = [
{
label: 'Cool',
value: 'cool'
},
{
label: 'Super',
value: 'super'
},
{
label: 'Great',
value: 'great'
}
];
class MyComponent extends RX.Component<null, { selectedValue: string }> {
constructor() {
super();
this.state = {
selectedValue: 'cool'
}
}
render(): JSX.Element {
return (
<RX.View>
<RX.Text>
{ 'How are you feeling?' }
</RX.Text>
<RX.Picker
items={ pickerItems }
selectedValue={ this.state.selectedValue }
onValueChange={ this._onValueChange }
/>
</RX.View>
);
}
private _onValueChange = (itemValue: string, itemIndex: number) => {
this.setState({ selectedValue: itemValue });
}
}
```
================================================
FILE: docs/docs/components/scrollview.md
================================================
---
id: components/scrollview
title: ScrollView
layout: docs
category: Components
permalink: docs/components/scrollview.html
next: components/text
---
Like a View, this component is a container for other components. However, it supports scrolling (panning) and zooming so it is possible to view larger contents.
ScrollViews must have a bounded height (or width, if it scrolls horizontally) since its children are of unbounded height (or width). To bound the dimensions of a ScrollView, either set the height/width directly or make sure that its parent's height/width is bounded.
## Props
``` javascript
// Should scroll bar bounce when user hits the bounds?
bounces: boolean = true; // iOS only
// Controls the scroll direction. When false or undefined, only vertical scroll is enabled, when true, only horizontal scroll is enabled
horizontal: boolean = false;
// When the user scrolls the view, how should the on-screen keyboard react?
keyboardDismissMode: 'none' | 'interactive' | 'on-drag'; // Native only
// Should the on-screen keyboard remain visible when the user taps
// the scroll view?
keyboardShouldPersistTaps: boolean | 'always' | 'never' | 'handled' = 'never'; // Native only
// Invoked when the contents of the scroll view change
onContentSizeChange: (width: number, height: number) => void = undefined;
// Focus Events
onFocus: (e: FocusEvent) => void = undefined;
onBlur: (e: FocusEvent) => void = undefined;
// Keyboard Events
onKeyPress: (e: KeyboardEvent) => void = undefined;
// Invoked when view dimensions or position changes
onLayout: (e: ViewOnLayoutEvent) => void = undefined;
// Called when the scroll position changes
onScroll: (newScrollTop: number, newScrollLeft: number) => void = undefined;
// Called when the user starts or stops scrolling (touch-based systems only)
onScrollBeginDrag: () => void = undefined;
onScrollEndDrag: () => void = undefined;
// Animation helpers to allow usage of the RN.Animated.Event system through ReactXP.
// AnimatedValue objects hooked up to either (or both) of these properties will be automatically
// hooked into the onScroll handler of the scrollview and .setValue() will be called on them
// with the updated values. On supported platforms, it will use RN.Animated.event() to do
// a native-side/-backed coupled animation.
scrollXAnimatedValue?: RX.Types.AnimatedValue;
scrollYAnimatedValue?: RX.Types.AnimatedValue;
// Android only property to control overScroll mode
overScrollMode?: 'auto' | 'always' | 'never';
// Snap to page boundaries?
pagingEnabled: boolean = false; // Android & iOS only
snapToInterval: number = undefined; // iOS only
// Is scrolling enabled?
scrollEnabled: boolean = true;
// Minimum duration (in milliseconds) between scroll events
scrollEventThrottle: number = undefined;
// Inset (in pixels) of scroll indicator from top/bottom (vertical)
// or left/right (horizontal)
scrollIndicatorInsets: ScrollIndicatorInsets = undefined;
// If true, this scroll bar scrolls to the top when the user
// taps on the status bar.
scrollsToTop: boolean = false; // iOS only
// Should the indicator be displayed?
showsHorizontalScrollIndicator: boolean = [same as horizontal];
showsVerticalScrollIndicator: boolean = [same as horizontal];
// See below for supported styles
style: ViewStyleRuleSet | ViewStyleRuleSet[] = [];
// Windows-only property to control tab navigation inside the view
tabNavigation?: 'local' | 'cycle' | 'once';
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the accessibility focus to the component.
focus(): void;
// Sets the absolute top or left position (measured in pixels) of the
// viewport within the scroll view. Optionally animates from the current
// position.
setScrollLeft(scrollLeft: number, animate: boolean): void;
setScrollTop(scrollTop: number, animate: boolean): void;
```
================================================
FILE: docs/docs/components/text.md
================================================
---
id: components/text
title: Text
layout: docs
category: Components
permalink: docs/components/text.html
next: components/textinput
---
This component displays basic text. Its children must be a string literal or a series of children that are either Text components or View components with a fixed height and width.
Unlike other ReactXP components, some of the style attributes for an Text cascade to its children. In the following example, the title and body both inherit the styles from their parent RX.Text component, but they can also override specific style elements.
Another difference between Text and other components is that Text children are not layed out according to flexbox layout rules. Instead, an inline text layout is used.
## Props
``` javascript
// Should fonts be scaled according to system setting?
allowFontScaling: boolean = true; // Android and iOS only
// When numberOfLines is set, this prop defines how text will be truncated.
// 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..."
ellipsizeMode: 'head' | 'middle' | 'tail'; // Android & iOS only
// Specifies a unique id for an HTML element.
// NOTE: This property may be going away in future versions.
id: string = undefined; // Web only
// Expose the element and/or its children as accessible to Screen readers
importantForAccessibility: ImportantForAccessibility =
ImportantForAccessibility.Yes;
// It is hard or impossible to tell by a reference to an instance of a component
// from where this component has been instantiated. You can assign this property
// and check instance.props.accessibilityId. For example accessibilityId is used
// in View's FocusArbitrator callback.
accessibilityId: string = undefined;
// Should be focused when the component is mounted, see also View's arbitrateFocus
// property.
// WARNING: autoFocus=true means that this Text's requestFocus() method will be
// called, however calling requestFocus() for Text might make sense only on mobile
// for the accessibility reasons, on web it has no effect, the application has to
// handle this either while setting this property or in the View's FocusArbitrator
// callback.
autoFocus: boolean = false;
// For non-zero values, truncates with ellipsis if necessary. Web platform
// doesn't support values greater than 1. Web platform may also not truncate
// properly if text contains line breaks, so it may be necessary to replace
// line breaks before rendering.
numberOfLines: number = 0;
// Mouse & Touch Events
onPress?: (e: SyntheticEvent) => void = undefined;
onContextMenu?: (e: SyntheticEvent) => void = undefined;
// Is the text selectable (affects mouse pointer and copy command)
selectable: boolean = false;
// See below for supported styles
style: TextStyleRuleSet | TextStyleRuleSet[] = [];
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
```
## Styles
[**Text Styles**](/reactxp/docs/styles.html#text-style-attributes)
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the accessibility focus to the component.
focus(): void;
// The preferable way to focus the component. When requestFocus() is called,
// the actual focus() will be deferred, and if requestFocus() has been
// called for several components, only one of those components will actually
// get a focus() call. By default, last component for which requestFocus() is
// called will get a focus() call, but you can specify arbitrateFocus property
// of a parent View and provide the callback to decide which one of that View's
// descendants should be focused. This is useful for the accessibility: when
// consecutive focus() calls happen one after another, the next one interrupts
// the screen reader announcement for the previous one and the user gets
// confused. autoFocus property of focusable components also uses requestFocus().
requestFocus(): void;
// Blurs the component.
blur(): void;
// When selection is enabled, retrieves the selected text.
getSelectedText(): string; // Windows only
```
## Sample Usage
``` javascript
<RX.Text style={ _styles.defaultText }>
<RX.Text style={ _styles.titleText }>
{ this.props.title }
</RX.Text>
<RX.Text style={ _styles.bodyText }>
{ this.props.body }
</RX.Text>
</RX.Text>
```
``` javascript
static _styles = {
redBox: RX.Styles.createViewStyle({
width: 10,
height: 10,
backgroundColor: 'red'
})
}
<RX.Text style={ _styles.defaultText } numberOfLines={ 1 }>
<RX.Text> { 'Red box ' } </RX.Text>
<RX.View style={ _styles.redBox } />
<RX.Text> { ' inlined view example' } </RX.Text>
</RX.Text>
```
================================================
FILE: docs/docs/components/textinput.md
================================================
---
id: components/textinput
title: TextInput
layout: docs
category: Components
permalink: docs/components/textinput.html
next: components/view
---
This component provides basic text input capabilities.
It can be used in one of two modes. In the first mode, the contents of the text input are static and are specified by the `value` prop. Any attempt to modify the value will result in `onChangeText`, which allows the owning component to re-render with an updated `value`. In the second mode, `value` is unspecified, and the text input value is allowed to be modified as long as it remains mounted. In this mode, the caller can specify an optional `defaultValue` prop to specify the initial value.
## Props
In addition to the [common accessibility props](/reactxp/docs/accessibility.html), the following props are supported.
``` javascript
// Text to be used by screen readers
accessibilityLabel: boolean = false;
// It is hard or impossible to tell by a reference to an instance of a component
// from where this component has been instantiated. You can assign this property
// and check instance.props.accessibilityId. For example accessibilityId is used
// in View's FocusArbitrator callback.
accessibilityId: string = undefined;
// Should fonts be scaled according to system setting?
allowFontScaling: boolean = true; // Android and iOS only
// Auto-capitalization mode
autoCapitalize: 'none' | 'sentences' | 'words' | 'characters';
// Should auto-correction be applied to contents?
autoCorrect: boolean = true;
// Should be focused when the component is mounted, see also View's arbitrateFocus
// property.
// WARNING: autoFocus=true means that this TextInput's requestFocus() method will be
// called, however calling requestFocus() might have no effect (for example the
// input is disabled), the application has to handle this either while setting this
// property or in the View's FocusArbitrator callback.
autoFocus: boolean = false;
// Should focus be lost after submitting?
blurOnSubmit: boolean = false;
// iOS and Windows only property for controlling when the clear button
// should appear on the right side of the text view. Default behavior
// dependends on platform: equivalent to 'never' on iOS, and 'always'
// on Windows.
clearButtonMode: 'never' | 'while-editing' | 'unless-editing' | 'always';
// Initial value that will change when the user starts typing
defaultValue: string = undefined;
// Disable full screen editor mode?
disableFullscreenUI: boolean = false; // Android-specific
// Can text be edited by the user?
editable: boolean = true;
// iOS-only prop for controlling the keyboard appearance
keyboardAppearance: 'default' | 'light' | 'dark';
// On-screen keyboard type to display
keyboardType: 'default' | 'numeric' | 'email-address' | 'number-pad';
// Maximum character count
maxLength: number = undefined;
// Should the control support multiple lines of text?
multiline: boolean = false;
// Called when the control loses focus
onBlur: () => void = undefined;
// Called when the text value changes
onChangeText: (newValue: string) => void = undefined;
// Called when the control obtains focus
onFocus: () => void = undefined;
// Called on a key event
onKeyPress: (e: KeyboardEvent) => void = undefined;
// Called when text is pasted into the control (not currently
// supported on iOS or Android)
onPaste: (e: ClipboardEvent) => void = undefined;
// Called when the selection scrolls due to overflow
onScroll: (newScrollLeft: number, newScrollTop: number) => void = undefined;
// Called when the selection range or insertion point location changes
onSelectionChange: (start: number, end: number) => void = undefined;
// Called when the text input submit button is pressed; invalid if
// multiline is true
onSubmitEditing: () => void = undefined;
// Placeholder text to dislpay when input is empty
placeholder: string = undefined;
// Color of placeholder text
placeholderTextColor: color = '#ccc';
// iOS and android prop for controlling return key type
returnKeyType: 'done' | 'go' | 'next' | 'search' | 'send';
// Obscure the text input (for passwords)?
secureTextEntry: boolean = false;
// Should spell checking be applied to contents?
spellCheck: boolean = [value of autoCorrect];
// See below for supported styles
style: TextInputStyleRuleSet | TextInputStyleRuleSet[] = [];
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Text for a tooltip
title: string = undefined;
// If defined, the control value is forced to match this value;
// if undefined, control value can be modified by the user
value: string = undefined;
```
## Styles
[**Text Styles**](/reactxp/docs/styles.html#text-style-attributes)
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Forces the control to give up focus
blur(): void;
// Gives the control focus. For mobile, use setAccessibilityFocus()
// for setting screen reader focus
focus(): void;
// The preferable way to focus the component. When requestFocus() is called,
// the actual focus() will be deferred, and if requestFocus() has been
// called for several components, only one of those components will actually
// get a focus() call. By default, last component for which requestFocus() is
// called will get a focus() call, but you can specify arbitrateFocus property
// of a parent View and provide the callback to decide which one of that View's
// descendants should be focused. This is useful for the accessibility: when
// consecutive focus() calls happen one after another, the next one interrupts
// the screen reader announcement for the previous one and the user gets
// confused. autoFocus property of focusable components also uses requestFocus().
requestFocus(): void;
// Gives the control accessibility-only focus
// E.g. screen reader focus is needed, but popping up of native
// keyboard is undesirable
setAccessibilityFocus(): void;
// Does control currently have focus?
isFocused(): boolean;
// Extends selection to include all contents
selectAll(): void;
// Selects a range of text
selectRange(start: number, end: number): void;
// Returns the current selection range
getSelectionRange(): { start: number, end: number };
// Sets the current value
setValue(value: string): void;
```
================================================
FILE: docs/docs/components/view.md
================================================
---
id: components/view
title: View
layout: docs
category: Components
permalink: docs/components/view.html
next: components/webview
---
This component is a generic container for other components.
## Props
In addition to the [common accessibility props](/reactxp/docs/accessibility.html), the following props are supported.
``` javascript
// Alternate text for screen readers.
// If not defined, title prop is used.
accessibilityLabel: string = undefined;
// Traits used to hint screen readers, etc.
accessibilityTraits: AccessibilityTrait | AccessibilityTrait[] = undefined;
// Region for accessibility mechanisms
accessibilityLiveRegion: AccessibilityLiveRegion =
undefined; // Android and web only
// It is hard or impossible to tell by a reference to an instance of a component
// from where this component has been instantiated. You can assign this property
// and check instance.props.accessibilityId. For example accessibilityId is used
// in View's FocusArbitrator callback.
accessibilityId: string = undefined;
// Opacity value the button should animate to, on touch on views that
// have onPress handlers
activeOpacity: number = undefined; // iOS and Android only
// Animation of children
// - Every child must have a `key`.
// - String refs aren't supported on children. Only callback refs are.
animateChildEnter: boolean = false;
animateChildLeave: boolean = false;
animateChildMove: boolean = false;
// Id of an element that describes the view for screenreader.
ariaLabelledBy?: string = undefined; // Web only
// A custom role description to be read by the screen readers.
ariaRoleDescription?: string = undefined; // Web only
// Block touches for this component and all of its children
blockPointerEvents: boolean = false;
// Disable default opacity animation on touch on views that have
// onPress handlers
disableTouchOpacityAnimation: boolean = false; // iOS and Android only
// Specifies a unique id for an HTML element
// NOTE: This property may be going away in future versions.
id: string = undefined; // Web only
// Ignore clicks and other mouse events, allowing children or
// components behind to receive them
ignorePointerEvents: boolean = false;
// Expose the element and/or its children as accessible to Screen readers
importantForAccessibility?: ImportantForAccessibility = Auto;
// When the keyboard navigation is happening, restrict the focusable
// elements within this view. Useful for popups and modals, you
// might want to prevent the focus from going outside of the popup or
// modal. The views with restrictFocusWithin are stacked and the last
// mounted view is a winner. This means if you, for example, have
// restricted the focus within some modal, and you have a popup (which
// also desires for a restricted focus) inside this modal, the popup
// will get the restriction, but when dismissed, the restriction will
// be restored for the modal. See also the companion method
// setFocusRestricted() below.
// WARNING: For the sake of performance, this property is readonly and
// changing it during the View life cycle will produce an error.
restrictFocusWithin: boolean = false;
// When the keyboard navigation is happening, do not focus on this view
// and on all focusable elements inside this view. See also the companion
// method setFocusLimited() below.
// Useful for the list items, allows to skip the consecutive focusing on
// one list item (and item's internal focusable elements) after another
// using the Tab key and implement the switching between the items using
// the arrow keys (or using some other behaviour).
// When limitFocusWithin=LimitFocusType.Limited, the View and the focusable
// components inside the View get both tabIndex=-1 and aria-hidden=true.
// When limitFocusWithin=LimitFocusType.Accessible, the View and the focusable
// components inside the View get only tabIndex=-1.
// WARNING: For the sake of performance, this property is readonly and
// changing it during the View life cycle will produce an error.
limitFocusWithin: LimitFocusType = LimitFocusType.Unlimited;
// Should be focused when the component is mounted, see also arbitrateFocus
// property below.
// WARNING: autoFocus=true means that this View's requestFocus() method will be
// called, however calling requestFocus() might have no effect (for example on web
// View is focusable only when tabIndex is specified), the application has to handle
// this either while setting this property or in the View's FocusArbitrator callback.
autoFocus: boolean = false;
// When multiple components with autoFocus=true inside this View are mounting at
// the same time, and/or multiple components inside this view have received focus()
// call during the same render cycle, this callback will be called so that it's
// possible for the application to decide which one should actually be focused.
arbitrateFocus: FocusArbitrator = undefined;
// Additional invisible DOM elements will be added inside the view
// to track the size changes that are performed behind our back by
// the browser's layout engine faster (ViewBase checks for the layout
// updates once a second and sometimes it's not fast enough)
importantForLayout: boolean = false; // web only
// Mouse-specific Events
// For drag specific events, if onDragStart is present, the view is draggable.
// onDragStart/onDrag/onDragEnd are source specific events
// onDragEnter/onDragOver/onDragLeave/onDrop are destination specific events
onDragStart: (e: DragEvent) => void = undefined;
onDrag: (e: DragEvent) => void = undefined;
onDragEnd: (e: DragEvent) => void = undefined;
onDragEnter: (e: DragEvent) => void = undefined;
onDragOver: (e: DragEvent) => void = undefined;
onDragLeave: (e: DragEvent) => void = undefined;
onDrop: (e: DragEvent) => void = undefined;
onMouseEnter: (e: MouseEvent) => void = undefined;
onMouseLeave: (e: MouseEvent) => void = undefined;
onMouseMove: (e: MouseEvent) => void = undefined;
onMouseOver: (e: MouseEvent) => void = undefined;
// Mouse & Touch Events
onContextMenu: (e: React.SyntheticEvent) => void;
onPress: (e: SyntheticEvent) => void = undefined;
// Focus Events
onFocus: (e: FocusEvent) => void = undefined;
onBlur: (e: FocusEvent) => void = undefined;
// Keyboard Events
onKeyPress: (e: KeyboardEvent) => void = undefined;
// Touch-specific Events
onTouchStartCapture: (e: React.SyntheticEvent) => void = undefined;
onTouchMoveCapture: (e: React.SyntheticEvent) => void = undefined;
onLongPress: (e: SyntheticEvent) => void = undefined;
onMoveShouldSetResponder: (e: React.SyntheticEvent) => boolean =
undefined;
onMoveShouldSetResponderCapture: (e: React.SyntheticEvent) => boolean =
undefined;
onResponderGrant: (e: React.SyntheticEvent) => void = undefined;
onResponderReject: (e: React.SyntheticEvent) => void = undefined;
onResponderRelease: (e: React.SyntheticEvent) => void = undefined;
onResponderStart: (e: React.TouchEvent) => void = undefined;
onResponderMove: (e: React.TouchEvent) => void = undefined;
onResponderEnd: (e: React.TouchEvent) => void = undefined;
onResponderTerminate: (e: React.SyntheticEvent) => void = undefined;
onResponderTerminationRequest: (e: React.SyntheticEvent) => boolean =
undefined;
onStartShouldSetResponder: (e: React.SyntheticEvent) => boolean =
undefined;
onStartShouldSetResponderCapture: (e: React.SyntheticEvent) => boolean =
undefined;
// Other Events
onLayout: (e: ViewOnLayoutEvent) => void = undefined;
// Rasterize contents using offscreen bitmap (perf optimization)
shouldRasterizeIOS: boolean = false; // iOS only
// Keyboard tab order
tabIndex: number = undefined;
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Text for a tooltip
title: string = undefined;
// See below for supported styles
style: ViewStyleRuleSet | ViewStyleRuleSet[] = [];
// Should use hardware or software rendering?
viewLayerTypeAndroid: 'none' | 'software' | 'hardware'; // Android only property
// Background color that will be visible on touch on views that have onPress
// handlers
underlayColor: string = undefined; // iOS and Android only
// When true
// - renders children within the safe area boundaries of a device, i.e. with
// padding with ensure the children don't cover navigation bars,
// toolbars etc.
// - Applies a style of { flex: 1, alignSelf: 'stretch' } to this view.
// - Some ViewProps may be ignored.
useSafeInsets: boolean = false; // iOS only
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Sets the focus to the component.
focus(): void;
// The preferable way to focus the component. When requestFocus() is called,
// the actual focus() will be deferred, and if requestFocus() has been
// called for several components, only one of those components will actually
// get a focus() call. By default, last component for which requestFocus() is
// called will get a focus() call, but you can specify arbitrateFocus property
// of a parent View and provide the callback to decide which one of that View's
// descendants should be focused. This is useful for the accessibility: when
// consecutive focus() calls happen one after another, the next one interrupts
// the screen reader announcement for the previous one and the user gets
// confused. autoFocus property of focusable components also uses requestFocus().
requestFocus(): void;
// Blurs the component.
blur(): void;
// The focus does not go outside the view with restrictFocusWithin by default,
// setFocusRestricted() allows to turn this restriction off and back on.
setFocusRestricted(restricted: boolean): void; // web only
// The focus does not go inside the view with limitFocusWithin by default,
// setFocusLimited() allows to turn this limitation off and back on.
setFocusLimited(limited: boolean): void; // web only
```
================================================
FILE: docs/docs/components/webview.md
================================================
---
id: components/webview
title: WebView
layout: docs
category: Components
permalink: docs/components/webview.html
next: apis/alert
---
This has been deprecated from ReactXP Core and moved to an extension (reactxp-webview) inline with the React Native Lean Core initiative.
================================================
FILE: docs/docs/extensions/database.md
================================================
---
id: extensions/database
title: Database
layout: docs
category: Extensions
permalink: docs/extensions/database.html
next: extensions/imagesvg
---
ReactXP provides a [Storage API](/reactxp/docs/apis/storage) for reading and writing simple key/value pairs. Many apps have more complex storage requirements. For this, we developed a no-SQL database wrapper that works on React Native and on browsers. The solution isn't tied to ReactXP, but they work well together.
For more details, refer to the [NoSqlProvider](https://github.com/Microsoft/NoSQLProvider) GitHub site.
To install: ```npm install nosqlprovider```
================================================
FILE: docs/docs/extensions/imagesvg.md
================================================
---
id: extensions/imagesvg
title: ImageSvg
layout: docs
category: Extensions
permalink: docs/extensions/imagesvg.html
next: extensions/navigator
---
This component displays a vector image (SVG format). Props control the fill color, stroke color and stroke width.
The path(s) are specified using the standard SVG string format. Paths must be specified in a nested SvgPath component instance. Multiple SvgPath children can be specified, each with different stroke and fill parameters. SvgRect children
are also supported at this time, with the limited props available in react-native-svg.
To install: ```npm install reactxp-imagesvg``` or ```yarn add reactxp-imagesvg```
## ImageSvg Props
``` javascript
// See below for supported styles
style: RX.ImageSvgStyleRuleSet | RX.ImageSvgStyleRuleSet[] = [];
// Color and opacity of fill; default values are provided by SVG
fillColor: color;
fillOpacity: number;
// Preserve aspect ratio or stretch?
preserveAspectRatio: boolean = true;
// Color, width and opacity of stroke; default values are provided by SVG
strokeColor: color;
strokeWidth: number;
strokeOpacity: number;
// Tooltip for image
title: string = undefined;
// Bounding box
viewBox: string = undefined;
// Shadow
webShadow: boolean = false; // web-specific
```
## SvgCommon Props
These props apply to all of the sub-SVG-element types below:
``` javascript
// Color and opacity of fill; default values are provided by SVG
fillColor: color;
fillOpacity: number;
// Color, width and opacity of stroke; default values are provided by SVG
strokeColor: color;
strokeWidth: number;
strokeOpacity: number;
```
## SvgPath Props
``` javascript
// Path definition string
d: string = undefined;
```
## SvgRect Props
``` javascript
// Position and dimension information for the rect
x: number;
y: number;
width: number;
height: number;
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
No methods
## Sample Usage
``` javascript
import { default as RXImageSvg, SvgPath as RXSvgPath, Types as SvgTypes }
from 'reactxp-imagesvg';
return (
<RXImageSvg height={ 20 } width={ 20 }>
<RXSvgPath
fillColor={ 'orange' }
d={ 'M 0 0 h 20 v 20 z' }
/>
<RXSvgRect
fillColor={ 'blue' }
x={ 10 }
y={ 20 }
width={ 30 }
height={ 40 }
/>
</RXImageSvg>
);
```
================================================
FILE: docs/docs/extensions/navigator.md
================================================
---
id: extensions/navigator
title: Navigator
layout: docs
category: Extensions
permalink: docs/extensions/navigator.html
next: extensions/netinfo
---
This component provides a way for the app to present a virtual stack of "cards", allowing the user to push or pop those cards onto the stack in an animated manner. The caller can control the animation type and direction.
When a new card is presented, the Navigator calls the renderScene method, allowing the caller to render the contents. Cards are identified by "routes", which contain a unique ID and configuration parameters that control the behavior of the transition.
When a Navigator is first mounted, the stack is empty. The caller must wait for the mount to complete, then specify the list of routes to present.
The current implementation of Navigator on React Native makes use of the deprecated "Navigator Experimental". We will look at moving away from this implementation to the now-recommended "react-navigation" in the near future. Some of the more advanced interfaces may need to change. These are listed at the end of this article. Use these with caution.
To install: ```npm install reactxp-navigation```
## Types
``` javascript
// Specifies the behavior when transitioning from one
// card to another within the stack.
enum NavigatorSceneConfigType {
FloatFromRight,
FloatFromLeft,
FloatFromBottom,
Fade,
FadeWithSlide
}
// Provides information about a card and how it should
// be presented when pushed onto the stack or popped
// off the stack.
interface NavigatorRoute {
// Uniquely identifies the card
routeId: number;
// Animation parameter
sceneConfigType: NavigatorSceneConfigType;
// Optional gesture response distance override;
// 0 is equivalent to disabling gestures;
// works only on React Native platforms
gestureResponseDistance?: number;
// Optional custom scene config;
// works only on React Native platforms
customSceneConfig?: CustomNavigatorSceneConfig;
}
```
## Props
``` javascript
// Style to apply to the card
cardStyle: ViewStyleRuleSet = undefined;
// Called to render the specified scene
renderScene: (route: NavigatorRoute) => JSX.Element = undefined;
// Called when a transition between cards is complete
transitionCompleted: () => void = undefined;
```
## Methods
``` javascript
// Returns the current list of routes
getCurrentRoutes(): Types.NavigatorRoute[];
// Replaces the current list of routes with a new list
immediatelyResetRouteStack(
nextRouteStack: Types.NavigatorRoute[]): void;
// Pops the top route off the stack
pop(): void;
// Pops zero or more routes off the top of the stack until
// the specified route is top-most
popToRoute(route: Types.NavigatorRoute): void;
// Pops all routes off the stack except for the last
// remaining item in the stack
popToTop(): void;
// Push a new route onto the stack
push(route: Types.NavigatorRoute): void;
// Replaces the top-most route with a new route
replace(route: Types.NavigatorRoute): void;
// Replaces an existing route (identified by index) with
// a new route
replaceAtIndex(route: Types.NavigatorRoute, index: number): void;
// Replaces the next-to-top-most route with a new route
replacePrevious(route: Types.NavigatorRoute): void;
```
## Sample Usage
This sample demonstrates how an app can use Navigator to present a two-card stack, allowing the user to navigate between them. It omits some details for brevity. For a full working example, check out the hello-world sample app.
``` javascript
enum NavigationRouteId {
MainPanel,
SecondPanel
};
class App extends RX.Component<null, null> {
private _navigator: RX.Navigator;
componentDidMount() {
// Now that the app is mounted, specify the initial
// navigator route.
this._navigator.immediatelyResetRouteStack([{
routeId: NavigationRouteId.MainPanel,
sceneConfigType: RX.Types.NavigatorSceneConfigType.Fade
}]);
}
render() {
return (
<RX.Navigator
ref={ this._onNavigatorRef }
renderScene={ this._renderScene }
/>
);
}
private _onNavigatorRef = (navigator: RX.Navigator) => {
// Stash away a reference to the mounted navigator
this._navigator = navigator;
}
private _renderScene = (navigatorRoute: NavigatorRoute) => {
switch (navigatorRoute.routeId) {
case NavigationRouteId.MainPanel:
return (
<MainPanel
onPressNavigate={ this._onPressNavigate }
/>
);
case NavigationRouteId.SecondPanel:
return (
<SecondPanel
onNavigateBack={ this._onPressBack }
/>
);
}
return null;
}
// Called when the user presses a button on the MainPanel
// to navigate to the SecondPanel.
private _onPressNavigate = () => {
this._navigator.push({
routeId: NavigationRouteId.SecondPanel,
sceneConfigType:
RX.Types.NavigatorSceneConfigType.FloatFromRight,
customSceneConfig: {
hideShadow: true
}
});
}
// Called when the user presses a back button on the
// SecondPanel to navigate back to the MainPanel.
private _onPressBack = () => {
this._navigator.pop();
}
}
```
## Experimental Types
These types apply only to React Native platforms, and they currently rely on the soon-to-be-deprecated "Experimental Navigator". Some or all of these types may be deprecated in the near future, so use with caution.
``` javascript
// Additional options that affect card transitions
type CustomNavigatorSceneConfig = {
// Optional transition styles
transitionStyle?: (sceneIndex: number,
sceneDimensions: Dimensions) =>
NavigationTransitionStyleConfig;
// Optional overrides for duration, easing, and timing
transitionSpec?: NavigationTransitionSpec;
// Optional cardStyle override
cardStyle?: ViewStyleRuleSet;
// Optionally hide drop shadow
hideShadow?: boolean;
// Optionally flip the visual order of the last two scenes
presentBelowPrevious?: boolean;
};
// Parameters to control transition animations
type NavigationTransitionSpec = {
duration?: number;
easing?: Animated.EasingFunction;
};
// Parameters to control transition appearance
type NavigationTransitionStyleConfig = {
// By default, input range is defined as [index - 1, index, index + 1];
// Input and output ranges must contain the same number of elements
inputRange?: number[];
opacityOutput: number | number[];
scaleOutput: number | number[];
translateXOutput: number | number[];
translateYOutput: number | number[];
};
```
## Experimental Props
These props apply only to React Native platforms, and they currently rely on the soon-to-be-deprecated "Experimental Navigator". Some or all of these props may be deprecated in the near future, so use with caution.
``` javascript
// Called after the user swipes back in the stack and the transition
// is complete
navigateBackCompleted: () => void;
// Called when a transition begins; works only
// on native
transitionStarted: (progress?: RX.AnimatedValue,
toRouteId?: string, fromRouteId?: string,
toIndex?: number, fromIndex?: number) => void = undefined;
```
================================================
FILE: docs/docs/extensions/netinfo.md
================================================
---
id: extensions/netinfo
title: NetInfo
layout: docs
category: Extensions
permalink: docs/extensions/netinfo.html
next: extensions/restclient
---
This interface provides information about network connectivity.
## Types
``` javascript
enum DeviceNetworkType {
Unknown,
None,
Wifi,
Mobile2G,
Mobile3G,
Mobile4G
}
```
## Methods
``` javascript
// Returns a promise that specifies whether the device currently
// has network connectivity
isConnected(): SyncTasks.Promise<boolean>;
// Returns the type of network
getType(): SyncTasks.Promise<DeviceNetworkType>;
```
## Events
``` javascript
// Triggered when the connectivity changes
connectivityChangedEvent: SubscribableEvent<(isConnected: boolean) => void>;
```
## Sample Usage
``` javascript
private isConnected: boolean;
constructor() {
// Query the initial connectivity state.
this.isConnected = false;
RXNetInfo.isConnected().then(isConnected => {
this.isConnected = isConnected;
});
RXNetInfo.connectivityChangedEvent.subscribe(isConnected => {
// Update the connectivity state.
this.isConnected = isConnected;
});
}
```
## Other Notes
On Android, the following permission must be added to make use of the network interfaces.
``` xml
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
```
================================================
FILE: docs/docs/extensions/restclient.md
================================================
---
id: extensions/restclient
title: REST Client
layout: docs
category: Extensions
permalink: docs/extensions/restclient.html
next: extensions/video
---
ReactXP provides basic [Network APIs](/reactxp/docs/apis/network) for determining network connectivity, but it doesn't provide ways to access the network once connected.
This extension provides a cross-platform mechanism for wrapping a simple REST API. It supports optional retry logic (including exponential backoff).
For more details, refer to the [SimpleRestClients](https://github.com/Microsoft/SimpleRestClients) GitHub site.
To install: ```npm install simplerestclients``` or ```yarn add simplerestclients```
### Sample Usage
``` javascript
import { GenericRestClient, ApiCallOptions } from 'simplerestclients';
import SyncTasks = require('synctasks');
export interface User {
id: string;
firstName: string;
lastName: string;
}
export default class MyRestClient extends GenericRestClient {
constructor(private _appId: string) {
super('https://myhost.com/api/v1/');
}
// Override _getHeaders to append a custom header with the app ID.
protected _getHeaders(options: ApiCallOptions): { [key: string]: string } {
let headers = super._getHeaders(options);
headers['X-AppId'] = this._appId;
return headers;
}
// Define public methods that expose the APIs provided through
// the REST service.
getAllUsers(): SyncTasks.Promise<User[]> {
return this.performApiGet<User[]>('users');
}
getUserById(id: string): SyncTasks.Promise<User> {
return this.performApiGet<User>('user/' + id);
}
setUser(user: User): SyncTasks.Promise<void> {
return this.performApiPut<void>('user/' + user.id, user);
}
}
```
================================================
FILE: docs/docs/extensions/video.md
================================================
---
id: extensions/video
title: Video
layout: docs
category: Extensions
permalink: docs/extensions/video.html
next: extensions/virtuallistview
---
This component provides video playback capabilities, presenting optional controls for play, pause, etc.
To install: ```npm install reactxp-video```
## Types
``` javascript
// Used to return progress information in the onProgress callback
interface VideoProgress {
currentTime: number;
playableDuration: number;
atValue?: number;
target?: number;
atTimeScale?: number;
}
// Used to return information about the video once its metadata
// has been loaded; returned by the onLoadedData callback
interface VideoInfo {
duration?: number;
naturalSize?: {
width: number;
height: number;
};
}
```
## Props
``` javascript
// Alternate text to display if the image cannot be loaded
// or by screen readers
accessibilityLabel: string = undefined;
// Authentication token to include in request (not supported
// on some React Native implementations)
authToken: string = undefined;
// Should video playback loop to beginning after it completes?
loop: boolean = false;
// Called when the video is paused for buffering
onBuffer: () => void = undefined;
// Called when enough of the video has been loaded that playback
// is possible
onCanPlay: () => void = undefined;
// Called when enough of the video has been loaded that playback
// can proceed all the way to the end without buffering pauses
onCanPlayThrough: () => void = undefined;
// Called when the video playback reaches the end
onEnded: () => void = undefined;
// Called when the video cannot be loaded
onError: () => void = undefined;
// Called when the video's metadata has been loaded; returns
// information about the video
onLoadedData: (info: VideoInfo) => void = undefined;
// Called when the video data is starting to load
onLoadStart: () => void = undefined;
// Called periodically when the video is playing; reports
// progress information
onProgress: (progress: VideoProgress) => void = undefined;
// Indiciates which portion of the video should be pre-loaded
// when the component is mounted
preload: 'auto'|'metadata'|'none' = 'none';
// Determines how to resize the image if its natural size
// does not match the size of the container
resizeMode: 'contain'|'cover'|'stretch' = 'contain';
// Displays controls for play, pause, etc.
showControls: boolean = false;
// Source of video (URL) or resource `id` as resolved by `require()` for `react-native` targets.
source: string | number;
// See below for supported styles
style: ViewStyleRuleSet | ViewStyleRuleSet[] = [];
```
## Styles
[**Flexbox Styles**](/reactxp/docs/styles.html#flexbox-style-attributes)
[**View Styles**](/reactxp/docs/styles.html#view-style-attributes)
[**Transform Styles**](/reactxp/docs/styles.html#transform-style-attributes)
## Methods
``` javascript
// Mutes or unmutes the sound for the video
mute(muted: boolean): void;
// Pauses the video
pause(): void;
// Plays the video at its current position
play(): void;
// Seeks to the specified position (specified in seconds)
seek(position: number): void;
```
## Sample Usage
``` javascript
return (
<RX.Video
source={ 'http://mydomain.com/coolvideo.mp4' }
/>
);
```
================================================
FILE: docs/docs/extensions/virtuallistview.md
================================================
---
id: extensions/virtuallistview
title: VirtualListView
layout: docs
category: Extensions
permalink: docs/extensions/virtuallistview.html
next: extensions/webview
---
This components supports a vertical list of items within a scrolling area. The visible portion of the list is referred to as the "view port". The list is virtualized, which means that items are rendered only when they are within the view port (or just above or below the view port).
Unlike other list views (such as the ListView provided in React Native), this component supports lists of heterogeneous items with different heights and completely different types.
Each item in the list is described by a VirtualListViewItemInfo object. The list of items is specified by an ordered list passed in the itemList prop. When an item comes into view, it is rendered through the use of the renderItem callback. Additional fields can be added to the VirtualListViewItemInfo by the caller as it sees fit. For example, it is sometimes useful to include additional identifying information such as an item type or an item-specific render method.
A height must be specified for each item. By default, this height is assumed to be accurate and constant. If you do not know the height of the object or it may change, the height can be measured at runtime. This option is expensive, so it should be avoided if possible.
It optionally supports animation of items when they are added, removed or moved within the list.
When items are added before or after the visible region, it attempts to maintain the current position of the visible items, adjusting the scroll position and list height as necessary.
To install: ```npm install reactxp-virtuallistview```
## Performance Techniques
The VirtualListView employs a number of tricks to improve performance.
It uses a technique called "cell recycling" to minimize the number of mounts and unmounts. A cell is a container for a list item. When a cell is no longer visible, it can be temporarily hidden and then reused for the next item that becomes visible. This optimization is most effective when the recycled cell and its contents are used for an item that is similar in content. For this reason, callers need to specify a "template" field to identify similar items. In some cases, disabling cell recycling can be benificial as recycled cells continue their regular react lifecycle even when not visible, which can lead to excessive background re-rendering in some cases. When combining VLV with react libraries (like ReSub) that have subscriptions managed by components can cause this behaviour to manifest. To disable cell recycling on specific cells, exclude the template field from the item descriptor.
It also supports "overdraw" to render items above and below the view port. This minimizes chances that the user will scroll to a new portion of the list before new items can be rendered in that area. Overdraw is employed only after the view port is initially filled. This reduces the performance impact of rendering.
It also limits the number of items it renders each time to avoid consuming too many cycles on the javascript thread.
It supports a special mode where items are re-rendered only if the corresponding VirtualListViewItemInfo changes. This mode requires that the renderItem method use only information within this object. To use this mode, set the skipRenderIfItemUnchanged prop to true.
## Example
``` javascript
import { VirtualListView, VirtualListViewItemInfo }
from 'reactxp-virtuallistview';
// Extend VirtualListViewItemInfo to include display text
interface FruitListItemInfo extends VirtualListViewItemInfo {
text: string;
}
interface FruitListState {
items: FruitListItemInfo[];
}
const _headerItemHeight = 20;
const _fruitItemHeight = 32;
const _headerItemTemplate = 'header';
const _fruitItemTemplate = 'fruit';
class FruitListView extends RX.Component<null, FruitListState> {
constructor() {
super();
this.state = {
items: [{
key: 'header1',
height: _headerItemHeight,
text: 'Domstic Fruits',
template: _headerItemTemplate
}, {
key: 'bannana',
height: _fruitItemHeight,
text: 'Banana',
template: _fruitItemTemplate
}, {
key: 'apple',
height: _fruitItemHeight,
text: 'Apple',
template: _fruitItemTemplate
}]
};
}
render() {
return (
<VirtualListView
itemList={ this.state.items }
renderItem={ this._renderItem }
animateChanges={ true }
skipRenderIfItemUnchanged={ true }
/>
);
}
private _renderItem(details: VirtualListViewCellRenderDetails<FruitListItemInfo>) {
const viewStyle = RX.Styles.createViewStyle({
height: details.item.height,
backgroundColor: item.template === _headerItemTemplate ?
'#ddd' : '#fff',
alignItems: 'center'
}, false);
return (
<RX.View style={ viewStyle }>
<RX.Text>
{ details.item.text }
</RX.Text>
</RX.View>
);
}
}
```
## Interfaces
``` javascript
interface VirtualListViewItemInfo {
// A string that uniquely identifies this item.
key: string;
// Specifies the known height of the item or a best guess if the
// height isn't known.
height: number;
// Specifies that the height is not known and needs to be measured
// dynamically. This has a big perf overhead because it requires a
// double layout (once offscreen to measure the item). It also
// disables cell recycling. Wherever possible, it should be avoided,
// especially for perf-critical views.
measureHeight?: boolean;
// Specify the same "template" string for items that are rendered
// with identical or similar view hierarchies. When a template is
// specified, the list view attempts to recycle cells whose templates
// match. When an item scrolls off the screen and others appear on
// screen, the contents of the cell are simply updated rather than
// torn down and rebuilt.
template: string;
// Is the item navigable by keyboard or through accessibility
// mechanisms?
isNavigable?: boolean;
}
```
## Props
``` javascript
// Should the list animate additions, removals and moves within the list?
animateChanges?: boolean;
initialSelectedKey?: string;
// Ordered list of descriptors for items to display in the list.
itemList: VirtualListViewItemInfo[];
// Use this if you want to vertically offset the focused item from the
// top of the viewport when using keyboard nav
keyboardFocusScrollOffset?: number;
// Logging callback to debug issues related to the VirtualListView.
logInfo?: (textToLog: string) => void;
// Callback when an item in the VLV is selected
onItemSelected?: (item: ItemInfo) => void;
// Optional padding around the scrolling content within the list.
padding?: number;
// Callback for rendering item when it becomes visible within view port.
renderItem: (renderDetails: VirtualListCellRenderDetails<ItemInfo>) =>
JSX.Element | JSX.Element[];
// If true, allows each item to overflow its visible cell boundaries;
// by default, item contents are clipped to cell boundaries.
showOverflow?: boolean;
// By default, VirtualListView re-renders every item during the render.
// Setting this flag to true allows the list view to re-render only
// items from itemList whose descriptor has changed, thus avoiding
// unnecessary rendering. It uses _.isEqual to perform this check. In
// this mode, renderItem should not depend on any external state, only
// on VirtualListViewItemInfo, to render item.
skipRenderIfItemUnchanged?: boolean;
// ID that can be used to identify the instantiated element for testing purposes.
testId: string = undefined;
// Pass-through properties for scroll view.
keyboardDismissMode?: 'none' | 'interactive' | 'on-drag';
keyboardShouldPersistTaps?: boolean;
disableScrolling?: boolean;
scrollsToTop?: boolean; // iOS only, scroll to top when user taps on status bar
disableBouncing?: boolean; // iOS only, bounce override
scrollIndicatorInsets?: { top: number, left: number,
bottom: number, right: number }; // iOS only
onLayout?: (e: RX.Types.ViewOnLayoutEvent) => void;
scrollEventThrottle?: number;
onScroll?: (scrollTop: number, scrollLeft: number) => void;
scrollXAnimatedValue?: RX.Types.AnimatedValue;
scrollYAnimatedValue?: RX.Types.AnimatedValue;
```
## Methods
``` javascript
// Scrolls the view to the specified top value (specified in pixels).
scrollToTop(animated = true, top = 0);
// Sets selection & focus to specified key
selectItemKey(key: string);
```
================================================
FILE: docs/docs/extensions/webview.md
================================================
---
id: extensions/webview
title: WebView
layout: docs
category: Extensions
permalink: docs/extensions/webview.html
---
This component displays HTML contents in an embedded browser control.
To limit the functionality of the browser control, specify one or more sandbox options. For detailed definitions of sandbox flags, refer to the [HTML documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe).
## Types
``` javascript
enum WebViewSandboxMode {
None = 0,
AllowForms = 1 << 0,
AllowModals = 1 << 1,
AllowOrientationLock = 1 << 2,
AllowPointerLock = 1 << 3,
AllowPopups = 1 << 4,
AllowPopupsToEscapeSandbox = 1 << 5,
AllowPresentation = 1 << 6,
AllowSameOrigin = 1 << 7,
AllowScripts = 1 << 8,
AllowTopNavigation = 1 << 9,
// Control https mixed content behavior, never by default
AllowMixedContentAlways = 1 << 10,
AllowMixedContentCompatibilityMode = 1 << 11
}
interface WebViewNavigationState {
canGoBack: boolean;
canGoForward: boolean;
loading: boolean;
url: string;
title: string;
readonly navigationType:
| 'click'
| 'formsubmit'
| 'backforward'
| 'reload'
| 'formresubmit'
| 'other';
}
interface WebViewErrorState {
description: string;
domain: string;
code: string;
}
interface WebViewSource {
html: string;
baseUrl?: string; // Native only
}
```
## Props
``` javascript
// Allow javascript code to call storage methods?
domStorageEnabled: boolean = true; // Native only
// JavaScript code that is injected into the control and executed
injectedJavaScript: string = undefined; // Native only
// Is JavaScript executed within the control?
javaScriptEnabled: boolean = true;
// Determines whether HTML5 audio and video requires the user to tap them before they start playing.
mediaPlaybackRequiresUserAction: boolean = true; // Native only
// Determines whether HTML5 videos play inline or use the native full-screen controller.
allowsInlineMediaPlayback: boolean = false; // iOS only
// HTTP headers to include when fetching the URL.
headers: { [headerName: string]: string } = undefined;
// Called when an error occurs that prevents the contents from loading
onError: (e: SyntheticEvent) => void = undefined; // Native only
// Called when the contents successfully load
onLoad: (e: SyntheticEvent) => void = undefined;
// Called when the contents start to load
onLoadStart: (e: SyntheticEvent) => void = undefined; // Native only
// Called when a message is posted from within a WebView
onMessage: (e: WebViewMessageEvent) => void = undefined;
// Called when the navigation state changes
onNavigationStateChange: (navigationState: WebViewNavigationState) => void; // Native only
// Flags that restrict behaviors within the control
sandbox: WebViewSandboxMode = None;
// Zooms the page conte
gitextract_wyk0on54/ ├── .eslintrc.json ├── .gitignore ├── .npmignore ├── .npmrc ├── .travis.yml ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── README_Hindi.md ├── SECURITY.md ├── azure-pipelines.yml ├── docs/ │ ├── Gemfile │ ├── _config.yml │ ├── _data/ │ │ ├── authors.yml │ │ └── nav_docs.yml │ ├── _includes/ │ │ ├── blog_post.html │ │ ├── footer.html │ │ ├── hero.html │ │ ├── nav_blog.html │ │ ├── nav_docs.html │ │ └── navigation.html │ ├── _layouts/ │ │ ├── default.html │ │ ├── docs.html │ │ ├── hero.html │ │ └── post.html │ ├── _plugins/ │ │ └── sass.rb │ ├── _posts/ │ │ ├── 2017-04-06-introducing-reactxp.md │ │ ├── 2017-04-27-building-skype-on-reactxp.md │ │ ├── 2017-05-24-performance-tuning.md │ │ └── 2017-06-29-asset-loading.md │ ├── _sass/ │ │ ├── _typography.scss │ │ └── _variables.scss │ ├── blog/ │ │ ├── all.html │ │ └── index.html │ ├── community/ │ │ └── support.md │ ├── css/ │ │ ├── reactxp.scss │ │ └── syntax.css │ ├── docs/ │ │ ├── accessibility.md │ │ ├── animations.md │ │ ├── apis/ │ │ │ ├── accessibility.md │ │ │ ├── alert.md │ │ │ ├── app.md │ │ │ ├── clipboard.md │ │ │ ├── input.md │ │ │ ├── international.md │ │ │ ├── linking.md │ │ │ ├── location.md │ │ │ ├── modal.md │ │ │ ├── network.md │ │ │ ├── platform.md │ │ │ ├── popup.md │ │ │ ├── statusbar.md │ │ │ ├── storage.md │ │ │ ├── userinterface.md │ │ │ └── userpresence.md │ │ ├── components/ │ │ │ ├── activityindicator.md │ │ │ ├── button.md │ │ │ ├── gestureview.md │ │ │ ├── image.md │ │ │ ├── link.md │ │ │ ├── picker.md │ │ │ ├── scrollview.md │ │ │ ├── text.md │ │ │ ├── textinput.md │ │ │ ├── view.md │ │ │ └── webview.md │ │ ├── extensions/ │ │ │ ├── database.md │ │ │ ├── imagesvg.md │ │ │ ├── navigator.md │ │ │ ├── netinfo.md │ │ │ ├── restclient.md │ │ │ ├── video.md │ │ │ ├── virtuallistview.md │ │ │ └── webview.md │ │ ├── extensions.md │ │ ├── faq.md │ │ ├── getting-started.md │ │ ├── react_concepts.md │ │ ├── react_lifecycle.md │ │ ├── react_stores.md │ │ ├── styles.md │ │ └── using-reactxp.md │ ├── index.md │ └── versions/ │ └── version_history.md ├── extensions/ │ ├── README.md │ ├── imagesvg/ │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── .npmignore │ │ ├── README.md │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── index.macos.js │ │ ├── index.windows.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── android/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── common/ │ │ │ │ ├── Interfaces.ts │ │ │ │ ├── PluginBaseChecker.ts │ │ │ │ ├── Types.ts │ │ │ │ └── assert.ts │ │ │ ├── ios/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── macos/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── native-common/ │ │ │ │ ├── ImageSvg.tsx │ │ │ │ ├── SvgPath.tsx │ │ │ │ └── SvgRect.tsx │ │ │ ├── typings/ │ │ │ │ └── react-native-svg.d.ts │ │ │ ├── web/ │ │ │ │ ├── ImageSvg.tsx │ │ │ │ ├── PluginBase.ts │ │ │ │ ├── SvgPath.tsx │ │ │ │ └── SvgRect.tsx │ │ │ └── windows/ │ │ │ ├── ImageSvg.tsx │ │ │ ├── PluginBase.ts │ │ │ ├── SvgPath.tsx │ │ │ └── SvgRect.tsx │ │ └── tsconfig.json │ ├── navigation/ │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── .npmignore │ │ ├── README.md │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── index.macos.js │ │ ├── index.windows.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── common/ │ │ │ │ ├── Types.ts │ │ │ │ ├── assert.ts │ │ │ │ └── lodashMini.ts │ │ │ ├── native-common/ │ │ │ │ ├── Navigator.tsx │ │ │ │ └── NavigatorExperimentalDelegate.tsx │ │ │ ├── typings/ │ │ │ │ ├── react-native-deprecated-custom-components.d.ts │ │ │ │ └── rebound.d.ts │ │ │ └── web/ │ │ │ ├── Navigator.tsx │ │ │ └── NavigatorSceneConfigFactory.tsx │ │ └── tsconfig.json │ ├── netinfo/ │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── .npmignore │ │ ├── README.md │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── index.macos.js │ │ ├── index.windows.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── android/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── common/ │ │ │ │ ├── Interfaces.ts │ │ │ │ ├── PluginBaseChecker.ts │ │ │ │ └── Types.ts │ │ │ ├── ios/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── macos/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── native-common/ │ │ │ │ └── NetInfo.tsx │ │ │ ├── web/ │ │ │ │ ├── NetInfo.tsx │ │ │ │ └── PluginBase.ts │ │ │ └── windows/ │ │ │ └── PluginBase.ts │ │ └── tsconfig.json │ ├── video/ │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── .npmignore │ │ ├── README.md │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── index.macos.js │ │ ├── index.windows.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── android/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── common/ │ │ │ │ ├── Interfaces.ts │ │ │ │ ├── PluginBaseChecker.ts │ │ │ │ └── Types.ts │ │ │ ├── ios/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── macos/ │ │ │ │ └── PluginBase.tsx │ │ │ ├── native-common/ │ │ │ │ └── Video.tsx │ │ │ ├── typings/ │ │ │ │ └── react-native-video.d.ts │ │ │ ├── web/ │ │ │ │ ├── PluginBase.ts │ │ │ │ └── Video.tsx │ │ │ └── windows/ │ │ │ ├── PluginBase.ts │ │ │ └── Video.tsx │ │ └── tsconfig.json │ ├── virtuallistview/ │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── .npmignore │ │ ├── LICENSE │ │ ├── README.md │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.js │ │ ├── index.macos.js │ │ ├── index.windows.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── VirtualListCell.tsx │ │ │ ├── VirtualListView.tsx │ │ │ └── assert.ts │ │ └── tsconfig.json │ └── webview/ │ ├── .eslintrc.json │ ├── .gitignore │ ├── .npmignore │ ├── README.md │ ├── index.android.js │ ├── index.ios.js │ ├── index.js │ ├── index.macos.js │ ├── index.windows.js │ ├── package.json │ ├── src/ │ │ ├── android/ │ │ │ └── PluginBase.tsx │ │ ├── common/ │ │ │ ├── Interfaces.ts │ │ │ ├── PluginBaseChecker.ts │ │ │ └── Types.ts │ │ ├── ios/ │ │ │ └── PluginBase.tsx │ │ ├── macos/ │ │ │ └── PluginBase.tsx │ │ ├── native-common/ │ │ │ └── WebView.tsx │ │ ├── web/ │ │ │ ├── PluginBase.ts │ │ │ └── WebView.tsx │ │ └── windows/ │ │ └── PluginBase.ts │ └── tsconfig.json ├── index.android.js ├── index.ios.js ├── index.js ├── index.macos.js ├── index.windows.js ├── package.json ├── samples/ │ ├── ImageList/ │ │ ├── .eslintrc │ │ ├── .gitignore │ │ ├── README.md │ │ ├── android/ │ │ │ ├── app/ │ │ │ │ ├── BUCK │ │ │ │ ├── build.gradle │ │ │ │ ├── build_defs.bzl │ │ │ │ ├── proguard-rules.pro │ │ │ │ └── src/ │ │ │ │ ├── debug/ │ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ │ └── res/ │ │ │ │ │ └── xml/ │ │ │ │ │ └── react_native_config.xml │ │ │ │ └── main/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ ├── assets/ │ │ │ │ │ └── .gitignore │ │ │ │ ├── java/ │ │ │ │ │ └── com/ │ │ │ │ │ └── rxpimagelist/ │ │ │ │ │ ├── MainActivity.java │ │ │ │ │ └── MainApplication.java │ │ │ │ └── res/ │ │ │ │ └── values/ │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ ├── build.gradle │ │ │ ├── gradle/ │ │ │ │ └── wrapper/ │ │ │ │ ├── gradle-wrapper.jar │ │ │ │ └── gradle-wrapper.properties │ │ │ ├── gradle.properties │ │ │ ├── gradlew │ │ │ ├── gradlew.bat │ │ │ ├── keystores/ │ │ │ │ ├── BUCK │ │ │ │ └── debug.keystore.properties │ │ │ └── settings.gradle │ │ ├── babel.config.js │ │ ├── index.js │ │ ├── ios/ │ │ │ ├── RXPImageList/ │ │ │ │ ├── AppDelegate.h │ │ │ │ ├── AppDelegate.m │ │ │ │ ├── Base.lproj/ │ │ │ │ │ └── LaunchScreen.xib │ │ │ │ ├── Images.xcassets/ │ │ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ │ │ └── Contents.json │ │ │ │ │ └── Contents.json │ │ │ │ ├── Info.plist │ │ │ │ └── main.m │ │ │ ├── RXPImageList-tvOS/ │ │ │ │ └── Info.plist │ │ │ ├── RXPImageList-tvOSTests/ │ │ │ │ └── Info.plist │ │ │ ├── RXPImageList.xcodeproj/ │ │ │ │ ├── project.pbxproj │ │ │ │ └── xcshareddata/ │ │ │ │ └── xcschemes/ │ │ │ │ ├── RXPImageList-tvOS.xcscheme │ │ │ │ └── RXPImageList.xcscheme │ │ │ └── RXPImageListTests/ │ │ │ ├── Info.plist │ │ │ └── RXPImageListTests.m │ │ ├── jest/ │ │ │ ├── enzyme.config.js │ │ │ └── jest.config.js │ │ ├── metro.config.js │ │ ├── package.json │ │ ├── scripts/ │ │ │ └── react-native.js │ │ ├── src/ │ │ │ ├── App.tsx │ │ │ ├── config.ts │ │ │ ├── controls/ │ │ │ │ └── SearchField.tsx │ │ │ ├── index.tsx │ │ │ ├── services/ │ │ │ │ └── GiphyClient.ts │ │ │ ├── stores/ │ │ │ │ └── ImageStore.ts │ │ │ └── views/ │ │ │ ├── ImageList.tsx │ │ │ └── RootView.tsx │ │ ├── tsconfig.json │ │ ├── web/ │ │ │ ├── index.hmr.js │ │ │ ├── template.html │ │ │ └── webpack/ │ │ │ ├── common.js │ │ │ ├── dev.js │ │ │ └── prod.js │ │ └── windows/ │ │ ├── .gitignore │ │ ├── RXPImageList/ │ │ │ ├── App.xaml │ │ │ ├── App.xaml.cs │ │ │ ├── MainReactNativeHost.cs │ │ │ ├── Package.appxmanifest │ │ │ ├── Properties/ │ │ │ │ ├── AssemblyInfo.cs │ │ │ │ └── Default.rd.xml │ │ │ ├── RXPImageList.csproj │ │ │ ├── RXPImageList_TemporaryKey.pfx │ │ │ └── ReactAssets/ │ │ │ └── .gitignore │ │ └── RXPImageList.sln │ ├── README.md │ ├── RXPTest/ │ │ ├── .gitignore │ │ ├── README.md │ │ ├── android/ │ │ │ ├── app/ │ │ │ │ ├── BUCK │ │ │ │ ├── build.gradle │ │ │ │ ├── build_defs.bzl │ │ │ │ ├── proguard-rules.pro │ │ │ │ └── src/ │ │ │ │ ├── debug/ │ │ │ │ │ └── AndroidManifest.xml │ │ │ │ └── main/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ ├── java/ │ │ │ │ │ └── com/ │ │ │ │ │ └── rxphelloworld/ │ │ │ │ │ ├── MainActivity.java │ │ │ │ │ └── MainApplication.java │ │ │ │ └── res/ │ │ │ │ └── values/ │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ ├── build.gradle │ │ │ ├── gradle/ │ │ │ │ └── wrapper/ │ │ │ │ ├── gradle-wrapper.jar │ │ │ │ └── gradle-wrapper.properties │ │ │ ├── gradle.properties │ │ │ ├── gradlew │ │ │ ├── gradlew.bat │ │ │ ├── keystores/ │ │ │ │ ├── BUCK │ │ │ │ └── debug.keystore.properties │ │ │ └── settings.gradle │ │ ├── index.android.js │ │ ├── index.html │ │ ├── index.ios.js │ │ ├── index.windows.js │ │ ├── ios/ │ │ │ ├── RXPTest/ │ │ │ │ ├── AppDelegate.h │ │ │ │ ├── AppDelegate.m │ │ │ │ ├── Base.lproj/ │ │ │ │ │ └── LaunchScreen.xib │ │ │ │ ├── Images.xcassets/ │ │ │ │ │ └── AppIcon.appiconset/ │ │ │ │ │ └── Contents.json │ │ │ │ ├── Info.plist │ │ │ │ └── main.m │ │ │ └── RXPTest.xcodeproj/ │ │ │ ├── project.pbxproj │ │ │ └── xcshareddata/ │ │ │ └── xcschemes/ │ │ │ ├── RXPTest-tvOS.xcscheme │ │ │ └── RXPTest.xcscheme │ │ ├── metro.config.js │ │ ├── package.json │ │ ├── src/ │ │ │ ├── App.tsx │ │ │ ├── CommonStyles.tsx │ │ │ ├── Test.tsx │ │ │ ├── TestContainer.tsx │ │ │ ├── TestListView.tsx │ │ │ ├── TestRegistry.ts │ │ │ ├── Tests/ │ │ │ │ ├── AccessibilityTest.tsx │ │ │ │ ├── ActivityIndicatorTest.tsx │ │ │ │ ├── AlertTest.tsx │ │ │ │ ├── AnimationTest.tsx │ │ │ │ ├── AppTest.tsx │ │ │ │ ├── ButtonTest.tsx │ │ │ │ ├── ClipboardTest.tsx │ │ │ │ ├── DragAndDropTest.tsx │ │ │ │ ├── GestureViewTest.tsx │ │ │ │ ├── ImageApiTest.tsx │ │ │ │ ├── ImageInteractiveTest.tsx │ │ │ │ ├── InputTest.tsx │ │ │ │ ├── InternationalTest.tsx │ │ │ │ ├── LinkTest.tsx │ │ │ │ ├── LinkingTest.tsx │ │ │ │ ├── LocationTest.tsx │ │ │ │ ├── ModalTest.tsx │ │ │ │ ├── NetworkTest.tsx │ │ │ │ ├── PickerTest.tsx │ │ │ │ ├── PlatformTest.tsx │ │ │ │ ├── PopupTest.tsx │ │ │ │ ├── ScrollViewBasicTest.tsx │ │ │ │ ├── ScrollViewEventTest.tsx │ │ │ │ ├── StatusBarTest.tsx │ │ │ │ ├── StorageTest.tsx │ │ │ │ ├── TextInputApiTest.tsx │ │ │ │ ├── TextInputInteractiveTest.tsx │ │ │ │ ├── TextTest.tsx │ │ │ │ ├── UserInterfaceTest.tsx │ │ │ │ ├── UserPresenceTest.tsx │ │ │ │ ├── ViewBasicTest.tsx │ │ │ │ ├── ViewMouseTest.tsx │ │ │ │ ├── ViewTouchTest.tsx │ │ │ │ ├── WebViewBasicTest.tsx │ │ │ │ └── WebViewDynamicTest.tsx │ │ │ ├── Utilities.ts │ │ │ └── index.tsx │ │ ├── tsconfig.json │ │ ├── tslint.json │ │ ├── webpack.config.ts │ │ └── windows/ │ │ ├── .gitignore │ │ ├── rxptest/ │ │ │ ├── App.xaml │ │ │ ├── App.xaml.cs │ │ │ ├── MainReactNativeHost.cs │ │ │ ├── Package.appxmanifest │ │ │ ├── Properties/ │ │ │ │ ├── AssemblyInfo.cs │ │ │ │ └── Default.rd.xml │ │ │ ├── ReactAssets/ │ │ │ │ └── .gitignore │ │ │ ├── rxptest.csproj │ │ │ └── rxptest_TemporaryKey.pfx │ │ └── rxptest.sln │ ├── TodoList/ │ │ ├── .babelrc │ │ ├── .eslintrc.json │ │ ├── .gitignore │ │ ├── README.md │ │ ├── android/ │ │ │ ├── app/ │ │ │ │ ├── BUCK │ │ │ │ ├── build.gradle │ │ │ │ ├── build_defs.bzl │ │ │ │ ├── debug.keystore │ │ │ │ ├── proguard-rules.pro │ │ │ │ └── src/ │ │ │ │ ├── debug/ │ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ │ └── java/ │ │ │ │ │ └── com/ │ │ │ │ │ └── rxptodolist/ │ │ │ │ │ └── ReactNativeFlipper.java │ │ │ │ └── main/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ ├── java/ │ │ │ │ │ └── com/ │ │ │ │ │ └── rxptodolist/ │ │ │ │ │ ├── MainActivity.java │ │ │ │ │ └── MainApplication.java │ │ │ │ └── res/ │ │ │ │ └── values/ │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ ├── build.gradle │ │ │ ├── gradle/ │ │ │ │ └── wrapper/ │ │ │ │ ├── gradle-wrapper.jar │ │ │ │ └── gradle-wrapper.properties │ │ │ ├── gradle.properties │ │ │ ├── gradlew │ │ │ ├── gradlew.bat │ │ │ └── settings.gradle │ │ ├── app.json │ │ ├── babel.config.js │ │ ├── buildconfig.js │ │ ├── buildtools/ │ │ │ └── inline-require.js │ │ ├── gulpfile.js │ │ ├── index.android.js │ │ ├── index.ios.js │ │ ├── index.windows.js │ │ ├── ios/ │ │ │ ├── Podfile │ │ │ ├── rxptodolist/ │ │ │ │ ├── AppDelegate.h │ │ │ │ ├── AppDelegate.m │ │ │ │ ├── Base.lproj/ │ │ │ │ │ └── LaunchScreen.xib │ │ │ │ ├── Images.xcassets/ │ │ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ │ │ └── Contents.json │ │ │ │ │ └── Contents.json │ │ │ │ ├── Info.plist │ │ │ │ └── main.m │ │ │ ├── rxptodolist-tvOS/ │ │ │ │ └── Info.plist │ │ │ ├── rxptodolist-tvOSTests/ │ │ │ │ └── Info.plist │ │ │ ├── rxptodolist.xcodeproj/ │ │ │ │ ├── project.pbxproj │ │ │ │ └── xcshareddata/ │ │ │ │ └── xcschemes/ │ │ │ │ ├── rxptodolist-tvOS.xcscheme │ │ │ │ └── rxptodolist.xcscheme │ │ │ └── rxptodolistTests/ │ │ │ ├── Info.plist │ │ │ └── rxptodolistTests.m │ │ ├── metro.config.js │ │ ├── nodeserver.js │ │ ├── package.json │ │ ├── src/ │ │ │ └── ts/ │ │ │ ├── app/ │ │ │ │ ├── AppBootstrapper.tsx │ │ │ │ ├── AppBootstrapperNative.tsx │ │ │ │ ├── AppBootstrapperWeb.tsx │ │ │ │ ├── AppConfig.ts │ │ │ │ ├── DeepLinkConverter.ts │ │ │ │ ├── LocalDb.ts │ │ │ │ ├── NavActions.ts │ │ │ │ ├── README.md │ │ │ │ └── Styles.tsx │ │ │ ├── controls/ │ │ │ │ ├── HoverButton.tsx │ │ │ │ ├── Modal.tsx │ │ │ │ ├── README.md │ │ │ │ ├── SimpleButton.tsx │ │ │ │ ├── SimpleDialog.tsx │ │ │ │ ├── SimpleMenu.tsx │ │ │ │ └── VerticalSeparator.tsx │ │ │ ├── index.web.tsx │ │ │ ├── models/ │ │ │ │ ├── IdentityModels.ts │ │ │ │ ├── NavModels.ts │ │ │ │ ├── README.md │ │ │ │ ├── ResponsiveWidthModels.ts │ │ │ │ └── TodoModels.ts │ │ │ ├── modules/ │ │ │ │ ├── README.md │ │ │ │ ├── fonts/ │ │ │ │ │ ├── Fonts.ts │ │ │ │ │ ├── index.native.ts │ │ │ │ │ ├── index.web.ts │ │ │ │ │ └── index.windows.ts │ │ │ │ └── images/ │ │ │ │ ├── Images.ts │ │ │ │ ├── index.native.ts │ │ │ │ └── index.web.ts │ │ │ ├── services/ │ │ │ │ ├── PageUrlService.ts │ │ │ │ ├── README.md │ │ │ │ ├── ServiceManager.ts │ │ │ │ └── ServiceRegistrar.ts │ │ │ ├── stores/ │ │ │ │ ├── CurrentUserStore.ts │ │ │ │ ├── NavContextStore.ts │ │ │ │ ├── README.md │ │ │ │ ├── ResponsiveWidthStore.ts │ │ │ │ └── TodosStore.tsx │ │ │ ├── typings/ │ │ │ │ └── defines.d.ts │ │ │ ├── utilities/ │ │ │ │ ├── ExceptionReporter.ts │ │ │ │ ├── KeyCodes.ts │ │ │ │ ├── README.md │ │ │ │ └── ShimHelpers.ts │ │ │ └── views/ │ │ │ ├── AccountMenuButton.tsx │ │ │ ├── CreateTodoPanel.tsx │ │ │ ├── README.md │ │ │ ├── RootView.tsx │ │ │ ├── TodoCompositeView.tsx │ │ │ ├── TodoListItem.tsx │ │ │ ├── TodoListPanel.tsx │ │ │ ├── TopBarComposite.tsx │ │ │ ├── TopBarStack.tsx │ │ │ └── ViewTodoPanel.tsx │ │ ├── tsconfig.json │ │ ├── web/ │ │ │ ├── css/ │ │ │ │ └── app.css │ │ │ └── index.html │ │ ├── webpack.config.ts │ │ └── windows/ │ │ ├── .gitignore │ │ ├── TodoList/ │ │ │ ├── App.xaml │ │ │ ├── App.xaml.cs │ │ │ ├── MainPage.cs │ │ │ ├── Package.appxmanifest │ │ │ ├── Properties/ │ │ │ │ ├── AssemblyInfo.cs │ │ │ │ └── Default.rd.xml │ │ │ ├── TodoList.csproj │ │ │ └── TodoList_TemporaryKey.pfx │ │ └── TodoList.sln │ ├── hello-world/ │ │ ├── .eslintrc │ │ ├── .gitignore │ │ ├── README.md │ │ ├── android/ │ │ │ ├── app/ │ │ │ │ ├── BUCK │ │ │ │ ├── build.gradle │ │ │ │ ├── build_defs.bzl │ │ │ │ ├── proguard-rules.pro │ │ │ │ └── src/ │ │ │ │ ├── debug/ │ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ │ └── res/ │ │ │ │ │ └── xml/ │ │ │ │ │ └── react_native_config.xml │ │ │ │ └── main/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ ├── java/ │ │ │ │ │ └── com/ │ │ │ │ │ └── rxphelloworld/ │ │ │ │ │ ├── MainActivity.java │ │ │ │ │ └── MainApplication.java │ │ │ │ └── res/ │ │ │ │ └── values/ │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ ├── build.gradle │ │ │ ├── gradle/ │ │ │ │ └── wrapper/ │ │ │ │ ├── gradle-wrapper.jar │ │ │ │ └── gradle-wrapper.properties │ │ │ ├── gradle.properties │ │ │ ├── gradlew │ │ │ ├── gradlew.bat │ │ │ ├── keystores/ │ │ │ │ ├── BUCK │ │ │ │ └── debug.keystore.properties │ │ │ └── settings.gradle │ │ ├── babel.config.js │ │ ├── index.js │ │ ├── ios/ │ │ │ ├── RXPHelloWorld/ │ │ │ │ ├── AppDelegate.h │ │ │ │ ├── AppDelegate.m │ │ │ │ ├── Base.lproj/ │ │ │ │ │ └── LaunchScreen.xib │ │ │ │ ├── Images.xcassets/ │ │ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ │ │ └── Contents.json │ │ │ │ │ └── Contents.json │ │ │ │ ├── Info.plist │ │ │ │ └── main.m │ │ │ ├── RXPHelloWorld-tvOS/ │ │ │ │ └── Info.plist │ │ │ ├── RXPHelloWorld-tvOSTests/ │ │ │ │ └── Info.plist │ │ │ ├── RXPHelloWorld.xcodeproj/ │ │ │ │ ├── project.pbxproj │ │ │ │ └── xcshareddata/ │ │ │ │ └── xcschemes/ │ │ │ │ ├── RXPHelloWorld-tvOS.xcscheme │ │ │ │ └── RXPHelloWorld.xcscheme │ │ │ └── RXPHelloWorldTests/ │ │ │ ├── Info.plist │ │ │ └── RXPHelloWorldTests.m │ │ ├── jest/ │ │ │ ├── enzyme.config.js │ │ │ └── jest.config.js │ │ ├── metro.config.js │ │ ├── package.json │ │ ├── scripts/ │ │ │ └── react-native.js │ │ ├── src/ │ │ │ ├── App.tsx │ │ │ ├── config.ts │ │ │ ├── controls/ │ │ │ │ ├── ProgressIndicator.tsx │ │ │ │ └── ToggleSwitch.tsx │ │ │ ├── index.tsx │ │ │ └── views/ │ │ │ ├── MainPanel.tsx │ │ │ ├── RootView.tsx │ │ │ └── SecondPanel.tsx │ │ ├── tsconfig.json │ │ ├── web/ │ │ │ ├── index.hmr.js │ │ │ ├── template.html │ │ │ └── webpack/ │ │ │ ├── common.js │ │ │ ├── dev.js │ │ │ └── prod.js │ │ └── windows/ │ │ ├── .gitignore │ │ ├── RXPHelloWorld/ │ │ │ ├── App.xaml │ │ │ ├── App.xaml.cs │ │ │ ├── MainReactNativeHost.cs │ │ │ ├── Package.appxmanifest │ │ │ ├── Properties/ │ │ │ │ ├── AssemblyInfo.cs │ │ │ │ └── Default.rd.xml │ │ │ ├── RXPHelloWorld.csproj │ │ │ ├── RXPHelloWorld_TemporaryKey.pfx │ │ │ └── ReactAssets/ │ │ │ └── .gitignore │ │ └── RXPHelloWorld.sln │ └── hello-world-js/ │ ├── .eslintrc │ ├── .gitignore │ ├── README.md │ ├── android/ │ │ ├── app/ │ │ │ ├── BUCK │ │ │ ├── build.gradle │ │ │ ├── build_defs.bzl │ │ │ ├── proguard-rules.pro │ │ │ └── src/ │ │ │ ├── debug/ │ │ │ │ ├── AndroidManifest.xml │ │ │ │ └── res/ │ │ │ │ └── xml/ │ │ │ │ └── react_native_config.xml │ │ │ └── main/ │ │ │ ├── AndroidManifest.xml │ │ │ ├── java/ │ │ │ │ └── com/ │ │ │ │ └── rxphelloworld/ │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── res/ │ │ │ └── values/ │ │ │ ├── strings.xml │ │ │ └── styles.xml │ │ ├── build.gradle │ │ ├── gradle/ │ │ │ └── wrapper/ │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ │ ├── gradle.properties │ │ ├── gradlew │ │ ├── gradlew.bat │ │ ├── keystores/ │ │ │ ├── BUCK │ │ │ └── debug.keystore.properties │ │ └── settings.gradle │ ├── babel.config.js │ ├── index.js │ ├── ios/ │ │ ├── RXPHelloWorld/ │ │ │ ├── AppDelegate.h │ │ │ ├── AppDelegate.m │ │ │ ├── Base.lproj/ │ │ │ │ └── LaunchScreen.xib │ │ │ ├── Images.xcassets/ │ │ │ │ ├── AppIcon.appiconset/ │ │ │ │ │ └── Contents.json │ │ │ │ └── Contents.json │ │ │ ├── Info.plist │ │ │ └── main.m │ │ ├── RXPHelloWorld-tvOS/ │ │ │ └── Info.plist │ │ ├── RXPHelloWorld-tvOSTests/ │ │ │ └── Info.plist │ │ ├── RXPHelloWorld.xcodeproj/ │ │ │ ├── project.pbxproj │ │ │ └── xcshareddata/ │ │ │ └── xcschemes/ │ │ │ ├── RXPHelloWorld-tvOS.xcscheme │ │ │ └── RXPHelloWorld.xcscheme │ │ └── RXPHelloWorldTests/ │ │ ├── Info.plist │ │ └── RXPHelloWorldTests.m │ ├── jest/ │ │ ├── enzyme.config.js │ │ └── jest.config.js │ ├── metro.config.js │ ├── package.json │ ├── scripts/ │ │ └── react-native.js │ ├── src/ │ │ ├── App.js │ │ ├── config.js │ │ ├── controls/ │ │ │ ├── ProgressIndicator.js │ │ │ └── ToggleSwitch.js │ │ ├── index.js │ │ └── views/ │ │ ├── MainPanel.js │ │ ├── RootView.js │ │ └── SecondPanel.js │ ├── web/ │ │ ├── index.hmr.js │ │ ├── template.html │ │ └── webpack/ │ │ ├── common.js │ │ ├── dev.js │ │ └── prod.js │ └── windows/ │ ├── .gitignore │ ├── RXPHelloWorld/ │ │ ├── App.xaml │ │ ├── App.xaml.cs │ │ ├── MainReactNativeHost.cs │ │ ├── Package.appxmanifest │ │ ├── Properties/ │ │ │ ├── AssemblyInfo.cs │ │ │ └── Default.rd.xml │ │ ├── RXPHelloWorld.csproj │ │ ├── RXPHelloWorld_TemporaryKey.pfx │ │ └── ReactAssets/ │ │ └── .gitignore │ └── RXPHelloWorld.sln ├── src/ │ ├── ReactXP.ts │ ├── android/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityUtil.ts │ │ ├── GestureView.tsx │ │ ├── Image.tsx │ │ ├── ReactXP.ts │ │ ├── StatusBar.ts │ │ └── Text.tsx │ ├── common/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityUtil.ts │ │ ├── AppConfig.ts │ │ ├── Bezier.ts │ │ ├── Easing.ts │ │ ├── GestureView.tsx │ │ ├── Image.ts │ │ ├── Interfaces.ts │ │ ├── Linking.ts │ │ ├── Location.ts │ │ ├── ModuleInterface.ts │ │ ├── PopupContainerViewBase.tsx │ │ ├── StyleLeakDetector.ts │ │ ├── Types.ts │ │ ├── assert.ts │ │ ├── lodashMini.ts │ │ └── utils/ │ │ ├── AutoFocusHelper.ts │ │ ├── EventHelpers.ts │ │ ├── FocusManager.ts │ │ ├── PromiseDefer.ts │ │ └── Timers.ts │ ├── ios/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityUtil.ts │ │ ├── GestureView.tsx │ │ ├── Linking.ts │ │ ├── ReactXP.ts │ │ └── StatusBar.ts │ ├── macos/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityUtil.ts │ │ ├── GestureView.tsx │ │ ├── Input.ts │ │ ├── Linking.ts │ │ ├── ReactXP.ts │ │ ├── StatusBar.ts │ │ └── View.tsx │ ├── native-common/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityUtil.ts │ │ ├── ActivityIndicator.tsx │ │ ├── Alert.ts │ │ ├── Animated.tsx │ │ ├── App.ts │ │ ├── Button.tsx │ │ ├── Clipboard.ts │ │ ├── FrontLayerViewManager.tsx │ │ ├── GestureView.tsx │ │ ├── Image.tsx │ │ ├── Input.ts │ │ ├── International.ts │ │ ├── Link.tsx │ │ ├── Linking.ts │ │ ├── MainViewStore.ts │ │ ├── Modal.ts │ │ ├── ModalContainer.tsx │ │ ├── Picker.tsx │ │ ├── Platform.ts │ │ ├── Popup.ts │ │ ├── PopupContainerView.tsx │ │ ├── RootView.tsx │ │ ├── ScrollView.tsx │ │ ├── Storage.ts │ │ ├── StyleLeakDetector.ts │ │ ├── Styles.ts │ │ ├── Text.tsx │ │ ├── TextInput.tsx │ │ ├── UserInterface.tsx │ │ ├── UserPresence.ts │ │ ├── View.tsx │ │ ├── ViewBase.tsx │ │ └── utils/ │ │ ├── EventHelpers.ts │ │ └── lodashMini.ts │ ├── native-desktop/ │ │ ├── App.ts │ │ ├── Input.ts │ │ ├── RootView.tsx │ │ ├── ScrollView.tsx │ │ └── utils/ │ │ └── FocusManager.ts │ ├── tslint/ │ │ ├── groupedImportRule.ts │ │ ├── incorrectThisPropsRule.ts │ │ └── noUnreferencedStylesRule.ts │ ├── typings/ │ │ ├── prop-types.d.ts │ │ ├── react-native-extensions.d.ts │ │ ├── react-native-windows.d.ts │ │ ├── rebound.d.ts │ │ └── window.d.ts │ ├── web/ │ │ ├── Accessibility.ts │ │ ├── AccessibilityAnnouncer.tsx │ │ ├── AccessibilityUtil.ts │ │ ├── ActivityIndicator.tsx │ │ ├── Alert.tsx │ │ ├── AlertModalContent.tsx │ │ ├── Animated.tsx │ │ ├── App.ts │ │ ├── Button.tsx │ │ ├── Clipboard.ts │ │ ├── CustomScrollbar.ts │ │ ├── FrontLayerViewManager.tsx │ │ ├── GestureView.tsx │ │ ├── Image.tsx │ │ ├── Input.ts │ │ ├── International.ts │ │ ├── Link.tsx │ │ ├── Linking.ts │ │ ├── Modal.ts │ │ ├── ModalContainer.tsx │ │ ├── Picker.tsx │ │ ├── Platform.ts │ │ ├── Popup.ts │ │ ├── PopupContainerView.tsx │ │ ├── ReactXP.ts │ │ ├── RootView.tsx │ │ ├── ScrollView.tsx │ │ ├── ScrollViewConfig.ts │ │ ├── StatusBar.tsx │ │ ├── Storage.ts │ │ ├── Styles.ts │ │ ├── Text.tsx │ │ ├── TextInput.tsx │ │ ├── UserInterface.ts │ │ ├── UserPresence.ts │ │ ├── View.tsx │ │ ├── ViewBase.tsx │ │ ├── animated/ │ │ │ └── executeTransition.ts │ │ ├── listAnimations/ │ │ │ ├── AnimateListEdits.tsx │ │ │ └── MonitorListEdits.tsx │ │ ├── utils/ │ │ │ ├── AppVisibilityUtils.ts │ │ │ ├── FocusManager.ts │ │ │ ├── MouseResponder.ts │ │ │ ├── lodashMini.ts │ │ │ └── restyleForInlineText.tsx │ │ └── window.ts │ └── windows/ │ ├── Accessibility.ts │ ├── AccessibilityAnnouncer.tsx │ ├── AccessibilityUtil.ts │ ├── App.ts │ ├── Button.tsx │ ├── GestureView.tsx │ ├── Link.tsx │ ├── ReactXP.ts │ ├── RootView.tsx │ ├── StatusBar.ts │ ├── Text.tsx │ ├── TextInput.tsx │ └── View.tsx └── tsconfig.json
Showing preview only (227K chars total). Download the full file or copy to clipboard to get everything.
SYMBOL INDEX (2664 symbols across 316 files)
FILE: docs/_plugins/sass.rb
type Jekyll (line 1) | module Jekyll
class SassConverter (line 3) | class SassConverter < Converter
method matches (line 7) | def matches(ext)
method output_ext (line 11) | def output_ext(ext)
method convert (line 15) | def convert(content)
FILE: extensions/imagesvg/src/common/Interfaces.ts
type PluginInterface (line 22) | interface PluginInterface {
FILE: extensions/imagesvg/src/common/Types.ts
type ImageSvgStyle (line 12) | interface ImageSvgStyle extends RXTypes.ViewStyle {
type ImageSvgStyleRuleSet (line 15) | type ImageSvgStyleRuleSet = RXTypes.StyleRuleSet<ImageSvgStyle>;
type SvgCommonProps (line 17) | interface SvgCommonProps {
type ImageSvgProps (line 26) | interface ImageSvgProps extends SvgCommonProps, RXTypes.CommonStyledProp...
type SvgPathProps (line 37) | interface SvgPathProps extends SvgCommonProps {
type SvgRectProps (line 41) | interface SvgRectProps extends SvgCommonProps {
class ImageSvg (line 48) | class ImageSvg extends React.Component<ImageSvgProps, RXTypes.Stateless> {}
FILE: extensions/imagesvg/src/native-common/ImageSvg.tsx
class ImageSvg (line 16) | class ImageSvg extends React.Component<ImageSvgProps, {}> {
method render (line 17) | render() {
FILE: extensions/imagesvg/src/native-common/SvgPath.tsx
class SvgPath (line 15) | class SvgPath extends React.Component<SvgPathProps, {}> {
method render (line 16) | render() {
FILE: extensions/imagesvg/src/native-common/SvgRect.tsx
class SvgRect (line 15) | class SvgRect extends React.Component<SvgRectProps, {}> {
method render (line 16) | render() {
FILE: extensions/imagesvg/src/typings/react-native-svg.d.ts
type ArrayType (line 15) | type ArrayType = [string] | [number];
type SvgProps (line 17) | interface SvgProps extends RN.ComponentPropsBase {
type BaseProps (line 26) | interface BaseProps extends RN.ComponentPropsBase {
type TransformProps (line 45) | interface TransformProps extends BaseProps {
type PathProps (line 51) | interface PathProps extends BaseProps {
type RectProps (line 55) | interface RectProps extends BaseProps {
type TextProps (line 60) | interface TextProps extends BaseProps {
class Svg (line 66) | class Svg extends React.Component<SvgProps, {}> { }
class Path (line 67) | class Path extends React.Component<PathProps, {}> { }
class Rect (line 68) | class Rect extends React.Component<RectProps, {}> { }
class Text (line 69) | class Text extends React.Component<TextProps, {}> { }
FILE: extensions/imagesvg/src/web/ImageSvg.tsx
class ImageSvg (line 16) | class ImageSvg extends React.Component<ImageSvgProps, {}> {
method render (line 17) | render() {
method _isFilterDropShadowSupported (line 78) | private _isFilterDropShadowSupported() {
FILE: extensions/imagesvg/src/web/SvgPath.tsx
class SvgPath (line 14) | class SvgPath extends React.Component<SvgPathProps, {}> {
method render (line 15) | render() {
FILE: extensions/imagesvg/src/web/SvgRect.tsx
class SvgRect (line 14) | class SvgRect extends React.Component<SvgRectProps, {}> {
method render (line 15) | render() {
FILE: extensions/imagesvg/src/windows/ImageSvg.tsx
class ImageSvg (line 16) | class ImageSvg extends React.Component<ImageSvgProps, {}> {
method render (line 17) | render(): any {
FILE: extensions/imagesvg/src/windows/SvgPath.tsx
class SvgPath (line 16) | class SvgPath extends React.Component<SvgPathProps, {}> {
method render (line 17) | render(): any {
FILE: extensions/imagesvg/src/windows/SvgRect.tsx
class SvgRect (line 16) | class SvgRect extends React.Component<SvgRectProps, {}> {
method render (line 17) | render(): any {
FILE: extensions/navigation/src/common/Types.ts
type ReactNode (line 13) | type ReactNode = React.ReactNode;
type NavigatorSceneConfigType (line 18) | enum NavigatorSceneConfigType {
type NavigatorRoute (line 26) | interface NavigatorRoute {
type NavigationTransitionSpec (line 41) | interface NavigationTransitionSpec {
type NavigationTransitionStyleConfig (line 49) | interface NavigationTransitionStyleConfig {
type CustomNavigatorSceneConfig (line 60) | interface CustomNavigatorSceneConfig {
type NavigatorProps (line 73) | interface NavigatorProps extends RX.CommonProps {
type CommandType (line 89) | enum CommandType {
type CommandParam (line 95) | interface CommandParam {
type NavigationCommand (line 100) | interface NavigationCommand {
type NavigatorState (line 106) | interface NavigatorState {
type NavigatorDelegateSelector (line 121) | interface NavigatorDelegateSelector {
method constructor (line 128) | constructor(navigator: Navigator<NavigatorState>) {
FILE: extensions/navigation/src/common/lodashMini.ts
type Dictionary (line 21) | interface Dictionary<T> {
FILE: extensions/navigation/src/native-common/Navigator.tsx
class DefaultDelegateSelector (line 25) | class DefaultDelegateSelector implements DelegateSelector {
method getNavigatorDelegate (line 26) | getNavigatorDelegate(navigator: BaseNavigator<NavigatorState>) {
class NavigatorImpl (line 31) | class NavigatorImpl extends BaseNavigator<NavigatorState> {
method constructor (line 35) | constructor(initialProps: NavigatorProps) {
method componentDidMount (line 44) | componentDidMount() {
method componentWillUnmount (line 48) | componentWillUnmount() {
method componentDidUpdate (line 52) | componentDidUpdate() {
method getRoutes (line 57) | protected getRoutes(): NavigatorRoute[] {
method push (line 62) | push(route: NavigatorRoute): void {
method pop (line 71) | pop(): void {
method replace (line 78) | replace(route: NavigatorRoute): void {
method replacePrevious (line 87) | replacePrevious(route: NavigatorRoute): void {
method replaceAtIndex (line 98) | replaceAtIndex(route: NavigatorRoute, index: number): void {
method immediatelyResetRouteStack (line 112) | immediatelyResetRouteStack(nextRouteStack: NavigatorRoute[]): void {
method popToRoute (line 116) | popToRoute(route: NavigatorRoute): void {
method popToTop (line 125) | popToTop(): void {
method getCurrentRoutes (line 134) | getCurrentRoutes(): NavigatorRoute[] {
method render (line 139) | render(): JSX.Element {
method _enqueueCommand (line 143) | private _enqueueCommand(command: NavigationCommand): void {
method _processCommand (line 148) | private _processCommand(): void {
FILE: extensions/navigation/src/native-common/NavigatorExperimentalDelegate.tsx
type NavigationSceneRendererProps (line 33) | type NavigationSceneRendererProps = Navigation.NavigationSceneRendererPr...
type NavigationState (line 34) | type NavigationState = Navigation.NavigationState;
type NavigationRoute (line 35) | type NavigationRoute = Navigation.NavigationRoute;
type NavigationTransitionProps (line 36) | type NavigationTransitionProps = Navigation.NavigationTransitionProps;
type NavigationRouteState (line 40) | interface NavigationRouteState extends NavigationRoute {
type TransitionSpec (line 44) | interface TransitionSpec {
class NavigatorExperimentalDelegate (line 53) | class NavigatorExperimentalDelegate extends NavigatorDelegate {
method constructor (line 58) | constructor(navigator: Navigator<NavigatorState>) {
method getRoutes (line 65) | getRoutes(): NavigatorRoute[] {
method immediatelyResetRouteStack (line 73) | immediatelyResetRouteStack(nextRouteStack: NavigatorRoute[]): void {
method render (line 81) | render(): JSX.Element {
method _convertCustomTransitionConfig (line 99) | private _convertCustomTransitionConfig(
method _buildTransitionSpec (line 126) | private _buildTransitionSpec(state: Navigation.NavigationState): Trans...
method handleBackPress (line 225) | handleBackPress(): void {
method processCommand (line 229) | processCommand(commandQueue: NavigationCommand[]): void {
method _createState (line 297) | private _createState(route: NavigatorRoute): NavigationRouteState {
method _createParentState (line 301) | private _createParentState(routes: NavigatorRoute[], prevState: Naviga...
method _popToTop (line 318) | private _popToTop(state: NavigationState): NavigationState {
method _popN (line 327) | private _popN(state: NavigationState, n: number): NavigationState {
method _popToRoute (line 339) | private _popToRoute(state: NavigationState, route: NavigatorRoute): Na...
FILE: extensions/navigation/src/typings/react-native-deprecated-custom-components.d.ts
type NavigatorProps (line 4) | interface NavigatorProps extends RN.ComponentPropsBase {
class Navigator (line 16) | class Navigator extends RN.ReactNativeBaseComponent<NavigatorProps, {}> {
FILE: extensions/navigation/src/typings/rebound.d.ts
class SpringSystem (line 2) | class SpringSystem {
FILE: extensions/navigation/src/web/Navigator.tsx
type SpringSystem (line 31) | interface SpringSystem {
type Spring (line 35) | interface Spring {
type TransitionToCallback (line 90) | type TransitionToCallback = () => void;
type ReplaceAtIndexCallback (line 91) | type ReplaceAtIndexCallback = () => void;
type TransitionToQueueItem (line 93) | interface TransitionToQueueItem {
type NavigatorState (line 105) | interface NavigatorState extends BaseNavigatorState {
class NavigatorImpl (line 126) | class NavigatorImpl extends NavigatorBase<NavigatorState> {
method constructor (line 146) | constructor(initialProps?: NavigatorProps) {
method UNSAFE_componentWillMount (line 159) | UNSAFE_componentWillMount() {
method componentDidMount (line 174) | componentDidMount() {
method componentDidUpdate (line 179) | componentDidUpdate() {
method render (line 183) | render() {
method jumpTo (line 225) | jumpTo(route: Types.NavigatorRoute): void {
method jumpForward (line 230) | jumpForward(): void {
method jumpBack (line 234) | jumpBack(): void {
method push (line 238) | push(route: Types.NavigatorRoute): void {
method immediatelyResetRouteStack (line 258) | immediatelyResetRouteStack(nextRouteStack: Types.NavigatorRoute[]): vo...
method pop (line 276) | pop(): void {
method replaceAtIndex (line 291) | replaceAtIndex(route: Types.NavigatorRoute, index: number): void {
method replace (line 313) | replace(route: Types.NavigatorRoute): void {
method replacePrevious (line 317) | replacePrevious(route: Types.NavigatorRoute): void {
method popToTop (line 321) | popToTop(): void {
method popToRoute (line 325) | popToRoute(route: Types.NavigatorRoute): void {
method replacePreviousAndPop (line 333) | replacePreviousAndPop(route: Types.NavigatorRoute): void {
method getCurrentRoutes (line 342) | getCurrentRoutes(): Types.NavigatorRoute[] {
method _updateDimensionsCache (line 351) | private _updateDimensionsCache() {
method _getSceneConfigFromRoute (line 364) | private _getSceneConfigFromRoute(route: Types.NavigatorRoute): Navigat...
method _renderNavigatorScene (line 373) | private _renderNavigatorScene(route: Types.NavigatorRoute, index: numb...
method _onMountScene (line 393) | private _onMountScene(comp: RX.View | null, sceneIndex: number) {
method _disableScene (line 404) | private _disableScene(sceneIndex: number) {
method _enableScene (line 417) | private _enableScene(sceneIndex: number, force = false) {
method _transitionTo (line 444) | private _transitionTo(destIndex: number, velocity?: number, jumpSpring...
method _completeTransition (line 490) | private _completeTransition() {
method _hideScenes (line 534) | private _hideScenes() {
method _handleSpringUpdate (line 547) | private _handleSpringUpdate() {
method _transitionSceneStyle (line 558) | private _transitionSceneStyle(fromIndex: number, toIndex: number, prog...
method _transitionBetween (line 585) | private _transitionBetween(fromIndex: number, toIndex: number, progres...
method _getDestIndexWithinBounds (line 590) | private _getDestIndexWithinBounds(n: number) {
method _jumpN (line 601) | private _jumpN(n: number) {
method _popN (line 609) | private _popN(n: number) {
method _cleanScenesPastIndex (line 627) | private _cleanScenesPastIndex(index: number) {
method _getRouteID (line 640) | private _getRouteID(route: Types.NavigatorRoute): number {
method _invariant (line 645) | private _invariant(test: boolean, failureMessage: string) {
method _setNativeStyles (line 653) | private _setNativeStyles(component: React.ReactInstance, currentStyles...
FILE: extensions/navigation/src/web/NavigatorSceneConfigFactory.tsx
type Interpolator (line 20) | type Interpolator = (progress: number, dimension?: RX.Types.Dimensions) ...
type InterpolatorWrapper (line 21) | type InterpolatorWrapper = (previousStyleSet: RX.Types.ViewStyleRuleSet,
type TransitionStyle (line 25) | interface TransitionStyle {
class SceneConfigStyles (line 40) | class SceneConfigStyles {
method bundleCompoundStyles (line 108) | static bundleCompoundStyles(styles: { [name: string]: string | number ...
class NavigatorSceneConfig (line 144) | class NavigatorSceneConfig {
method constructor (line 158) | constructor(intoStyle: TransitionStyle, outStyle: TransitionStyle) {
method _styleInterpolator (line 169) | private _styleInterpolator(styles: TransitionStyle): InterpolatorWrapp...
class NavigatorSceneConfigFactory (line 195) | class NavigatorSceneConfigFactory {
method createConfig (line 198) | static createConfig(configType: Types.NavigatorSceneConfigType): Navig...
FILE: extensions/netinfo/src/common/Interfaces.ts
type PluginInterface (line 21) | interface PluginInterface {
FILE: extensions/netinfo/src/common/Types.ts
type DeviceNetworkType (line 10) | enum DeviceNetworkType {
FILE: extensions/netinfo/src/native-common/NetInfo.tsx
class NetInfo (line 15) | class NetInfo extends Interfaces.NetInfo {
method constructor (line 16) | constructor() {
method isConnected (line 26) | isConnected(): Promise<boolean> {
method getType (line 32) | getType(): Promise<Types.DeviceNetworkType> {
method _getNetworkTypeFromConnectionInfo (line 36) | private static _getNetworkTypeFromConnectionInfo(state: RNNetInfo.NetI...
FILE: extensions/netinfo/src/web/NetInfo.tsx
class NetInfo (line 13) | class NetInfo extends Interfaces.NetInfo {
method constructor (line 14) | constructor() {
method isConnected (line 28) | isConnected(): Promise<boolean> {
method getType (line 32) | getType(): Promise<Types.DeviceNetworkType> {
FILE: extensions/video/src/common/Interfaces.ts
type PluginInterface (line 22) | interface PluginInterface {
FILE: extensions/video/src/common/Types.ts
type VideoProgress (line 14) | interface VideoProgress {
type VideoInfo (line 22) | interface VideoInfo {
type VideoProps (line 30) | interface VideoProps extends RXTypes.CommonStyledProps<RXTypes.ViewStyle...
FILE: extensions/video/src/native-common/Video.tsx
type VideoState (line 16) | interface VideoState {
class Video (line 22) | class Video extends RX.Component<Types.VideoProps, VideoState> {
method constructor (line 25) | constructor(props: Types.VideoProps) {
method render (line 34) | render() {
method seek (line 138) | seek(position: number) {
method seekPercent (line 144) | seekPercent(percentage: number) {
method play (line 152) | play() {
method pause (line 156) | pause() {
method stop (line 160) | stop() {
method mute (line 165) | mute(muted: boolean) {
FILE: extensions/video/src/typings/react-native-video.d.ts
type VideoProgress (line 16) | interface VideoProgress {
type VideoInfo (line 24) | interface VideoInfo {
type VideoBufferInfo (line 32) | interface VideoBufferInfo {
type VideoProps (line 36) | interface VideoProps extends RN.ComponentPropsBase {
class Video (line 81) | class Video extends React.Component<VideoProps, {}> {
FILE: extensions/video/src/web/Video.tsx
class Video (line 18) | class Video extends RX.Component<Types.VideoProps, {}> {
method componentDidMount (line 19) | componentDidMount() {
method componentWillUnmount (line 31) | componentWillUnmount() {
method render (line 39) | render() {
method seek (line 94) | seek(position: number) {
method seekPercent (line 101) | seekPercent(percentage: number) {
method play (line 108) | play() {
method pause (line 116) | pause() {
method stop (line 123) | stop() {
method mute (line 131) | mute(muted: boolean) {
FILE: extensions/video/src/windows/Video.tsx
type VideoState (line 17) | interface VideoState {
class Video (line 22) | class Video extends RX.Component<Types.VideoProps, VideoState> {
method render (line 24) | render() {
method seek (line 38) | seek(position: number) {
method seekPercent (line 42) | seekPercent(percentage: number) {
method play (line 46) | play() {
method pause (line 50) | pause() {
method stop (line 54) | stop() {
method mute (line 59) | mute(muted: boolean) {
FILE: extensions/virtuallistview/src/VirtualListCell.tsx
type VirtualListCellInfo (line 15) | interface VirtualListCellInfo {
type VirtualListCellRenderDetails (line 21) | interface VirtualListCellRenderDetails<T extends VirtualListCellInfo> {
type VirtualListCellProps (line 27) | interface VirtualListCellProps<ItemInfo extends VirtualListCellInfo> ext...
type StaticRendererProps (line 57) | interface StaticRendererProps<ItemInfo extends VirtualListCellInfo> exte...
class VirtualListCell (line 84) | class VirtualListCell<ItemInfo extends VirtualListCellInfo> extends RX.C...
method constructor (line 91) | constructor(props: StaticRendererProps<CellItemInfo>) {
method shouldComponentUpdate (line 95) | shouldComponentUpdate(nextProps: StaticRendererProps<CellItemInfo>): b...
method render (line 101) | render() {
method constructor (line 138) | constructor(props: VirtualListCellProps<ItemInfo>) {
method UNSAFE_componentWillReceiveProps (line 176) | UNSAFE_componentWillReceiveProps(nextProps: VirtualListCellProps<ItemI...
method shouldComponentUpdate (line 209) | shouldComponentUpdate(nextProps: VirtualListCellProps<ItemInfo>): bool...
method componentDidUpdate (line 226) | componentDidUpdate(prevProps: VirtualListCellProps<ItemInfo>) {
method componentWillUnmount (line 234) | componentWillUnmount() {
method setVisibility (line 241) | setVisibility(isVisible: boolean) {
method isVisible (line 253) | isVisible() {
method setTop (line 257) | setTop(top: number, animate = false, animationDelay = 0, animationOver...
method cancelPendingAnimation (line 323) | cancelPendingAnimation() {
method setItemKey (line 329) | setItemKey(key: string | undefined) {
method getTop (line 333) | getTop() {
method focus (line 337) | focus() {
method render (line 344) | render() {
FILE: extensions/virtuallistview/src/VirtualListView.tsx
type VirtualListViewItemInfo (line 46) | interface VirtualListViewItemInfo extends VirtualListCellInfo {
type VirtualListViewCellRenderDetails (line 67) | interface VirtualListViewCellRenderDetails<T extends VirtualListViewItem...
type VirtualListViewProps (line 71) | interface VirtualListViewProps<ItemInfo extends VirtualListViewItemInfo>
type VirtualListViewState (line 128) | interface VirtualListViewState {
type VirtualCellInfo (line 134) | interface VirtualCellInfo<ItemInfo extends VirtualListViewItemInfo> {
type FocusDirection (line 146) | enum FocusDirection {
class VirtualListView (line 186) | class VirtualListView<ItemInfo extends VirtualListViewItemInfo>
method constructor (line 273) | constructor(props: VirtualListViewProps<ItemInfo>) {
method UNSAFE_componentWillReceiveProps (line 287) | UNSAFE_componentWillReceiveProps(nextProps: VirtualListViewProps<ItemI...
method UNSAFE_componentWillUpdate (line 293) | UNSAFE_componentWillUpdate(nextProps: VirtualListViewProps<ItemInfo>, ...
method _setupForAccessibility (line 310) | private _setupForAccessibility() {
method _tearDownForAccessibility (line 327) | private _tearDownForAccessibility() {
method _isAndroidScreenReaderEnabled (line 340) | private _isAndroidScreenReaderEnabled() {
method _updateStateFromProps (line 344) | private _updateStateFromProps(props: VirtualListViewProps<ItemInfo>, i...
method _handleItemListChange (line 367) | private _handleItemListChange(props: VirtualListViewProps<ItemInfo>) {
method _calcOverdrawAmount (line 501) | private _calcOverdrawAmount() {
method _calcNewRenderedItemState (line 682) | private _calcNewRenderedItemState(props: VirtualListViewProps<ItemInfo...
method _reconcileCorrections (line 904) | private _reconcileCorrections(props: VirtualListViewProps<ItemInfo>) {
method _popInvisibleIntoView (line 950) | private _popInvisibleIntoView(props: VirtualListViewProps<ItemInfo>) {
method _resizeAllItems (line 967) | private _resizeAllItems(props: VirtualListViewProps<ItemInfo>) {
method _renderIfDirty (line 974) | private _renderIfDirty(props: VirtualListViewProps<ItemInfo>): void {
method _allocateCell (line 984) | private _allocateCell(itemKey: string, itemTemplate: string | undefine...
method _recycleCell (line 1045) | private _recycleCell(itemKey: string) {
method _setCellTopAndVisibility (line 1072) | private _setCellTopAndVisibility(itemKey: string, isVisibile: boolean,...
method _isCellVisible (line 1096) | private _isCellVisible(itemKey: string): boolean {
method render (line 1108) | render() {
method selectItemKey (line 1289) | selectItemKey(key: string, scrollToItem = true) {
method _scrollToItemKey (line 1326) | private _scrollToItemKey(key: string): void {
method _scrollToItemIndex (line 1340) | private _scrollToItemIndex(index: number): void {
method _focusSubsequentItem (line 1345) | private _focusSubsequentItem(direction: FocusDirection, viaKeyboard: b...
method componentDidMount (line 1392) | componentDidMount() {
method componentWillUnmount (line 1408) | componentWillUnmount() {
method componentDidUpdate (line 1414) | componentDidUpdate(prevProps: VirtualListViewProps<ItemInfo>) {
method _componentDidRender (line 1418) | protected _componentDidRender() {
method _setFocusIfNeeded (line 1438) | private _setFocusIfNeeded() {
method _shouldShowItem (line 1446) | private _shouldShowItem(item: VirtualListViewItemInfo, props: VirtualL...
method _calcHeightOfItems (line 1452) | private _calcHeightOfItems(props: VirtualListViewProps<ItemInfo>, star...
method _isItemHeightKnown (line 1460) | private _isItemHeightKnown(item: VirtualListViewItemInfo) {
method _getHeightOfItem (line 1464) | private _getHeightOfItem(item: VirtualListViewItemInfo | undefined) {
FILE: extensions/webview/src/common/Interfaces.ts
type PluginInterface (line 13) | interface PluginInterface {
FILE: extensions/webview/src/common/Types.ts
type WebViewNavigationState (line 13) | interface WebViewNavigationState {
type WebViewErrorState (line 22) | interface WebViewErrorState extends WebViewNavigationState {
type WebViewSandboxMode (line 28) | enum WebViewSandboxMode {
type WebViewSource (line 44) | interface WebViewSource {
type WebViewShouldStartLoadEvent (line 49) | interface WebViewShouldStartLoadEvent {
type WebViewNavigationEvent (line 53) | interface WebViewNavigationEvent extends RXTypes.SyntheticEvent {
type WebViewErrorEvent (line 57) | interface WebViewErrorEvent extends RXTypes.SyntheticEvent {
type WebViewMessageEvent (line 61) | interface WebViewMessageEvent extends RXTypes.SyntheticEvent {
type WebViewProps (line 66) | interface WebViewProps extends RXTypes.CommonStyledProps<RXTypes.ViewSty...
FILE: extensions/webview/src/native-common/WebView.tsx
type MixedContentMode (line 30) | type MixedContentMode = 'never' | 'always' | 'compatibility' | undefined;
class WebView (line 32) | class WebView extends React.Component<Types.WebViewProps, RX.Types.State...
method render (line 35) | render() {
method _sandboxToMixedContentMode (line 64) | private _sandboxToMixedContentMode(sandbox?: Types.WebViewSandboxMode)...
method _buildSource (line 99) | private _buildSource(): RNWebViewSourceUri | RNWebViewSourceHtml | und...
method _buildInjectedJavascript (line 113) | private _buildInjectedJavascript(): string {
method postMessage (line 150) | postMessage(message: string, targetOrigin = '*') {
method reload (line 156) | reload() {
method goBack (line 162) | goBack() {
method goForward (line 168) | goForward() {
FILE: extensions/webview/src/web/WebView.tsx
type WebViewState (line 28) | interface WebViewState {
type WebViewMessageEventInternal (line 34) | interface WebViewMessageEventInternal extends Types.WebViewMessageEvent {
class WebView (line 38) | class WebView extends React.Component<Types.WebViewProps, WebViewState> ...
method constructor (line 46) | constructor(props: Types.WebViewProps) {
method componentDidMount (line 58) | componentDidMount() {
method componentDidUpdate (line 67) | componentDidUpdate(prevProps: Types.WebViewProps, prevState: WebViewSt...
method componentWillUnmount (line 80) | componentWillUnmount() {
method _getCustomHtml (line 87) | private _getCustomHtml(props: Types.WebViewProps): string | undefined {
method _setContents (line 95) | private _setContents(html: string) {
method _installMessageListener (line 108) | private _installMessageListener() {
method _postRender (line 154) | private _postRender() {
method render (line 169) | render() {
method postMessage (line 240) | postMessage(message: string, targetOrigin = '*') {
method reload (line 247) | reload() {
method goBack (line 254) | goBack() {
method goForward (line 261) | goForward() {
FILE: samples/ImageList/android/app/src/main/java/com/rxpimagelist/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: samples/ImageList/android/app/src/main/java/com/rxpimagelist/MainApplication.java
class MainApplication (line 14) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 17) | @Override
method getPackages (line 22) | @Override
method getJSMainModuleName (line 29) | @Override
method getReactNativeHost (line 35) | @Override
method onCreate (line 40) | @Override
FILE: samples/ImageList/src/App.tsx
class App (line 11) | class App {
method init (line 12) | init() {
method _renderRootView (line 17) | private _renderRootView() {
FILE: samples/ImageList/src/config.ts
constant DEBUG (line 3) | const DEBUG = __DEV__;
constant DEV (line 4) | const DEV = __DEV__;
FILE: samples/ImageList/src/controls/SearchField.tsx
type SearchFieldProps (line 10) | interface SearchFieldProps {
type SearchFieldState (line 14) | interface SearchFieldState {
class SearchField (line 30) | class SearchField extends RX.Component<SearchFieldProps, SearchFieldStat...
method render (line 33) | render() {
FILE: samples/ImageList/src/services/GiphyClient.ts
type GiphyImageDescriptor (line 8) | interface GiphyImageDescriptor {
type GiphyImages (line 14) | interface GiphyImages {
type GiphyDataImage (line 23) | interface GiphyDataImage {
type GiphySearchResponse (line 27) | interface GiphySearchResponse {
type GiphySearchResult (line 31) | interface GiphySearchResult {
constant GIPHY_API_URL (line 36) | const GIPHY_API_URL = 'https://api.giphy.com/v1/gifs/search';
constant GIPHY_API_KEY (line 37) | const GIPHY_API_KEY = 'dc6zaTOxFJmzC';
class GiphyClient (line 39) | class GiphyClient extends GenericRestClient {
method searchImages (line 40) | searchImages(query: string, limit = 25, offset = 0, rating = 'g'): Syn...
FILE: samples/ImageList/src/stores/ImageStore.ts
type Image (line 10) | interface Image {
class ImageStore (line 16) | class ImageStore extends StoreBase {
method getImages (line 26) | getImages() {
method getSearchQuery (line 31) | getSearchQuery() {
method isPerformingSearch (line 36) | isPerformingSearch() {
method isFirstSearch (line 41) | isFirstSearch() {
method updateImages (line 45) | updateImages(searchQuery: string) {
method _searchImages (line 71) | private _searchImages(query: string): SyncTasks.Promise<void> {
method _cancelPreviousSearch (line 86) | private _cancelPreviousSearch(): void {
method _shouldSkipSearch (line 94) | private _shouldSkipSearch(query: string): boolean {
FILE: samples/ImageList/src/views/ImageList.tsx
type ImageListItemInfo (line 12) | interface ImageListItemInfo extends VirtualListViewItemInfo {
type ImageListState (line 16) | interface ImageListState {
class ImageList (line 68) | class ImageList extends ComponentBase<{}, ImageListState> {
method render (line 69) | render() {
method _buildState (line 100) | protected _buildState(): ImageListState {
FILE: samples/ImageList/src/views/RootView.tsx
class RootView (line 30) | class RootView extends RX.Component {
method render (line 31) | render() {
FILE: samples/ImageList/web/webpack/common.js
constant ROOT_PATH (line 6) | const ROOT_PATH = path.join(__dirname, '..', '..');
constant DIST_PATH (line 7) | const DIST_PATH = path.join(ROOT_PATH, 'dist-web');
constant APP_PATH (line 8) | const APP_PATH = path.join(ROOT_PATH, 'src');
constant WEB_PATH (line 9) | const WEB_PATH = path.join(ROOT_PATH, 'web');
constant TS_CONFIG_PATH (line 10) | const TS_CONFIG_PATH = path.join(ROOT_PATH, 'tsconfig.json');
FILE: samples/ImageList/windows/RXPImageList/App.xaml.cs
class App (line 8) | sealed partial class App : ReactApplication
method App (line 16) | public App()
FILE: samples/ImageList/windows/RXPImageList/MainReactNativeHost.cs
class MainReactNativeHost (line 8) | class MainReactNativeHost : ReactNativeHost
FILE: samples/RXPTest/android/app/src/main/java/com/rxphelloworld/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: samples/RXPTest/android/app/src/main/java/com/rxphelloworld/MainApplication.java
class MainApplication (line 17) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 20) | @Override
method getPackages (line 25) | @Override
method getJSMainModuleName (line 34) | @Override
method getReactNativeHost (line 40) | @Override
method onCreate (line 45) | @Override
FILE: samples/RXPTest/src/App.tsx
type AppState (line 12) | interface AppState {
class App (line 17) | class App extends RX.Component<RX.CommonProps, AppState> {
method constructor (line 18) | constructor(props: RX.CommonProps) {
method render (line 27) | render(): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Test.tsx
type TestType (line 7) | const enum TestType {
class TestResult (line 15) | class TestResult {
method constructor (line 16) | constructor() {
type Test (line 25) | interface Test {
type AutoExecutableTest (line 41) | interface AutoExecutableTest extends Test {
FILE: samples/RXPTest/src/TestContainer.tsx
type TestContainerProps (line 81) | interface TestContainerProps extends RX.CommonProps {
type TestContainerState (line 88) | interface TestContainerState {
class TestContainer (line 94) | class TestContainer extends RX.Component<TestContainerProps, TestContain...
method constructor (line 95) | constructor(props: TestContainerProps) {
method componentDidUpdate (line 104) | componentDidUpdate(prevProps: TestContainerProps, prevState: TestConta...
method render (line 112) | render() {
method _executeTest (line 237) | private _executeTest() {
FILE: samples/RXPTest/src/TestListView.tsx
type TestListViewProps (line 94) | interface TestListViewProps extends RX.CommonProps {
type TestListViewState (line 99) | interface TestListViewState {
class TestListView (line 103) | class TestListView extends RX.Component<TestListViewProps, TestListViewS...
method constructor (line 104) | constructor(props: TestListViewProps) {
method render (line 112) | render() {
method _onPressItem (line 184) | private _onPressItem(path: string) {
FILE: samples/RXPTest/src/TestRegistry.ts
class TestRegistry (line 44) | class TestRegistry {
method constructor (line 48) | constructor() {
method registerTest (line 91) | registerTest(test: Test) {
method getAllTests (line 95) | getAllTests(): {[path: string]: Test } {
method getTest (line 99) | getTest(path: string): Test {
method getResult (line 103) | getResult(path: string): TestResult {
method setResult (line 107) | setResult(path: string, result: TestResult): void {
method formatPath (line 111) | formatPath(path: string): string {
FILE: samples/RXPTest/src/Tests/AccessibilityTest.tsx
type AccessibilityState (line 48) | interface AccessibilityState {
class AccessibilityView (line 53) | class AccessibilityView extends RX.Component<RX.CommonProps, Accessibili...
method constructor (line 57) | constructor(props: RX.CommonProps) {
method componentDidMount (line 66) | componentDidMount() {
method componentWillUnmount (line 76) | componentWillUnmount() {
method render (line 86) | render() {
method _sendTextToScreenReader (line 143) | private _sendTextToScreenReader(text: string) {
class AccessibilityTest (line 148) | class AccessibilityTest implements Test {
method getPath (line 149) | getPath(): string {
method getTestType (line 153) | getTestType(): TestType {
method render (line 157) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ActivityIndicatorTest.tsx
type ActivityIndicatorViewState (line 29) | interface ActivityIndicatorViewState {
class ActivityIndicatorView (line 33) | class ActivityIndicatorView extends RX.Component<RX.CommonProps, Activit...
method constructor (line 34) | constructor(props: RX.CommonProps) {
method render (line 42) | render() {
method execute (line 103) | execute(finished: () => void) {
class ActivityIndicatorTest (line 113) | class ActivityIndicatorTest implements AutoExecutableTest {
method getPath (line 114) | getPath(): string {
method getTestType (line 118) | getTestType(): TestType {
method render (line 122) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 130) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/AlertTest.tsx
type AlertViewState (line 85) | interface AlertViewState {
class AlertView (line 89) | class AlertView extends RX.Component<RX.CommonProps, AlertViewState> {
method constructor (line 90) | constructor(props: RX.CommonProps) {
method render (line 98) | render() {
method _showAlert (line 141) | private _showAlert(custom: boolean, preventDismissOnPress: boolean) {
method _setLastOption (line 169) | private _setLastOption(option: string) {
class AlertTest (line 174) | class AlertTest implements Test {
method getPath (line 175) | getPath(): string {
method getTestType (line 179) | getTestType(): TestType {
method render (line 183) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/AnimationTest.tsx
type AnimationViewState (line 82) | interface AnimationViewState {
class AnimationView (line 92) | class AnimationView extends RX.Component<RX.CommonProps, AnimationViewSt...
method constructor (line 139) | constructor(props: RX.CommonProps) {
method componentDidMount (line 151) | componentDidMount() {
method componentWillUnmount (line 155) | componentWillUnmount() {
method render (line 159) | render() {
method _executeNextStage (line 247) | private _executeNextStage() {
method execute (line 421) | execute(complete: (result: TestResult) => void): void {
class AnimationTest (line 436) | class AnimationTest implements AutoExecutableTest {
method getPath (line 437) | getPath(): string {
method getTestType (line 441) | getTestType(): TestType {
method render (line 445) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 451) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/AppTest.tsx
type AppState (line 39) | interface AppState {
class AppView (line 46) | class AppView extends RX.Component<RX.CommonProps, AppState> {
method constructor (line 50) | constructor(props: RX.CommonProps) {
method componentDidMount (line 62) | componentDidMount() {
method componentWillUnmount (line 75) | componentWillUnmount() {
method render (line 85) | render() {
method _activationStateToString (line 124) | private _activationStateToString(state: RX.Types.AppActivationState): ...
class AppTest (line 144) | class AppTest implements Test {
method getPath (line 145) | getPath(): string {
method getTestType (line 149) | getTestType(): TestType {
method render (line 153) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ButtonTest.tsx
type ButtonViewState (line 85) | interface ButtonViewState {
class ButtonView (line 100) | class ButtonView extends RX.Component<RX.CommonProps, ButtonViewState> {
method constructor (line 101) | constructor(props: RX.CommonProps) {
method render (line 117) | render() {
class ButtonTest (line 332) | class ButtonTest implements Test {
method getPath (line 333) | getPath(): string {
method getTestType (line 337) | getTestType(): TestType {
method render (line 341) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ClipboardTest.tsx
type ClipboardViewState (line 48) | interface ClipboardViewState {
class ClipboardView (line 55) | class ClipboardView extends RX.Component<RX.CommonProps, ClipboardViewSt...
method constructor (line 58) | constructor(props: RX.CommonProps) {
method render (line 67) | render() {
method _doCopy (line 111) | private _doCopy() {
method _doPaste (line 119) | private _doPaste() {
class ClipboardTest (line 132) | class ClipboardTest implements Test {
method getPath (line 133) | getPath(): string {
method getTestType (line 137) | getTestType(): TestType {
method render (line 141) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/DragAndDropTest.tsx
type DragAndDropViewState (line 59) | interface DragAndDropViewState {
type FileInfo (line 67) | interface FileInfo {
class DragAndDropView (line 72) | class DragAndDropView extends RX.Component<RX.CommonProps, DragAndDropVi...
method constructor (line 73) | constructor(props: RX.CommonProps) {
method render (line 85) | render() {
method _renderDroppedFiles (line 143) | private _renderDroppedFiles(): JSX.Element | undefined {
method _formatFileInfo (line 163) | private _formatFileInfo(file: FileInfo): JSX.Element {
method _renderViewDragStart (line 171) | private _renderViewDragStart(): JSX.Element | undefined {
class DragAndDropTest (line 278) | class DragAndDropTest implements Test {
method getPath (line 279) | getPath(): string {
method getTestType (line 283) | getTestType(): TestType {
method render (line 287) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/GestureViewTest.tsx
type GestureViewState (line 69) | interface GestureViewState {
class GestureViewView (line 76) | class GestureViewView extends RX.Component<RX.CommonProps, GestureViewSt...
method constructor (line 121) | constructor(props: RX.CommonProps) {
method render (line 132) | render() {
method _onPinchZoomTest1 (line 259) | private _onPinchZoomTest1(state: RX.Types.MultiTouchGestureState) {
method _onRotateTest1 (line 269) | private _onRotateTest1(state: RX.Types.MultiTouchGestureState) {
method _onDoubleTapTest1 (line 275) | private _onDoubleTapTest1(state: RX.Types.TapGestureState) {
method _onScrollWheelTest1 (line 282) | private _onScrollWheelTest1(state: RX.Types.ScrollWheelGestureState) {
method _onTapTest2 (line 291) | private _onTapTest2(gestureState: RX.Types.TapGestureState) {
method _onPanHorizontalTest2 (line 298) | private _onPanHorizontalTest2(state: RX.Types.PanGestureState) {
method _onPanVerticalTest2 (line 306) | private _onPanVerticalTest2(state: RX.Types.PanGestureState) {
method _onPanTest3 (line 314) | private _onPanTest3(state: RX.Types.PanGestureState) {
method _onTapTest4 (line 331) | private _onTapTest4(gestureState: RX.Types.TapGestureState) {
method _onContextMenu4 (line 338) | private _onContextMenu4(gestureState: RX.Types.TapGestureState) {
class GestureViewTest (line 345) | class GestureViewTest implements Test {
method getPath (line 348) | getPath(): string {
method getTestType (line 352) | getTestType(): TestType {
method render (line 356) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ImageApiTest.tsx
type ImageViewState (line 35) | interface ImageViewState {
class ImageView (line 39) | class ImageView extends RX.Component<RX.CommonProps, ImageViewState> {
method constructor (line 51) | constructor(props: RX.CommonProps) {
method componentDidMount (line 59) | componentDidMount() {
method componentWillUnmount (line 63) | componentWillUnmount() {
method render (line 67) | render() {
method _checkAllTestsComplete (line 212) | private _checkAllTestsComplete() {
method execute (line 240) | execute(complete: (result: TestResult) => void): void {
class ImageApiTest (line 254) | class ImageApiTest implements AutoExecutableTest {
method getPath (line 255) | getPath(): string {
method getTestType (line 259) | getTestType(): TestType {
method render (line 263) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 269) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/ImageInteractiveTest.tsx
class ImageView (line 34) | class ImageView extends RX.Component<RX.CommonProps, RX.Stateless> {
method render (line 35) | render() {
class ImageInteractiveTest (line 99) | class ImageInteractiveTest implements Test {
method getPath (line 100) | getPath(): string {
method getTestType (line 104) | getTestType(): TestType {
method render (line 108) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/InputTest.tsx
type InputState (line 30) | interface InputState {
class InputView (line 42) | class InputView extends RX.Component<RX.CommonProps, InputState> {
method constructor (line 47) | constructor(props: RX.CommonProps) {
method componentDidMount (line 61) | componentDidMount() {
method componentWillUnmount (line 93) | componentWillUnmount() {
method render (line 107) | render() {
class InputTest (line 153) | class InputTest implements Test {
method getPath (line 154) | getPath(): string {
method getTestType (line 158) | getTestType(): TestType {
method render (line 162) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/InternationalTest.tsx
type InternationalState (line 48) | interface InternationalState {
class InternationalView (line 53) | class InternationalView extends RX.Component<RX.CommonProps, Internation...
method constructor (line 54) | constructor(props: RX.CommonProps) {
method componentWillUnmount (line 63) | componentWillUnmount() {
method render (line 74) | render() {
class InternationalTest (line 130) | class InternationalTest implements Test {
method getPath (line 131) | getPath(): string {
method getTestType (line 135) | getTestType(): TestType {
method render (line 139) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/LinkTest.tsx
type LinkViewState (line 52) | interface LinkViewState {
class LinkView (line 57) | class LinkView extends RX.Component<RX.CommonProps, LinkViewState> {
method constructor (line 58) | constructor(props: RX.CommonProps) {
method render (line 67) | render() {
class LinkTest (line 136) | class LinkTest implements Test {
method getPath (line 137) | getPath(): string {
method getTestType (line 141) | getTestType(): TestType {
method render (line 145) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/LinkingTest.tsx
type LinkingState (line 56) | interface LinkingState {
class LinkingView (line 64) | class LinkingView extends RX.Component<RX.CommonProps, LinkingState> {
method constructor (line 67) | constructor(props: RX.CommonProps) {
method componentDidMount (line 79) | componentDidMount() {
method componentWillUnmount (line 97) | componentWillUnmount() {
method render (line 101) | render() {
method _formatLinkingError (line 258) | private _formatLinkingError(err: RX.Types.LinkingErrorInfo): string {
class LinkingTest (line 282) | class LinkingTest implements Test {
method getPath (line 283) | getPath(): string {
method getTestType (line 287) | getTestType(): TestType {
method render (line 291) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/LocationTest.tsx
type LocationState (line 44) | interface LocationState {
class LocationView (line 54) | class LocationView extends RX.Component<RX.CommonProps, LocationState> {
method constructor (line 59) | constructor(props: RX.CommonProps) {
method componentDidMount (line 69) | componentDidMount() {
method componentWillUnmount (line 73) | componentWillUnmount() {
method render (line 81) | render() {
method execute (line 116) | execute(complete: (result: TestResult) => void) {
method _formatPosition (line 222) | private _formatPosition(pos: Position) {
method _formatError (line 232) | private _formatError(error: RX.Types.LocationErrorType): string {
class LocationTest (line 249) | class LocationTest implements AutoExecutableTest {
method getPath (line 250) | getPath(): string {
method getTestType (line 254) | getTestType(): TestType {
method render (line 258) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 266) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/ModalTest.tsx
class ModalView (line 51) | class ModalView extends RX.Component<RX.CommonProps, RX.Stateless> {
method render (line 52) | render() {
method execute (line 66) | execute(complete: (result: TestResult) => void) {
class ModalTest (line 130) | class ModalTest implements AutoExecutableTest {
method getPath (line 131) | getPath(): string {
method getTestType (line 135) | getTestType(): TestType {
method render (line 139) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 147) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/NetworkTest.tsx
type NetworkState (line 36) | interface NetworkState {
class NetworkView (line 41) | class NetworkView extends RX.Component<RX.CommonProps, NetworkState> {
method constructor (line 45) | constructor(props: RX.CommonProps) {
method componentDidMount (line 54) | componentDidMount() {
method componentWillUnmount (line 69) | componentWillUnmount() {
method _queryConnectivityState (line 77) | private _queryConnectivityState() {
method _queryNetworkState (line 93) | private _queryNetworkState() {
method render (line 109) | render() {
method _formatNetworkType (line 137) | private _formatNetworkType(type: RXNetInfoTypes.DeviceNetworkType): st...
class NetworkTest (line 163) | class NetworkTest implements Test {
method getPath (line 164) | getPath(): string {
method getTestType (line 168) | getTestType(): TestType {
method render (line 172) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/PickerTest.tsx
type PickerViewState (line 46) | interface PickerViewState {
class PickerView (line 51) | class PickerView extends RX.Component<RX.CommonProps, PickerViewState> {
method constructor (line 52) | constructor(props: RX.CommonProps) {
method render (line 61) | render() {
class PickerTest (line 108) | class PickerTest implements Test {
method getPath (line 109) | getPath(): string {
method getTestType (line 113) | getTestType(): TestType {
method render (line 117) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/PlatformTest.tsx
type PlatformState (line 31) | interface PlatformState {
class PlatformView (line 35) | class PlatformView extends RX.Component<RX.CommonProps, PlatformState> {
method constructor (line 36) | constructor(props: RX.CommonProps) {
method render (line 44) | render() {
method execute (line 69) | execute() {
class PlatformTest (line 76) | class PlatformTest implements AutoExecutableTest {
method getPath (line 77) | getPath(): string {
method getTestType (line 81) | getTestType(): TestType {
method render (line 85) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 93) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/PopupTest.tsx
type PopupBoxProps (line 119) | interface PopupBoxProps extends RX.CommonProps {
type PopupViewState (line 128) | interface PopupViewState {
class PopupBox (line 133) | class PopupBox extends RX.Component<PopupBoxProps, RX.Stateless> {
method render (line 134) | render() {
class PopupView (line 183) | class PopupView extends RX.Component<RX.CommonProps, PopupViewState> {
method constructor (line 191) | constructor(props: RX.CommonProps) {
method componentWillUnmount (line 197) | componentWillUnmount() {
method render (line 201) | render() {
method _getFilteredComboItems (line 410) | private _getFilteredComboItems(textInputValue: string) {
method _renderComboItems (line 419) | private _renderComboItems(itemsText: string[]) {
method _showTextComboBox (line 434) | private _showTextComboBox(typedText: string) {
method _onPressComboBoxItem (line 462) | private _onPressComboBoxItem(e: RX.Types.SyntheticEvent, itemText: str...
class PopupTest (line 470) | class PopupTest implements Test {
method getPath (line 473) | getPath(): string {
method getTestType (line 477) | getTestType(): TestType {
method render (line 481) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ScrollViewBasicTest.tsx
type ScrollViewState (line 80) | interface ScrollViewState {
class ScrollViewView (line 85) | class ScrollViewView extends RX.Component<RX.CommonProps, ScrollViewStat...
method constructor (line 86) | constructor(props: RX.CommonProps) {
method render (line 95) | render() {
class ScrollViewTest (line 203) | class ScrollViewTest implements Test {
method getPath (line 206) | getPath(): string {
method getTestType (line 210) | getTestType(): TestType {
method render (line 214) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ScrollViewEventTest.tsx
type ScrollViewState (line 56) | interface ScrollViewState {
class ScrollViewView (line 65) | class ScrollViewView extends RX.Component<RX.CommonProps, ScrollViewStat...
method constructor (line 83) | constructor(props: RX.CommonProps) {
method componentDidMount (line 96) | componentDidMount() {
method componentWillUnmount (line 108) | componentWillUnmount() {
method render (line 114) | render() {
class ScrollViewTest (line 220) | class ScrollViewTest implements Test {
method getPath (line 223) | getPath(): string {
method getTestType (line 227) | getTestType(): TestType {
method render (line 231) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/StatusBarTest.tsx
type StatusBarViewState (line 51) | interface StatusBarViewState {
class StatusBarView (line 59) | class StatusBarView extends RX.Component<RX.CommonProps, StatusBarViewSt...
method constructor (line 60) | constructor(props: RX.CommonProps) {
method componentWillUnmount (line 72) | componentWillUnmount() {
method render (line 81) | render() {
method _toggleStatusBar (line 188) | private _toggleStatusBar(effect: 'fade' | 'slide') {
method _setStatusBarStyle (line 196) | private _setStatusBarStyle(style: 'default' | 'light-content' | 'dark-...
method _toggleNetworkIndicator (line 204) | private _toggleNetworkIndicator() {
method _changeBackgroundColor (line 212) | private _changeBackgroundColor() {
method _toggleTranslucent (line 223) | private _toggleTranslucent() {
class StatusBarTest (line 232) | class StatusBarTest implements Test {
method getPath (line 233) | getPath(): string {
method getTestType (line 237) | getTestType(): TestType {
method render (line 241) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/StorageTest.tsx
class StorageBasicTest (line 27) | class StorageBasicTest implements AutoExecutableTest {
method getPath (line 28) | getPath(): string {
method getTestType (line 32) | getTestType(): TestType {
method render (line 36) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 48) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/TextInputApiTest.tsx
type TextInputViewState (line 36) | interface TextInputViewState {
class TextInputView (line 42) | class TextInputView extends RX.Component<RX.CommonProps, TextInputViewSt...
method constructor (line 49) | constructor(props: RX.CommonProps) {
method componentDidMount (line 57) | componentDidMount() {
method componentWillUnmount (line 61) | componentWillUnmount() {
method render (line 65) | render() {
method _executeNextStage (line 84) | private _executeNextStage() {
method execute (line 148) | execute(complete: (result: TestResult) => void): void {
class TextInputApiTest (line 158) | class TextInputApiTest implements AutoExecutableTest {
method getPath (line 159) | getPath(): string {
method getTestType (line 163) | getTestType(): TestType {
method render (line 167) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 173) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/TextInputInteractiveTest.tsx
type TextInputViewState (line 104) | interface TextInputViewState {
class TextInputView (line 112) | class TextInputView extends RX.Component<RX.CommonProps, TextInputViewSt...
method constructor (line 115) | constructor(props: RX.CommonProps) {
method render (line 127) | render() {
method _appendHistoryTest6 (line 362) | private _appendHistoryTest6(newLine: string) {
class TextInputTest (line 372) | class TextInputTest implements Test {
method getPath (line 373) | getPath(): string {
method getTestType (line 377) | getTestType(): TestType {
method render (line 381) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/TextTest.tsx
type TextViewState (line 100) | interface TextViewState {
class TextView (line 107) | class TextView extends RX.Component<RX.CommonProps, TextViewState> {
method constructor (line 110) | constructor(props: RX.CommonProps) {
method render (line 119) | render() {
class TextTest (line 364) | class TextTest implements Test {
method getPath (line 365) | getPath(): string {
method getTestType (line 369) | getTestType(): TestType {
method render (line 373) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/UserInterfaceTest.tsx
type UserInterfaceState (line 40) | interface UserInterfaceState {
class UserInterfaceView (line 43) | class UserInterfaceView extends RX.Component<RX.CommonProps, UserInterfa...
method constructor (line 48) | constructor(props: RX.CommonProps) {
method componentDidMount (line 55) | componentDidMount() {
method componentWillUnmount (line 59) | componentWillUnmount() {
method render (line 63) | render() {
method execute (line 87) | execute(complete: (result: TestResult) => void) {
class UserInterfaceTest (line 181) | class UserInterfaceTest implements AutoExecutableTest {
method getPath (line 182) | getPath(): string {
method getTestType (line 186) | getTestType(): TestType {
method render (line 190) | render(onMount: (component: any) => void): RX.Types.ReactNode {
method execute (line 198) | execute(component: any, complete: (result: TestResult) => void): void {
FILE: samples/RXPTest/src/Tests/UserPresenceTest.tsx
type UserPresenceViewState (line 35) | interface UserPresenceViewState {
class UserPresenceView (line 39) | class UserPresenceView extends RX.Component<RX.CommonProps, UserPresence...
method constructor (line 42) | constructor(props: RX.CommonProps) {
method componentDidMount (line 50) | componentDidMount() {
method componentWillUnmount (line 58) | componentWillUnmount() {
method render (line 64) | render() {
class UserPresenceTest (line 83) | class UserPresenceTest implements Test {
method getPath (line 84) | getPath(): string {
method getTestType (line 88) | getTestType(): TestType {
method render (line 92) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ViewBasicTest.tsx
function accessibilityLabelAndImportantForAccessibilityTestUI (line 72) | function accessibilityLabelAndImportantForAccessibilityTestUI(important:...
class BasicView (line 124) | class BasicView extends RX.Component<RX.CommonProps, RX.Stateless> {
method render (line 125) | render() {
class ViewBasicTest (line 253) | class ViewBasicTest implements Test {
method getPath (line 254) | getPath(): string {
method getTestType (line 258) | getTestType(): TestType {
method render (line 262) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ViewMouseTest.tsx
type MouseViewState (line 66) | interface MouseViewState {
class MouseView (line 77) | class MouseView extends RX.Component<RX.CommonProps, MouseViewState> {
method constructor (line 79) | constructor(props: RX.CommonProps) {
method getMouseEventText (line 89) | private static getMouseEventText(mouseEvent?: RX.Types.MouseEvent): st...
method render (line 129) | render(): any {
class ViewMouseTest (line 210) | class ViewMouseTest implements Test {
method getPath (line 211) | getPath(): string {
method getTestType (line 215) | getTestType(): TestType {
method render (line 219) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/ViewTouchTest.tsx
type TouchViewState (line 74) | interface TouchViewState {
class ViewTouch (line 92) | class ViewTouch extends RX.Component<RX.CommonProps, TouchViewState> {
method constructor (line 94) | constructor(props: RX.CommonProps) {
method getTouchEventText (line 112) | private static getTouchEventText(touchEvent?: RX.Types.TouchEvent): st...
method render (line 141) | render(): any {
class ViewTouchTest (line 248) | class ViewTouchTest implements Test {
method getPath (line 249) | getPath(): string {
method getTestType (line 253) | getTestType(): TestType {
method render (line 257) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/WebViewBasicTest.tsx
type WebViewViewState (line 68) | interface WebViewViewState {
class WebViewView (line 74) | class WebViewView extends RX.Component<RX.CommonProps, WebViewViewState> {
method constructor (line 77) | constructor(props: RX.CommonProps) {
method render (line 87) | render() {
method _appendHistoryTest1 (line 194) | private _appendHistoryTest1(newLine: string) {
class WebViewBasicTest (line 211) | class WebViewBasicTest implements Test {
method getPath (line 212) | getPath(): string {
method getTestType (line 216) | getTestType(): TestType {
method render (line 220) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Tests/WebViewDynamicTest.tsx
type WebViewViewState (line 67) | interface WebViewViewState {
class WebViewView (line 72) | class WebViewView extends RX.Component<RX.CommonProps, WebViewViewState> {
method constructor (line 75) | constructor(props: RX.CommonProps) {
method render (line 84) | render() {
method _getHtmlContent (line 144) | private static _getHtmlContent(pageNumber: number): string {
method _appendHistoryTest1 (line 202) | private _appendHistoryTest1(newLine: string) {
class WebViewDynamicTest (line 216) | class WebViewDynamicTest implements Test {
method getPath (line 217) | getPath(): string {
method getTestType (line 221) | getTestType(): TestType {
method render (line 225) | render(onMount: (component: any) => void): RX.Types.ReactNode {
FILE: samples/RXPTest/src/Utilities.ts
function approxEquals (line 1) | function approxEquals(value1: number, value2: number, epsilon?: number):...
FILE: samples/RXPTest/windows/rxptest/App.xaml.cs
class App (line 8) | sealed partial class App : ReactApplication
method App (line 16) | public App()
FILE: samples/RXPTest/windows/rxptest/MainReactNativeHost.cs
class MainReactNativeHost (line 9) | class MainReactNativeHost : ReactNativeHost
FILE: samples/TodoList/android/app/src/debug/java/com/rxptodolist/ReactNativeFlipper.java
class ReactNativeFlipper (line 27) | public class ReactNativeFlipper {
method initializeFlipper (line 28) | public static void initializeFlipper(Context context, ReactInstanceMan...
FILE: samples/TodoList/android/app/src/main/java/com/rxptodolist/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: samples/TodoList/android/app/src/main/java/com/rxptodolist/MainApplication.java
class MainApplication (line 14) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 18) | @Override
method getPackages (line 23) | @Override
method getJSMainModuleName (line 32) | @Override
method getReactNativeHost (line 38) | @Override
method onCreate (line 43) | @Override
method initializeFlipper (line 57) | private static void initializeFlipper(
FILE: samples/TodoList/buildconfig.js
function getTempPath (line 25) | function getTempPath(mypath) {
function getSourcePath (line 29) | function getSourcePath(mypath) {
function getObjPath (line 33) | function getObjPath(mypath) {
function getWebAppPath (line 37) | function getWebAppPath(mypath) {
function getBuildPath (line 41) | function getBuildPath(mypath) {
function setTargetPlatform (line 49) | function setTargetPlatform(target) {
function setIsDevEnv (line 67) | function setIsDevEnv(dev) {
function getCommonFallback (line 71) | function getCommonFallback(targetPlatform) {
function getModuleAliases (line 91) | function getModuleAliases(targetPlatform) {
function getConfigInternal (line 117) | function getConfigInternal() {
FILE: samples/TodoList/buildtools/inline-require.js
function buildRequireCall (line 41) | function buildRequireCall(name) {
function buildRequireLodash (line 50) | function buildRequireLodash(name, func) {
function inlineRequireLodashFunction (line 59) | function inlineRequireLodashFunction(path) {
function inlineRequire (line 74) | function inlineRequire(path) {
function handleLodashSpread (line 94) | function handleLodashSpread(path) {
function isChain (line 213) | function isChain(name) {
function isLodash (line 217) | function isLodash(name) {
function resetCollection (line 226) | function resetCollection() {
function isTopLevelRequireAlias (line 231) | function isTopLevelRequireAlias(path) {
function isBlacklistedModule (line 242) | function isBlacklistedModule(name) {
function shouldInlineRequire (line 264) | function shouldInlineRequire(node, scope) {
function isRequireCall (line 276) | function isRequireCall(node) {
FILE: samples/TodoList/gulpfile.js
function getPlatform (line 58) | function getPlatform() {
function fixPipe (line 115) | function fixPipe(stream) {
function usesWebpack (line 152) | function usesWebpack() {
function getPlatformSpecificResources (line 156) | function getPlatformSpecificResources() {
function formatter (line 169) | function formatter() {}
function _runEsLintInternal (line 193) | function _runEsLintInternal(src, cacheName, fakeTaskName) {
function _debounceEsLintRunner (line 241) | function _debounceEsLintRunner(runner, fakeTaskName) {
function runEsLint (line 247) | function runEsLint(fakeTaskName) {
function copyMultiple (line 254) | function copyMultiple(copyList, callback) {
function normalizePath (line 277) | function normalizePath(mypath) {
function aliasify (line 285) | function aliasify(aliases) {
function replaceFlags (line 319) | function replaceFlags(stream) {
function fixRelativePathGlob (line 330) | function fixRelativePathGlob(pathOrGlob) {
function watcher (line 349) | function watcher(glob, callback) {
FILE: samples/TodoList/nodeserver.js
function replaceVariables (line 23) | function replaceVariables(html, replacements) {
function serveHtmlPage (line 34) | function serveHtmlPage(response, file) {
function handler (line 43) | function handler(request, response) {
FILE: samples/TodoList/src/ts/app/AppBootstrapper.tsx
method constructor (line 25) | constructor() {
method _startCriticalServices (line 46) | private _startCriticalServices(): SyncTasks.Promise<void> {
method _renderRootView (line 56) | private _renderRootView() {
FILE: samples/TodoList/src/ts/app/AppBootstrapperNative.tsx
class AppBootstrapperNative (line 24) | class AppBootstrapperNative extends AppBootstrapper {
method _getDbProvidersToTry (line 25) | protected _getDbProvidersToTry(): DbProvider[] {
method _getInitialUrl (line 35) | protected _getInitialUrl(): SyncTasks.Promise<string | undefined> {
FILE: samples/TodoList/src/ts/app/AppBootstrapperWeb.tsx
class AppBootstrapperWeb (line 30) | class AppBootstrapperWeb extends AppBootstrapper {
method _getDbProvidersToTry (line 31) | protected _getDbProvidersToTry(): DbProvider[] {
method _getInitialUrl (line 40) | protected _getInitialUrl(): SyncTasks.Promise<string | undefined> {
FILE: samples/TodoList/src/ts/app/AppConfig.ts
type InitParams (line 12) | interface InitParams {
class AppConfig (line 16) | class AppConfig {
method constructor (line 23) | constructor() {
method initialize (line 31) | initialize(params: InitParams) {
method isDevelopmentBuild (line 37) | isDevelopmentBuild(): boolean {
method getPlatformType (line 41) | getPlatformType(): RX.Types.PlatformType {
method isTouchInterface (line 45) | isTouchInterface(): boolean {
method getStartupTime (line 49) | getStartupTime(): number {
method getAppVersion (line 53) | getAppVersion(): string {
method getFrontendHost (line 57) | getFrontendHost(): string {
method getProtocol (line 61) | getProtocol(): string {
method getFrontendBaseUrl (line 70) | getFrontendBaseUrl(): string {
method getDocRoot (line 74) | getDocRoot(): string {
method getImagePath (line 78) | getImagePath(imageName = ''): string {
FILE: samples/TodoList/src/ts/app/DeepLinkConverter.ts
class DeepLinkConverter (line 17) | class DeepLinkConverter {
method getUrlFromContext (line 18) | static getUrlFromContext(context: NavModels.RootNavContext): string {
method getContextFromUrl (line 55) | static getContextFromUrl(url: string, isStackNav: boolean): NavModels....
FILE: samples/TodoList/src/ts/app/LocalDb.ts
type DBStore (line 14) | type DBStore<Name extends string, ObjectType, KeyFormat> = string & { na...
type DBIndex (line 15) | type DBIndex<Store extends DBStore<string, any, any>, IndexKeyFormat> = ...
class LocalDb (line 44) | class LocalDb {
method open (line 47) | open(providersToTry: DbProvider[]): SyncTasks.Promise<void> {
method _openListOfProviders (line 53) | private _openListOfProviders(providersToTry: DbProvider[], dbName: str...
method getAllTodos (line 86) | getAllTodos(): SyncTasks.Promise<TodoModels.Todo[]> {
method putTodo (line 95) | putTodo(todo: TodoModels.Todo): SyncTasks.Promise<void> {
method deleteTodo (line 107) | deleteTodo(todoId: string): SyncTasks.Promise<void> {
FILE: samples/TodoList/src/ts/app/NavActions.ts
class NavActions (line 10) | class NavActions {
method createTodoListContext (line 11) | static createTodoListContext(useStackNav: boolean, selectedTodoId?: st...
FILE: samples/TodoList/src/ts/app/Styles.tsx
type Colors (line 11) | const enum Colors {
type FontSizes (line 49) | const enum FontSizes {
class Fonts (line 60) | class Fonts {
class Styles (line 86) | class Styles {
FILE: samples/TodoList/src/ts/controls/HoverButton.tsx
type HoverButtonProps (line 11) | interface HoverButtonProps extends RX.CommonProps {
type HoverButtonState (line 18) | interface HoverButtonState {
class HoverButton (line 22) | class HoverButton extends RX.Component<HoverButtonProps, HoverButtonStat...
method render (line 23) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/controls/Modal.tsx
type ModalProps (line 16) | interface ModalProps extends RX.CommonProps {
type ModalState (line 23) | interface ModalState {
class Modal (line 54) | class Modal extends ComponentBase<ModalProps, ModalState> {
method _buildState (line 71) | protected _buildState(props: ModalProps, initialBuild: boolean): Parti...
method UNSAFE_componentWillMount (line 86) | UNSAFE_componentWillMount() {
method componentDidMount (line 93) | componentDidMount() {
method componentWillUnmount (line 106) | componentWillUnmount() {
method UNSAFE_componentWillUpdate (line 114) | UNSAFE_componentWillUpdate(newProps: ModalProps, newState: ModalState,...
method render (line 119) | render() {
method _animateClose (line 172) | private _animateClose(onAnimationComplete: () => void) {
method dismissAnimated (line 197) | static dismissAnimated(modalId: string): Promise<void> {
FILE: samples/TodoList/src/ts/controls/SimpleButton.tsx
type SimpleButtonProps (line 14) | interface SimpleButtonProps {
class SimpleButton (line 48) | class SimpleButton extends RX.Component<SimpleButtonProps, RX.Stateless> {
method render (line 49) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/controls/SimpleDialog.tsx
type SimpleDialogButton (line 20) | interface SimpleDialogButton {
type SimpleDialogProps (line 34) | interface SimpleDialogProps {
class SimpleDialog (line 95) | class SimpleDialog extends ComponentBase<SimpleDialogProps, RX.Stateless> {
method componentDidMount (line 96) | componentDidMount() {
method componentWillUnmount (line 103) | componentWillUnmount() {
method render (line 110) | render() {
method _onButtonPress (line 179) | private _onButtonPress(e: RX.Types.SyntheticEvent, buttonDef: SimpleDi...
method _completeButtonPress (line 184) | private _completeButtonPress(buttonDef: SimpleDialogButton) {
method dismissAnimated (line 227) | static dismissAnimated(dialogId: string): Promise<void> {
FILE: samples/TodoList/src/ts/controls/SimpleMenu.tsx
type MenuItem (line 16) | interface MenuItem {
type MenuProps (line 23) | interface MenuProps extends RX.CommonProps {
type MenuState (line 33) | interface MenuState {
class SimpleMenu (line 81) | class SimpleMenu extends ComponentBase<MenuProps, MenuState> {
method _buildState (line 84) | protected _buildState(props: MenuProps, initialBuild: boolean): Partia...
method componentDidMount (line 94) | componentDidMount() {
method componentDidUpdate (line 102) | componentDidUpdate(prevProps: MenuProps, prevState: MenuState, prevCon...
method focusFirt (line 110) | focusFirt() {
method focusLast (line 114) | focusLast() {
method focusItem (line 118) | focusItem(index = 0) {
method render (line 133) | render() {
method _onClickItem (line 210) | private _onClickItem(e: RX.Types.SyntheticEvent, item: MenuItem) {
method _onMouseEnter (line 218) | private _onMouseEnter(item: MenuItem) {
method _onMouseLeave (line 226) | private _onMouseLeave(item: MenuItem) {
FILE: samples/TodoList/src/ts/controls/VerticalSeparator.tsx
type VerticalSeparatorProps (line 12) | interface VerticalSeparatorProps {
class VerticalSeparator (line 26) | class VerticalSeparator extends RX.Component<VerticalSeparatorProps, RX....
method render (line 27) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/models/IdentityModels.ts
type UserId (line 8) | type UserId = string;
type User (line 10) | interface User {
FILE: samples/TodoList/src/ts/models/NavModels.ts
type NavViewId (line 20) | enum NavViewId {
method constructor (line 31) | constructor(public isStackNav: boolean) {
method constructor (line 38) | constructor(public viewId: NavViewId) {
class StackRootNavContext (line 43) | class StackRootNavContext extends RootNavContext {
method constructor (line 46) | constructor() {
method clone (line 51) | clone(): StackRootNavContext {
class TodoRootNavContext (line 60) | class TodoRootNavContext extends CompositeRootNavContext {
method constructor (line 63) | constructor(selectedTodoId?: string, public showNewTodoPanel = false) {
method clone (line 68) | clone(): TodoRootNavContext {
method constructor (line 78) | constructor(public viewId: NavViewId) {
class TodoListViewNavContext (line 84) | class TodoListViewNavContext extends ViewNavContext {
method constructor (line 85) | constructor(public selectedTodoId?: string) {
method clone (line 89) | clone(): TodoListViewNavContext {
class NewTodoViewNavContext (line 94) | class NewTodoViewNavContext extends ViewNavContext {
method constructor (line 95) | constructor() {
method clone (line 99) | clone(): NewTodoViewNavContext {
class ViewTodoViewNavContext (line 104) | class ViewTodoViewNavContext extends ViewNavContext {
method constructor (line 105) | constructor(public todoId: string) {
method clone (line 109) | clone(): ViewTodoViewNavContext {
FILE: samples/TodoList/src/ts/models/ResponsiveWidthModels.ts
type ResponsiveWidth (line 8) | enum ResponsiveWidth {
FILE: samples/TodoList/src/ts/models/TodoModels.ts
type Todo (line 8) | interface Todo {
FILE: samples/TodoList/src/ts/modules/fonts/Fonts.ts
type FontBase (line 9) | interface FontBase {
FILE: samples/TodoList/src/ts/modules/fonts/index.native.ts
class Fonts (line 10) | class Fonts implements FontBase {
FILE: samples/TodoList/src/ts/modules/fonts/index.web.ts
class Fonts (line 10) | class Fonts implements FontBase {
FILE: samples/TodoList/src/ts/modules/fonts/index.windows.ts
class Fonts (line 10) | class Fonts implements FontBase {
FILE: samples/TodoList/src/ts/modules/images/Images.ts
type ImageSourceBase (line 9) | interface ImageSourceBase {
FILE: samples/TodoList/src/ts/modules/images/index.native.ts
class ImageSource (line 17) | class ImageSource implements ImageSourceBase {
method todoLogo (line 18) | get todoLogo() { return require('../../../images/todo-logo.png'); }
method todoSmall (line 19) | get todoSmall() { return require('../../../images/todo-small.png'); }
FILE: samples/TodoList/src/ts/modules/images/index.web.ts
class ImageSource (line 12) | class ImageSource implements ImageSourceBase {
FILE: samples/TodoList/src/ts/services/PageUrlService.ts
class PageUrlService (line 14) | class PageUrlService {
method startup (line 18) | startup() {
method _onNavigationChange (line 27) | private _onNavigationChange() {
method _onUrlChange (line 39) | private _onUrlChange(e: any) {
FILE: samples/TodoList/src/ts/services/ServiceManager.ts
type Service (line 16) | interface Service {
type ServiceInfo (line 20) | interface ServiceInfo {
class ServiceManager (line 29) | class ServiceManager {
method registerService (line 32) | static registerService(service: Service, name: string, dependencies: S...
method hasStarted (line 49) | static hasStarted(startupable: Service): boolean {
method ensureStarted (line 55) | static ensureStarted(services: Service[]): SyncTasks.Promise<void> {
method ensureStartedSingle (line 60) | static ensureStartedSingle(service: Service): SyncTasks.Promise<void> {
method _getName (line 100) | private static _getName(service: Service): string {
FILE: samples/TodoList/src/ts/services/ServiceRegistrar.ts
class ServiceRegistrar (line 16) | class ServiceRegistrar {
method init (line 17) | static init() {
FILE: samples/TodoList/src/ts/stores/CurrentUserStore.ts
class CurrentUserStore (line 13) | class CurrentUserStore extends StoreBase {
method getUser (line 22) | getUser(): User | undefined {
method getFullName (line 27) | getFullName(): string {
FILE: samples/TodoList/src/ts/stores/NavContextStore.ts
class NavContextStore (line 19) | class NavContextStore extends StoreBase {
method constructor (line 23) | constructor() {
method _shouldUseStackNavigation (line 49) | private _shouldUseStackNavigation(): boolean {
method getNavContext (line 69) | getNavContext(): NavModels.RootNavContext {
method setNavContext (line 73) | setNavContext(newContext: NavModels.RootNavContext) {
method isUsingStackNav (line 83) | isUsingStackNav(): boolean {
method navigateToTodoList (line 87) | navigateToTodoList(selectedTodoId?: string, showNewTodoPanel = false) {
method popNavigationStack (line 91) | popNavigationStack() {
FILE: samples/TodoList/src/ts/stores/ResponsiveWidthStore.ts
type TriggerKeys (line 13) | enum TriggerKeys {
class ResponsiveWidthStore (line 21) | @AutoSubscribeStore
method constructor (line 27) | constructor() {
method responsiveWidthForWidth (line 37) | static responsiveWidthForWidth(width: number): ResponsiveWidth {
method putWindowSize (line 50) | putWindowSize(width: number, height: number, rootViewId: string = Main...
method getWidth (line 77) | getWidth(rootViewId: string = MainWindowId): number {
method getWidthNoSubscription (line 82) | getWidthNoSubscription(rootViewId: string = MainWindowId): number {
method getHeight (line 87) | getHeight(rootViewId: string = MainWindowId): number {
method getHeightNoSubscription (line 92) | getHeightNoSubscription(rootViewId: string = MainWindowId): number {
method getResponsiveWidth (line 97) | getResponsiveWidth(rootViewId: string = MainWindowId): number {
method isSmallOrTinyScreenSize (line 102) | isSmallOrTinyScreenSize(rootViewId: string = MainWindowId): boolean {
method isTinyWidth (line 107) | isTinyWidth(rootViewId: string = MainWindowId): boolean {
method isHeightSmallerThanThresholdNoSubscription (line 112) | isHeightSmallerThanThresholdNoSubscription(threshold: number, rootView...
method isWidthSmallerThanThresholdNoSubscription (line 118) | isWidthSmallerThanThresholdNoSubscription(threshold: number, rootViewI...
method getWindowDimensionsNoSubscription (line 124) | getWindowDimensionsNoSubscription(rootViewId: string = MainWindowId): ...
FILE: samples/TodoList/src/ts/stores/TodosStore.tsx
class TodosStore (line 14) | @AutoSubscribeStore
method startup (line 18) | startup() {
method addTodo (line 24) | addTodo(todoText: string) {
method getTodos (line 44) | getTodos() {
method getTodoById (line 49) | getTodoById(todoId: string) {
method deleteTodo (line 53) | deleteTodo(todoId: string) {
FILE: samples/TodoList/src/ts/utilities/ExceptionReporter.ts
type ExceptionReporterDelegate (line 13) | type ExceptionReporterDelegate = (message: string, source: string | unde...
class ExceptionReporter (line 16) | class ExceptionReporter {
method constructor (line 19) | constructor() {
method register (line 45) | register(handler: ExceptionReporterDelegate) {
method registerAlertView (line 51) | registerAlertView() {
method registerConsoleView (line 58) | registerConsoleView() {
method unregister (line 66) | unregister() {
FILE: samples/TodoList/src/ts/utilities/KeyCodes.ts
function isReactNative (line 13) | function isReactNative(): boolean {
type Keys (line 22) | enum Keys {
FILE: samples/TodoList/src/ts/utilities/ShimHelpers.ts
function shimEnvironment (line 14) | function shimEnvironment(isDev: boolean, isNative: boolean) {
function shimReactNative (line 33) | function shimReactNative() {
FILE: samples/TodoList/src/ts/views/AccountMenuButton.tsx
type AccountMenuButtonState (line 17) | interface AccountMenuButtonState {
class AccountMenuButton (line 53) | class AccountMenuButton extends ComponentBase<RX.CommonProps, AccountMen...
method _buildState (line 56) | protected _buildState(props: RX.CommonProps, initState: boolean): Part...
method render (line 64) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/views/CreateTodoPanel.tsx
type CreateTodoPanelProps (line 15) | interface CreateTodoPanelProps extends RX.CommonProps {
type CreateTodoPanelState (line 18) | interface CreateTodoPanelState {
class CreateTodoPanel (line 44) | class CreateTodoPanel extends RX.Component<CreateTodoPanelProps, CreateT...
method render (line 45) | render() {
method _saveTodo (line 76) | private _saveTodo() {
FILE: samples/TodoList/src/ts/views/RootView.tsx
type RootViewProps (line 26) | interface RootViewProps extends RX.CommonProps {
type RootViewState (line 30) | interface RootViewState {
class RootView (line 47) | class RootView extends ComponentBase<RootViewProps, RootViewState> {
method _buildState (line 50) | protected _buildState(props: RootViewProps, initState: boolean): Parti...
method render (line 88) | render(): JSX.Element | null {
method _showBackButton (line 110) | private _showBackButton(viewId: NavModels.NavViewId): boolean {
method _getViewTitle (line 115) | private _getViewTitle(navContext: NavModels.RootNavContext): string {
method _renderSceneContents (line 164) | private _renderSceneContents(viewId: NavModels.NavViewId) {
method _renderMainView (line 203) | private _renderMainView(): JSX.Element | null {
method _createNavigatorRouteStack (line 212) | private _createNavigatorRouteStack(stackContext: NavModels.StackRootNa...
method _createNavigatorRoute (line 216) | private _createNavigatorRoute(viewId: NavModels.NavViewId): NavTypes.N...
method _findNavContextForRoute (line 223) | private _findNavContextForRoute(routeId: number) {
method _compareNavStack (line 230) | private _compareNavStack(stackA: NavModels.ViewNavContext[], stackB: N...
FILE: samples/TodoList/src/ts/views/TodoCompositeView.tsx
type TodoCompositeViewProps (line 20) | interface TodoCompositeViewProps extends RX.CommonProps {
type TodoCompositeViewState (line 24) | interface TodoCompositeViewState {
class TodoCompositeView (line 44) | class TodoCompositeView extends ComponentBase<TodoCompositeViewProps, To...
method _buildState (line 45) | protected _buildState(props: TodoCompositeViewProps, initState: boolea...
method render (line 49) | render(): JSX.Element | null {
method _renderRightPanel (line 66) | private _renderRightPanel() {
FILE: samples/TodoList/src/ts/views/TodoListItem.tsx
type TodoListItemProps (line 16) | interface TodoListItemProps extends RX.CommonProps {
type TodoListItemState (line 24) | interface TodoListItemState {
class TodoListItem (line 65) | class TodoListItem extends ComponentBase<TodoListItemProps, TodoListItem...
method _buildState (line 66) | protected _buildState(props: TodoListItemProps, initState: boolean): P...
method render (line 75) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/views/TodoListPanel.tsx
type TodoListItemInfo (line 23) | interface TodoListItemInfo extends VirtualListViewItemInfo {
type TodoListPanelProps (line 27) | interface TodoListPanelProps extends RX.CommonProps {
type TodoListPanelState (line 33) | interface TodoListPanelState {
class TodoListPanel (line 84) | class TodoListPanel extends ComponentBase<TodoListPanelProps, TodoListPa...
method _buildState (line 85) | protected _buildState(props: TodoListPanelProps, initState: boolean): ...
method render (line 111) | render() {
method _filterTodoList (line 154) | private _filterTodoList(sortedTodos: TodoListItemInfo[], searchString:...
FILE: samples/TodoList/src/ts/views/TopBarComposite.tsx
type TopBarCompositeProps (line 69) | interface TopBarCompositeProps extends RX.CommonProps {
class TopBarComposite (line 74) | class TopBarComposite extends ComponentBase<TopBarCompositeProps, RX.Sta...
method render (line 75) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/views/TopBarStack.tsx
type TopBarStackProps (line 52) | interface TopBarStackProps extends RX.CommonProps {
class TopBarStack (line 58) | class TopBarStack extends ComponentBase<TopBarStackProps, RX.Stateless> {
method render (line 59) | render(): JSX.Element | null {
FILE: samples/TodoList/src/ts/views/ViewTodoPanel.tsx
type ViewTodoPanelProps (line 18) | interface ViewTodoPanelProps extends RX.CommonProps {
type ViewTodoPanelState (line 22) | interface ViewTodoPanelState {
class ViewTodoPanel (line 49) | class ViewTodoPanel extends ComponentBase<ViewTodoPanelProps, ViewTodoPa...
method _buildState (line 50) | protected _buildState(props: ViewTodoPanelProps, initState: boolean): ...
method render (line 58) | render() {
method _completeDelete (line 98) | private _completeDelete() {
FILE: samples/TodoList/windows/TodoList/App.xaml.cs
class App (line 16) | sealed partial class App : Application
method App (line 24) | public App()
method OnLaunched (line 38) | protected override void OnLaunched(LaunchActivatedEventArgs e)
method OnActivated (line 48) | protected override void OnActivated(IActivatedEventArgs args)
method OnCreate (line 72) | private void OnCreate(string arguments)
method OnNavigationFailed (line 120) | private void OnNavigationFailed(object sender, NavigationFailedEventAr...
method OnSuspending (line 132) | private void OnSuspending(object sender, SuspendingEventArgs e)
method OnResuming (line 142) | private void OnResuming(object sender, object e)
FILE: samples/TodoList/windows/TodoList/MainPage.cs
class MainPage (line 9) | class MainPage : ReactPage
FILE: samples/hello-world-js/android/app/src/main/java/com/rxphelloworld/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: samples/hello-world-js/android/app/src/main/java/com/rxphelloworld/MainApplication.java
class MainApplication (line 17) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 20) | @Override
method getPackages (line 25) | @Override
method getJSMainModuleName (line 34) | @Override
method getReactNativeHost (line 40) | @Override
method onCreate (line 45) | @Override
FILE: samples/hello-world-js/src/App.js
class App (line 7) | class App {
method init (line 8) | init() {
method _renderRootView (line 13) | _renderRootView() {
FILE: samples/hello-world-js/src/config.js
constant DEBUG (line 1) | const DEBUG = __DEV__;
constant DEV (line 2) | const DEV = __DEV__;
FILE: samples/hello-world-js/src/controls/ProgressIndicator.js
class ProgressIndicator (line 13) | class ProgressIndicator extends RX.Component {
method render (line 14) | render() {
method _buildPath (line 30) | _buildPath(){
FILE: samples/hello-world-js/src/controls/ToggleSwitch.js
constant ANIMATION_DURATION (line 12) | const ANIMATION_DURATION = 250;
constant KNOB_LEFT_OFF (line 13) | const KNOB_LEFT_OFF = 2;
constant KNOB_LEFT_ON (line 14) | const KNOB_LEFT_ON = 22;
class ToggleSwitch (line 46) | class ToggleSwitch extends RX.Component {
method constructor (line 53) | constructor(props){
method componentDidUpdate (line 71) | componentDidUpdate(prevProps) {
method render (line 91) | render() {
FILE: samples/hello-world-js/src/views/MainPanel.js
class MainPanel (line 46) | class MainPanel extends RX.Component{
method constructor (line 47) | constructor(props) {
method componentDidMount (line 55) | componentDidMount() {
method render (line 63) | render() {
FILE: samples/hello-world-js/src/views/RootView.js
class RootView (line 20) | class RootView extends RX.Component {
method componentDidMount (line 23) | componentDidMount() {
method render (line 30) | render() {
FILE: samples/hello-world-js/src/views/SecondPanel.js
class SecondPanel (line 47) | class SecondPanel extends RX.Component {
method constructor (line 50) | constructor(props) {
method componentDidMount (line 58) | componentDidMount() {
method componentWillUnmount (line 62) | componentWillUnmount() {
method render (line 66) | render() {
method _startProgressIndicator (line 122) | _startProgressIndicator() {
method _stopProgressIndicator (line 129) | _stopProgressIndicator() {
FILE: samples/hello-world-js/web/webpack/common.js
constant ROOT_PATH (line 5) | const ROOT_PATH = path.join(__dirname, '..', '..');
constant DIST_PATH (line 6) | const DIST_PATH = path.join(ROOT_PATH, 'dist-web');
constant APP_PATH (line 7) | const APP_PATH = path.join(ROOT_PATH, 'src');
constant WEB_PATH (line 8) | const WEB_PATH = path.join(ROOT_PATH, 'web');
FILE: samples/hello-world-js/windows/RXPHelloWorld/App.xaml.cs
class App (line 8) | sealed partial class App : ReactApplication
method App (line 16) | public App()
FILE: samples/hello-world-js/windows/RXPHelloWorld/MainReactNativeHost.cs
class MainReactNativeHost (line 8) | class MainReactNativeHost : ReactNativeHost
FILE: samples/hello-world/android/app/src/main/java/com/rxphelloworld/MainActivity.java
class MainActivity (line 5) | public class MainActivity extends ReactActivity {
method getMainComponentName (line 11) | @Override
FILE: samples/hello-world/android/app/src/main/java/com/rxphelloworld/MainApplication.java
class MainApplication (line 17) | public class MainApplication extends Application implements ReactApplica...
method getUseDeveloperSupport (line 20) | @Override
method getPackages (line 25) | @Override
method getJSMainModuleName (line 34) | @Override
method getReactNativeHost (line 40) | @Override
method onCreate (line 45) | @Override
FILE: samples/hello-world/src/App.tsx
class App (line 6) | class App {
method init (line 7) | init() {
method _renderRootView (line 12) | private _renderRootView() {
FILE: samples/hello-world/src/config.ts
constant DEBUG (line 3) | const DEBUG = __DEV__;
constant DEV (line 4) | const DEV = __DEV__;
FILE: samples/hello-world/src/controls/ProgressIndicator.tsx
type ProgressIndicatorProps (line 12) | interface ProgressIndicatorProps extends RX.CommonStyledProps<SvgTypes.I...
class ProgressIndicator (line 18) | class ProgressIndicator extends RX.Component<ProgressIndicatorProps, RX....
method render (line 19) | render() {
method _buildPath (line 35) | private _buildPath(): string {
FILE: samples/hello-world/src/controls/ToggleSwitch.tsx
type ToggleSwitchProps (line 11) | interface ToggleSwitchProps extends RX.CommonProps {
constant ANIMATION_DURATION (line 16) | const ANIMATION_DURATION = 250;
constant KNOB_LEFT_OFF (line 17) | const KNOB_LEFT_OFF = 2;
constant KNOB_LEFT_ON (line 18) | const KNOB_LEFT_ON = 22;
class ToggleSwitch (line 50) | class ToggleSwitch extends RX.Component<ToggleSwitchProps, RX.Stateless> {
method constructor (line 57) | constructor(props: ToggleSwitchProps) {
method componentDidUpdate (line 75) | componentDidUpdate(prevProps: ToggleSwitchProps) {
method render (line 96) | render() {
FILE: samples/hello-world/src/views/MainPanel.tsx
type MainPanelProps (line 4) | interface MainPanelProps {
class MainPanel (line 50) | class MainPanel extends RX.Component<MainPanelProps, RX.Stateless> {
method constructor (line 54) | constructor(props: MainPanelProps) {
method componentDidMount (line 63) | componentDidMount() {
method render (line 71) | render() {
FILE: samples/hello-world/src/views/RootView.tsx
type NavigationRouteId (line 8) | enum NavigationRouteId {
class RootView (line 20) | class RootView extends RX.Component<RX.CommonProps, RX.Stateless> {
method componentDidMount (line 23) | componentDidMount() {
method render (line 32) | render() {
FILE: samples/hello-world/src/views/SecondPanel.tsx
type SecondPanelProps (line 8) | interface SecondPanelProps extends RX.CommonProps {
type SecondPanelState (line 12) | interface SecondPanelState {
class SecondPanel (line 56) | class SecondPanel extends RX.Component<SecondPanelProps, SecondPanelStat...
method componentDidMount (line 65) | componentDidMount() {
method componentWillUnmount (line 69) | componentWillUnmount() {
method render (line 73) | render() {
method _startProgressIndicator (line 133) | private _startProgressIndicator() {
method _stopProgressIndicator (line 140) | private _stopProgressIndicator() {
FILE: samples/hello-world/web/webpack/common.js
constant ROOT_PATH (line 6) | const ROOT_PATH = path.join(__dirname, '..', '..');
constant DIST_PATH (line 7) | const DIST_PATH = path.join(ROOT_PATH, 'dist-web');
constant APP_PATH (line 8) | const APP_PATH = path.join(ROOT_PATH, 'src');
constant WEB_PATH (line 9) | const WEB_PATH = path.join(ROOT_PATH, 'web');
constant TS_CONFIG_PATH (line 10) | const TS_CONFIG_PATH = path.join(ROOT_PATH, 'tsconfig.json');
FILE: samples/hello-world/windows/RXPHelloWorld/App.xaml.cs
class App (line 8) | sealed partial class App : ReactApplication
method App (line 16) | public App()
FILE: samples/hello-world/windows/RXPHelloWorld/MainReactNativeHost.cs
class MainReactNativeHost (line 8) | class MainReactNativeHost : ReactNativeHost
FILE: src/android/Accessibility.ts
class Accessibility (line 12) | class Accessibility extends NativeAccessibility {
method announceForAccessibility (line 20) | announceForAccessibility(announcement: string): void {
FILE: src/android/AccessibilityUtil.ts
class AccessibilityUtil (line 16) | class AccessibilityUtil extends CommonAccessibilityNativeUtil {
method _sendAccessibilityEvent (line 17) | private _sendAccessibilityEvent(component: React.Component<any, any>, ...
method setAccessibilityFocus (line 42) | setAccessibilityFocus(component: React.Component<any, any>): void {
FILE: src/android/GestureView.tsx
class GestureView (line 15) | class GestureView extends BaseGestureView {
method constructor (line 17) | constructor(props: Types.GestureViewProps) {
method _getPreferredPanRatio (line 21) | protected _getPreferredPanRatio(): number {
method _getEventTimestamp (line 25) | protected _getEventTimestamp(e: Types.TouchEvent | Types.MouseEvent): ...
FILE: src/android/Image.tsx
class Image (line 13) | class Image extends CommonImage {
method _getAdditionalProps (line 16) | protected _getAdditionalProps(): RN.ImagePropertiesAndroid {
FILE: src/android/ReactXP.ts
type Accessibility (line 54) | type Accessibility = RXInterfaces.Accessibility;
type ActivityIndicator (line 56) | type ActivityIndicator = RXInterfaces.ActivityIndicator;
type Alert (line 58) | type Alert = RXInterfaces.Alert;
type App (line 60) | type App = RXInterfaces.App;
type Button (line 62) | type Button = RXInterfaces.Button;
type Picker (line 64) | type Picker = RXInterfaces.Picker;
type Clipboard (line 66) | type Clipboard = RXInterfaces.Clipboard;
type GestureView (line 68) | type GestureView = RXInterfaces.GestureView;
type Image (line 70) | type Image = RXInterfaces.Image;
type Input (line 72) | type Input = RXInterfaces.Input;
type International (line 74) | type International = RXInterfaces.International;
type Link (line 76) | type Link = RXInterfaces.Link;
type Linking (line 78) | type Linking = RXInterfaces.Linking;
type Location (line 80) | type Location = RXInterfaces.Location;
type Modal (line 82) | type Modal = RXInterfaces.Modal;
type Platform (line 84) | type Platform = RXInterfaces.Platform;
type Popup (line 86) | type Popup = RXInterfaces.Popup;
type ScrollView (line 88) | type ScrollView = RXInterfaces.ScrollView;
type StatusBar (line 90) | type StatusBar = RXInterfaces.StatusBar;
type Storage (line 92) | type Storage = RXInterfaces.Storage;
type Styles (line 94) | type Styles = RXInterfaces.Styles;
type Text (line 96) | type Text = RXInterfaces.Text;
type TextInput (line 98) | type TextInput = RXInterfaces.TextInput;
type UserInterface (line 100) | type UserInterface = RXInterfaces.UserInterface;
type UserPresence (line 102) | type UserPresence = RXInterfaces.UserPresence;
type View (line 104) | type View = RXInterfaces.View;
FILE: src/android/StatusBar.ts
class StatusBar (line 14) | class StatusBar extends RX.StatusBar {
method isOverlay (line 15) | isOverlay(): boolean {
method setHidden (line 21) | setHidden(hidden: boolean, showHideTransition: 'slide' | 'fade'): void {
method setBackgroundColor (line 25) | setBackgroundColor(color: string, animated: boolean): void {
method setTranslucent (line 29) | setTranslucent(translucent: boolean): void {
method setBarStyle (line 33) | setBarStyle(style: 'default' | 'light-content' | 'dark-content', anima...
method setNetworkActivityIndicatorVisible (line 37) | setNetworkActivityIndicatorVisible(value: boolean): void {
FILE: src/android/Text.tsx
class Text (line 25) | class Text extends CommonText {
method _getStyles (line 26) | protected _getStyles(): Types.StyleRuleSetRecursiveArray<Types.TextSty...
method render (line 34) | render() {
FILE: src/common/Accessibility.ts
method isHighContrastEnabled (line 19) | isHighContrastEnabled(): boolean {
method announceForAccessibility (line 24) | announceForAccessibility(announcement: string): void {
FILE: src/common/AccessibilityUtil.ts
type ImportantForAccessibilityValue (line 14) | type ImportantForAccessibilityValue = 'auto' | 'yes' | 'no' | 'no-hide-d...
method isHidden (line 28) | isHidden(importantForAccessibility: Types.ImportantForAccessibility | un...
method importantForAccessibilityToString (line 39) | importantForAccessibilityToString(importantForAccessibility: Types.Impor...
FILE: src/common/AppConfig.ts
class AppConfig (line 10) | class AppConfig {
method setAppConfig (line 14) | setAppConfig(isDebug: boolean, isDevelopment: boolean): void {
method isDebugMode (line 19) | isDebugMode(): boolean {
method isDevelopmentMode (line 23) | isDevelopmentMode(): boolean {
FILE: src/common/Bezier.ts
constant NEWTON_ITERATIONS (line 8) | const NEWTON_ITERATIONS = 4;
constant NEWTON_MIN_SLOPE (line 9) | const NEWTON_MIN_SLOPE = 0.001;
constant SUBDIVISION_PRECISION (line 10) | const SUBDIVISION_PRECISION = 0.0000001;
constant SUBDIVISION_MAX_ITERATIONS (line 11) | const SUBDIVISION_MAX_ITERATIONS = 10;
function A (line 18) | function A(aA1: number, aA2: number): number {
function B (line 22) | function B(aA1: number, aA2: number): number {
function C (line 26) | function C(aA1: number): number {
function calcBezier (line 31) | function calcBezier(aT: number, aA1: number, aA2: number): number {
function getSlope (line 36) | function getSlope(aT: number, aA1: number, aA2: number): number {
function binarySubdivide (line 40) | function binarySubdivide(aX: number, aA: number, aB: number, mX1: number...
function newtonRaphsonIterate (line 56) | function newtonRaphsonIterate(aX: number, aGuessT: number, mX1: number, ...
function bezier (line 68) | function bezier(mX1: number, mY1: number, mX2: number, mY2: number): (x:...
FILE: src/common/Easing.ts
class Easing (line 13) | class Easing implements Types.Animated.Easing {
method CubicBezier (line 14) | CubicBezier(x1: number, y1: number, x2: number, y2: number): Types.Ani...
method Default (line 21) | Default(): Types.Animated.EasingFunction {
method Linear (line 29) | Linear(): Types.Animated.EasingFunction {
method Out (line 36) | Out(): Types.Animated.EasingFunction {
method In (line 44) | In(): Types.Animated.EasingFunction {
method InOut (line 52) | InOut(): Types.Animated.EasingFunction {
method OutBack (line 60) | OutBack(): Types.Animated.EasingFunction {
method InBack (line 68) | InBack(): Types.Animated.EasingFunction {
method InOutBack (line 76) | InOutBack(): Types.Animated.EasingFunction {
method Steps (line 84) | Steps(intervals: number, end = true): Types.Animated.EasingFunction {
method StepStart (line 99) | StepStart(): Types.Animated.EasingFunction {
method StepEnd (line 107) | StepEnd(): Types.Animated.EasingFunction {
FILE: src/common/GestureView.tsx
type GestureType (line 18) | enum GestureType {
type GestureStatePoint (line 35) | interface GestureStatePoint {
type GestureStatePointVelocity (line 47) | interface GestureStatePointVelocity extends GestureStatePoint {
type TouchListBasic (line 62) | interface TouchListBasic {
type TouchEventBasic (line 67) | interface TouchEventBasic extends Types.SyntheticEvent {
method componentWillUnmount (line 102) | componentWillUnmount() {
method _onTouchSeriesStart (line 108) | protected _onTouchSeriesStart(event: TouchEventBasic): boolean {
method _onTouchChange (line 125) | protected _onTouchChange(event: TouchEventBasic, gestureState: GestureSt...
method _onTouchSeriesFinished (line 154) | protected _onTouchSeriesFinished(touchEvent: TouchEventBasic, gestureSta...
method _skipNextTap (line 197) | protected _skipNextTap() {
method _setPendingGestureState (line 201) | private _setPendingGestureState(gestureState: Types.MultiTouchGestureSta...
method _detectMoveGesture (line 208) | private _detectMoveGesture(e: TouchEventBasic, gestureState: GestureStat...
method _isTap (line 225) | private _isTap(e: TouchEventBasic): boolean {
method _isDoubleTap (line 244) | protected _isDoubleTap(e: Types.TapGestureState) {
method _startDoubleTapTimer (line 254) | protected _startDoubleTapTimer(e: Types.TapGestureState) {
method _cancelDoubleTapTimer (line 264) | protected _cancelDoubleTapTimer() {
method _startLongPressTimer (line 271) | protected _startLongPressTimer(gsState: Types.TapGestureState, isDefinit...
method _reportLongPress (line 284) | private _reportLongPress() {
method _cancelLongPressTimer (line 296) | protected _cancelLongPressTimer() {
method _reportDelayedTap (line 307) | protected _reportDelayedTap() {
method _clearLastTap (line 314) | protected _clearLastTap() {
method _isActuallyMouseEvent (line 318) | private static _isActuallyMouseEvent(e: TouchEventBasic | undefined): bo...
method _shouldRespondToPinchZoom (line 335) | private _shouldRespondToPinchZoom(e: TouchEventBasic) {
method _shouldRespondToRotate (line 354) | private _shouldRespondToRotate(e: TouchEventBasic) {
method _shouldRespondToPan (line 367) | protected _shouldRespondToPan(gestureState: GestureStatePoint) {
method _shouldRespondToPanVertical (line 378) | protected _shouldRespondToPanVertical(gestureState: GestureStatePoint) {
method _shouldRespondToPanHorizontal (line 394) | protected _shouldRespondToPanHorizontal(gestureState: GestureStatePoint) {
method _calcDistance (line 410) | private _calcDistance(dx: number, dy: number) {
method _calcAngle (line 414) | private _calcAngle(touches: TouchListBasic): number {
method _radiansToDegrees (line 426) | private _radiansToDegrees(rad: number): number {
method _sendMultiTouchEvents (line 430) | private _sendMultiTouchEvents(e: TouchEventBasic, gestureState: GestureS...
method _touchEventToTapGestureState (line 500) | protected _touchEventToTapGestureState(e: TouchEventBasic): Types.TapGes...
method _mouseEventToTapGestureState (line 526) | protected _mouseEventToTapGestureState(e: Types.MouseEvent): Types.TapGe...
method _getClientXYOffset (line 538) | protected _getClientXYOffset(): { x: number; y: number } {
method _sendPanEvent (line 542) | private _sendPanEvent(e: Types.TapGestureState, gestureState: GestureSta...
method _toMouseButton (line 606) | private static _toMouseButton(nativeEvent: any): number {
method _sendDoubleTapEvent (line 638) | protected _sendDoubleTapEvent(e: Types.TapGestureState) {
FILE: src/common/Image.ts
constant DEFAULT_RESIZE_MODE (line 12) | const DEFAULT_RESIZE_MODE: ImageResizeMode = 'contain';
FILE: src/common/Interfaces.ts
method initialize (line 53) | initialize(debug: boolean, development: boolean): void {
type FocusableComponent (line 133) | interface FocusableComponent {
class Component (line 147) | class Component<P, T> extends React.Component<P, T> {}
type ImageConstructor (line 149) | interface ImageConstructor {
type LocationConfiguration (line 188) | interface LocationConfiguration {
type ScrollViewConstructor (line 204) | interface ScrollViewConstructor {
type ScrollView (line 208) | interface ScrollView extends React.Component<Types.ScrollViewProps> {
type Animated (line 283) | interface Animated {
type International (line 298) | interface International {
FILE: src/common/Linking.ts
method launchSms (line 27) | launchSms(phoneInfo: RX.Types.SmsInfo): Promise<void> {
method openUrl (line 34) | openUrl(url: string): Promise<void> {
method _createEmailUrl (line 39) | protected _createEmailUrl(emailInfo: RX.Types.EmailInfo): string {
method _createSmsUrl (line 71) | protected _createSmsUrl(smsInfo: RX.Types.SmsInfo): string {
method _isEmailValid (line 83) | private _isEmailValid(email: string): boolean {
method _filterValidEmails (line 105) | private _filterValidEmails(emails: string[]): string[] {
FILE: src/common/Location.ts
class Location (line 13) | class Location extends RX.Location {
method setConfiguration (line 14) | setConfiguration(config: RX.LocationConfiguration): void {
method isAvailable (line 27) | isAvailable(): boolean {
method getCurrentPosition (line 33) | getCurrentPosition(options?: PositionOptions): Promise<Position> {
method watchPosition (line 66) | watchPosition(successCallback: RX.Types.LocationSuccessCallback, error...
method clearWatch (line 84) | clearWatch(watchID: RX.Types.LocationWatchId): void {
FILE: src/common/ModuleInterface.ts
type Accessibility (line 15) | type Accessibility = RX.Accessibility;
type ActivityIndicator (line 17) | type ActivityIndicator = RX.ActivityIndicator;
type Alert (line 19) | type Alert = RX.Alert;
type App (line 21) | type App = RX.App;
type Button (line 23) | type Button = RX.Button;
type Picker (line 25) | type Picker = RX.Picker;
type Clipboard (line 27) | type Clipboard = RX.Clipboard;
type GestureView (line 29) | type GestureView = RX.GestureView;
type Image (line 31) | type Image = RX.Image;
type Input (line 33) | type Input = RX.Input;
type International (line 35) | type International = RX.International;
type Link (line 37) | type Link = RX.Link;
type Linking (line 39) | type Linking = RX.Linking;
type Location (line 41) | type Location = RX.Location;
type Modal (line 43) | type Modal = RX.Modal;
type Platform (line 45) | type Platform = RX.Platform;
type Popup (line 47) | type Popup = RX.Popup;
type ScrollView (line 49) | type ScrollView = RX.ScrollView;
type StatusBar (line 51) | type StatusBar = RX.StatusBar;
type Storage (line 53) | type Storage = RX.Storage;
type Styles (line 55) | type Styles = RX.Styles;
type Text (line 57) | type Text = RX.Text;
type TextInput (line 59) | type TextInput = RX.TextInput;
type UserInterface (line 61) | type UserInterface = RX.UserInterface;
type UserPresence (line 63) | type UserPresence = RX.UserPresence;
type View (line 65) | type View = RX.View;
type Animated (line 68) | type Animated = RX.Animated;
FILE: src/common/PopupContainerViewBase.tsx
type PopupContainerViewBaseProps (line 19) | interface PopupContainerViewBaseProps<C> extends Types.CommonProps<C> {
type PopupContainerViewContext (line 23) | interface PopupContainerViewContext {
type PopupComponent (line 27) | interface PopupComponent {
type RecalcResult (line 32) | interface RecalcResult {
constant ALLEY_WIDTH (line 49) | const ALLEY_WIDTH = 2;
constant MIN_ANCHOR_OFFSET (line 53) | const MIN_ANCHOR_OFFSET = 16;
function recalcPositionFromLayoutData (line 56) | function recalcPositionFromLayoutData(windowDims: Dimensions, anchorRect...
function recalcInnerPosition (line 237) | function recalcInnerPosition(anchorRect: ClientRect, positionToUse: Popu...
method constructor (line 294) | constructor(props: P, context?: PopupContainerViewContext) {
method getChildContext (line 298) | getChildContext() {
method registerPopupComponent (line 305) | registerPopupComponent(onShow: () => void, onHide: () => void): PopupCom...
method unregisterPopupComponent (line 314) | unregisterPopupComponent(component: PopupComponent) {
method isHidden (line 318) | isHidden(): boolean {
method componentDidUpdate (line 322) | componentDidUpdate(prevProps: P, prevState: S) {
FILE: src/common/StyleLeakDetector.ts
class StyleLeakDetector (line 19) | class StyleLeakDetector {
method _getFingerprint (line 22) | private _getFingerprint<T extends Types.ViewAndImageCommonStyle>(objec...
method _sortAny (line 30) | private _sortAny(object: any): any {
method _sortObject (line 40) | private _sortObject(object: Dictionary<any>): Dictionary<any> {
method _sortArray (line 60) | private _sortArray(object: any[]): any[] {
method isDisabled (line 69) | protected isDisabled(): boolean {
method detectLeaks (line 73) | detectLeaks<T extends Types.ViewAndImageCommonStyle>(style: T): void {
FILE: src/common/Types.ts
type ReactNode (line 17) | type ReactNode = React.ReactNode;
type ReactInterface (line 22) | interface ReactInterface {
type FlexboxParentStyle (line 30) | interface FlexboxParentStyle {
type FlexboxChildrenStyle (line 79) | interface FlexboxChildrenStyle {
type FlexboxStyle (line 87) | interface FlexboxStyle extends FlexboxParentStyle, FlexboxChildrenStyle {
type InterpolationConfig (line 90) | interface InterpolationConfig {
method constructor (line 96) | constructor(val: number) {
type AnimatedFlexboxStyle (line 108) | interface AnimatedFlexboxStyle {
type TransformStyle (line 122) | interface TransformStyle {
type AnimatedTransformStyle (line 137) | interface AnimatedTransformStyle {
type StyleRuleSet (line 152) | type StyleRuleSet<T> = T | number | undefined;
type StyleRuleSetOrArray (line 153) | type StyleRuleSetOrArray<T> = StyleRuleSet<T> | StyleRuleSet<T>[];
type StyleRuleSetRecursiveArray (line 154) | interface StyleRuleSetRecursiveArray<T> extends Array<StyleRuleSetOrArra...
type StyleRuleSetRecursive (line 155) | type StyleRuleSetRecursive<T> = StyleRuleSet<T> | StyleRuleSetRecursiveA...
type ViewAndImageCommonStyle (line 160) | interface ViewAndImageCommonStyle extends FlexboxStyle, TransformStyle {
type AnimatedViewAndImageCommonStyle (line 174) | interface AnimatedViewAndImageCommonStyle extends AnimatedFlexboxStyle, ...
type ShadowOffset (line 184) | interface ShadowOffset {
type ViewStyle (line 189) | interface ViewStyle extends ViewAndImageCommonStyle {
type ViewStyleRuleSet (line 209) | type ViewStyleRuleSet = StyleRuleSet<ViewStyle>;
type AnimatedViewStyle (line 211) | interface AnimatedViewStyle extends AnimatedViewAndImageCommonStyle {
type AnimatedViewStyleRuleSet (line 214) | type AnimatedViewStyleRuleSet = StyleRuleSet<AnimatedViewStyle>;
type ScrollViewStyle (line 220) | interface ScrollViewStyle extends FlexboxParentStyle, TransformStyle {
type ScrollViewStyleRuleSet (line 226) | type ScrollViewStyleRuleSet = StyleRuleSet<ScrollViewStyle>;
type ButtonStyle (line 232) | interface ButtonStyle extends ViewStyle {
type ButtonStyleRuleSet (line 235) | type ButtonStyleRuleSet = StyleRuleSet<ButtonStyle>;
type ActivityIndicatorStyle (line 241) | interface ActivityIndicatorStyle extends ViewStyle {
type ActivityIndicatorStyleRuleSet (line 244) | type ActivityIndicatorStyleRuleSet = StyleRuleSet<ActivityIndicatorStyle>;
type FontInfo (line 250) | interface FontInfo {
type TextStyle (line 256) | interface TextStyle extends ViewStyle {
type TextStyleRuleSet (line 277) | type TextStyleRuleSet = StyleRuleSet<TextStyle>;
type AnimatedTextStyle (line 279) | interface AnimatedTextStyle extends AnimatedViewAndImageCommonStyle {
type AnimatedTextStyleRuleSet (line 284) | type AnimatedTextStyleRuleSet = StyleRuleSet<AnimatedTextStyle>;
type TextInputStyle (line 290) | interface TextInputStyle extends TextStyle {
type TextInputStyleRuleSet (line 293) | type TextInputStyleRuleSet = StyleRuleSet<TextInputStyle>;
type AnimatedTextInputStyle (line 295) | interface AnimatedTextInputStyle extends AnimatedViewAndImageCommonStyle {
type AnimatedTextInputStyleRuleSet (line 300) | type AnimatedTextInputStyleRuleSet = StyleRuleSet<AnimatedTextInputStyle>;
type LinkStyle (line 306) | interface LinkStyle extends TextStyle {
type LinkStyleRuleSet (line 309) | type LinkStyleRuleSet = StyleRuleSet<LinkStyle>;
type ImageStyle (line 315) | interface ImageStyle extends ViewAndImageCommonStyle, FlexboxStyle {
type ImageStyleRuleSet (line 321) | type ImageStyleRuleSet = StyleRuleSet<ImageStyle>;
type AnimatedImageStyle (line 323) | interface AnimatedImageStyle extends AnimatedViewAndImageCommonStyle, An...
type AnimatedImageStyleRuleSet (line 326) | type AnimatedImageStyleRuleSet = StyleRuleSet<AnimatedImageStyle>;
type PickerStyle (line 332) | interface PickerStyle extends ViewStyle {
type PickerStyleRuleSet (line 336) | type PickerStyleRuleSet = StyleRuleSet<PickerStyle>;
type ComponentBase (line 338) | type ComponentBase = React.Component<any, any>;
type RefObject (line 346) | interface RefObject<T> {
type Ref (line 349) | type Ref<T> = { bivarianceHack(instance: T | null): void }['bivarianceHa...
type RefAttributes (line 350) | interface RefAttributes<T> {
type CommonProps (line 355) | interface CommonProps<C = React.Component> extends RefAttributes<C> {
type Stateless (line 361) | interface Stateless {}
type CommonAccessibilityProps (line 366) | interface CommonAccessibilityProps {
type ImportantForAccessibility (line 384) | enum ImportantForAccessibility {
type AriaLive (line 391) | type AriaLive = 'off' | 'assertive' | 'polite';
type AccessibilityLiveRegion (line 395) | enum AccessibilityLiveRegion {
type AccessibilityTrait (line 405) | enum AccessibilityTrait {
type FocusArbitrator (line 461) | type FocusArbitrator = (candidates: FocusCandidate[]) => FocusCandidate ...
type FocusCandidate (line 465) | interface FocusCandidate {
type CommonStyledProps (line 473) | interface CommonStyledProps<T, C = React.Component> extends CommonProps<...
type ButtonProps (line 478) | interface ButtonProps extends CommonStyledProps<ButtonStyleRuleSet, RX.B...
type PickerPropsItem (line 510) | interface PickerPropsItem {
type PickerProps (line 514) | interface PickerProps extends CommonProps<RX.Picker> {
type Headers (line 525) | interface Headers {
type ImageResizeMode (line 530) | type ImageResizeMode = 'stretch' | 'contain' | 'cover' | 'auto' | 'repeat';
type ImagePropsShared (line 532) | interface ImagePropsShared<C = React.Component> extends CommonProps<C> {
type ImageProps (line 545) | interface ImageProps extends ImagePropsShared<RX.Image> {
type ImageMetadata (line 549) | interface ImageMetadata {
type AnimatedImageProps (line 554) | interface AnimatedImageProps extends ImagePropsShared<RX.AnimatedImage> {
type TextPropsShared (line 567) | interface TextPropsShared<C = React.Component> extends CommonProps<C> {
type TextProps (line 594) | interface TextProps extends TextPropsShared<RX.Text> {
type AnimatedTextProps (line 598) | interface AnimatedTextProps extends TextPropsShared<RX.AnimatedText> {
type ViewLayerType (line 602) | type ViewLayerType = 'none' | 'software' | 'hardware';
type LimitFocusType (line 604) | enum LimitFocusType {
type ViewPropsShared (line 615) | interface ViewPropsShared<C = React.Component> extends CommonProps<C>, C...
type ViewProps (line 688) | interface ViewProps extends ViewPropsShared<RX.View> {
type AnimatedViewProps (line 693) | interface AnimatedViewProps extends ViewPropsShared<RX.AnimatedView> {
type GestureState (line 698) | interface GestureState {
type TapGestureState (line 703) | interface TapGestureState extends GestureState {
type MultiTouchGestureState (line 710) | interface MultiTouchGestureState extends GestureState {
type ScrollWheelGestureState (line 734) | interface ScrollWheelGestureState extends TapGestureState {
type PanGestureState (line 738) | interface PanGestureState extends TapGestureState {
type GestureMouseCursor (line 749) | enum GestureMouseCursor {
type PreferredPanGesture (line 763) | enum PreferredPanGesture {
type GestureViewProps (line 768) | interface GestureViewProps extends CommonStyledProps<ViewStyleRuleSet, R...
type ScrollIndicatorInsets (line 802) | interface ScrollIndicatorInsets {
type ScrollViewProps (line 810) | interface ScrollViewProps extends CommonStyledProps<ScrollViewStyleRuleS...
type LinkProps (line 878) | interface LinkProps extends CommonStyledProps<LinkStyleRuleSet, RX.Link> {
type TextInputPropsShared (line 897) | interface TextInputPropsShared<C = React.Component> extends CommonProps<...
type TextInputProps (line 945) | interface TextInputProps extends TextInputPropsShared<RX.TextInput> {
type AnimatedTextInputProps (line 949) | interface AnimatedTextInputProps extends TextInputPropsShared<RX.Animate...
type ActivityIndicatorProps (line 954) | interface ActivityIndicatorProps extends CommonStyledProps<ActivityIndic...
type PopupPosition (line 963) | type PopupPosition = 'top' | 'right' | 'bottom' | 'left' | 'context';
type PopupOptions (line 966) | interface PopupOptions {
type ModalOptions (line 1022) | interface ModalOptions {
type AlertButtonSpec (line 1036) | interface AlertButtonSpec {
type AlertModalTheme (line 1043) | interface AlertModalTheme {
type AlertOptions (line 1057) | interface AlertOptions {
type LocationErrorType (line 1067) | enum LocationErrorType {
type LocationWatchId (line 1073) | type LocationWatchId = number;
type LocationSuccessCallback (line 1074) | type LocationSuccessCallback = (position: Position) => void;
type LocationFailureCallback (line 1075) | type LocationFailureCallback = (error: LocationErrorType) => void;
type EndResult (line 1082) | interface EndResult { finished: boolean }
type EndCallback (line 1083) | type EndCallback = (result: EndResult) => void;
type CompositeAnimation (line 1084) | interface CompositeAnimation {
type LoopConfig (line 1089) | interface LoopConfig {
type AnimationConfig (line 1093) | interface AnimationConfig {
type TimingAnimationConfig (line 1098) | interface TimingAnimationConfig extends AnimationConfig {
type InterpolationConfigType (line 1106) | interface InterpolationConfigType {
type TimingFunction (line 1111) | type TimingFunction = (value: RX.Types.AnimatedValue | RX.Types.Interpol...
type SequenceFunction (line 1115) | type SequenceFunction = (animations: CompositeAnimation[]) => CompositeA...
type ParallelFunction (line 1118) | type ParallelFunction = (animations: CompositeAnimation[]) => CompositeA...
type EasingFunction (line 1121) | interface EasingFunction {
type Easing (line 1126) | interface Easing {
type SyntheticEvent (line 1145) | interface SyntheticEvent {
type ClipboardEvent (line 1155) | interface ClipboardEvent extends SyntheticEvent {
type FocusEvent (line 1159) | type FocusEvent = SyntheticEvent;
type MouseEvent (line 1161) | interface MouseEvent extends SyntheticEvent {
type DragEvent (line 1173) | interface DragEvent extends MouseEvent {
type Touch (line 1177) | interface Touch {
type TouchList (line 1189) | interface TouchList {
type TouchEvent (line 1196) | interface TouchEvent extends SyntheticEvent {
type WheelEvent (line 1212) | interface WheelEvent extends SyntheticEvent {
type ViewOnLayoutEvent (line 1219) | interface ViewOnLayoutEvent {
type KeyboardEvent (line 1226) | interface KeyboardEvent extends SyntheticEvent {
type Dimensions (line 1243) | interface Dimensions {
type EmailInfo (line 1251) | interface EmailInfo {
type SmsInfo (line 1259) | interface SmsInfo {
type LinkingErrorCode (line 1264) | enum LinkingErrorCode {
type LinkingErrorInfo (line 1271) | interface LinkingErrorInfo {
type AppActivationState (line 1280) | enum AppActivationState {
type LayoutInfo (line 1289) | interface LayoutInfo {
type PlatformType (line 1299) | type PlatformType = 'web' | 'ios' | 'android' | 'windows' | 'macos';
FILE: src/common/lodashMini.ts
type Dictionary (line 17) | interface Dictionary<T> {
FILE: src/common/utils/AutoFocusHelper.ts
type FocusCandidateType (line 22) | enum FocusCandidateType {
type FocusCandidateInternal (line 27) | interface FocusCandidateInternal {
type SortAndFilterFunc (line 35) | type SortAndFilterFunc = (candidates: FocusCandidateInternal[]) => Focus...
function setSortAndFilterFunc (line 37) | function setSortAndFilterFunc(sortAndFilter: SortAndFilterFunc): void {
class FocusArbitratorProvider (line 41) | class FocusArbitratorProvider {
method constructor (line 49) | constructor(view?: RX.View, arbitrator?: RX.Types.FocusArbitrator) {
method _notifyParent (line 57) | private _notifyParent(): void {
method _arbitrate (line 64) | private _arbitrate(): FocusCandidateInternal | undefined {
method _requestFocus (line 80) | private _requestFocus(component: React.Component<any, any>, focus: () ...
method _arbitrate (line 96) | private static _arbitrate(candidates: FocusCandidateInternal[],
method setCallback (line 148) | setCallback(arbitrator?: RX.Types.FocusArbitrator): void {
method requestFocus (line 152) | static requestFocus(component: React.Component<any, any>, focus: () =>...
FILE: src/common/utils/EventHelpers.ts
function toMouseButton (line 8) | function toMouseButton(nativeEvent: any): number {
FILE: src/common/utils/FocusManager.ts
type RestrictFocusType (line 20) | enum RestrictFocusType {
type FocusableInternal (line 31) | interface FocusableInternal {
type FocusableComponentInternal (line 35) | type FocusableComponentInternal = React.Component<any, any> & FocusableI...
type StoredFocusableComponent (line 37) | interface StoredFocusableComponent {
type FocusableComponentStateCallback (line 50) | type FocusableComponentStateCallback = (restrictedOrLimited: boolean) =>...
type FocusManagerRestrictionStateCallback (line 52) | type FocusManagerRestrictionStateCallback = (restricted: RestrictFocusTy...
method constructor (line 71) | constructor(parent: FocusManager | undefined) {
method addFocusableComponent (line 85) | addFocusableComponent(component: FocusableComponentInternal, accessibleO...
method removeFocusableComponent (line 134) | removeFocusableComponent(component: FocusableComponentInternal): void {
method restrictFocusWithin (line 163) | restrictFocusWithin(restrictType: RestrictFocusType, noFocusReset?: bool...
method removeFocusRestriction (line 203) | removeFocusRestriction(): void {
method limitFocusWithin (line 266) | limitFocusWithin(limitType: Types.LimitFocusType): void {
method removeFocusLimitation (line 288) | removeFocusLimitation(): void {
method release (line 308) | release(): void {
method subscribe (line 313) | static subscribe(component: FocusableComponentInternal, callback: Focusa...
method unsubscribe (line 325) | static unsubscribe(component: FocusableComponentInternal, callback: Focu...
method setRestrictionStateCallback (line 333) | setRestrictionStateCallback(callback: FocusManagerRestrictionStateCallba...
method isComponentFocusRestrictedOrLimited (line 337) | static isComponentFocusRestrictedOrLimited(component: FocusableComponent...
method getCurrentFocusedComponent (line 343) | static getCurrentFocusedComponent(): string | undefined {
method _getStoredComponent (line 347) | private static _getStoredComponent(component: FocusableComponentInternal...
method _callFocusableComponentStateChangeCallbacks (line 357) | protected static _callFocusableComponentStateChangeCallbacks(storedCompo...
method _removeFocusRestriction (line 368) | private /* static */ _removeFocusRestriction(): void {
method _clearRestoreRestrictionTimeout (line 376) | private static _clearRestoreRestrictionTimeout(): void {
function applyFocusableComponentMixin (line 395) | function applyFocusableComponentMixin(Component: any, isConditionallyFoc...
FILE: src/common/utils/PromiseDefer.ts
class Defer (line 13) | class Defer<T> {
method constructor (line 17) | constructor() {
method resolve (line 24) | resolve(value: T): void {
method reject (line 35) | reject(value: any): void {
method promise (line 46) | promise(): Promise<T> {
FILE: src/common/utils/Timers.ts
class Timers (line 19) | class Timers {
method clearInterval (line 20) | static clearInterval(handle: number): void {
method clearTimeout (line 24) | static clearTimeout(handle: number): void {
method setInterval (line 28) | static setInterval(handler: () => void, timeout: number): number {
method setTimeout (line 32) | static setTimeout(handler: () => void, timeout: number): number {
FILE: src/ios/Accessibility.ts
type AnnouncementFinishedPayload (line 15) | interface AnnouncementFinishedPayload {
class Accessibility (line 22) | class Accessibility extends NativeAccessibility {
method constructor (line 27) | constructor() {
method _updateScreenReaderStatus (line 39) | protected _updateScreenReaderStatus(isEnabled: boolean): void {
method announceForAccessibility (line 47) | announceForAccessibility(announcement: string): void {
method _postAnnouncement (line 68) | private _postAnnouncement(announcement: string, resetTimestamp = true)...
method _compareRawAnnouncements (line 102) | private _compareRawAnnouncements(postedAnnouncement: string, payloadAn...
FILE: src/ios/AccessibilityUtil.ts
class AccessibilityUtil (line 16) | class AccessibilityUtil extends AccessibilityPlatformUtil {
method setAccessibilityFocus (line 17) | setAccessibilityFocus(component: React.Component<any, any>): void {
FILE: src/ios/GestureView.tsx
class GestureView (line 15) | class GestureView extends BaseGestureView {
method constructor (line 17) | constructor(props: Types.GestureViewProps) {
method _getPreferredPanRatio (line 21) | protected _getPreferredPanRatio(): number {
method _getEventTimestamp (line 25) | protected _getEventTimestamp(e: Types.TouchEvent | Types.MouseEvent): ...
FILE: src/ios/Linking.ts
class Linking (line 13) | class Linking extends CommonLinking {
method _createSmsUrl (line 15) | protected _createSmsUrl(smsInfo: Types.SmsInfo): string {
FILE: src/ios/ReactXP.ts
type Accessibility (line 53) | type Accessibility = RXInterfaces.Accessibility;
type ActivityIndicator (line 55) | type ActivityIndicator = RXInterfaces.ActivityIndicator;
type Alert (line 57) | type Alert = RXInterfaces.Alert;
type App (line 59) | type App = RXInterfaces.App;
type Button (line 61) | type Button = RXInterfaces.Button;
type Picker (line 63) | type Picker = RXInterfaces.Picker;
type Clipboard (line 65) | type Clipboard = RXInterfaces.Clipboard;
type GestureView (line 67) | type GestureView = RXInterfaces.GestureView;
type Image (line 69) | type Image = RXInterfaces.Image;
type Input (line 71) | type Input = RXInterfaces.Input;
type International (line 73) | type International = RXInterfaces.International;
type Link (line 75) | type Link = RXInterfaces.Link;
type Linking (line 77) | type Linking = RXInterfaces.Linking;
type Location (line 79) | type Location = RXInterfaces.Location;
type Modal (line 81) | type Modal = RXInterfaces.Modal;
type Platform (line 83) | type Platform = RXInterfaces.Platform;
type Popup (line 85) | type Popup = RXInterfaces.Popup;
type ScrollView (line 87) | type ScrollView = RXInterfaces.ScrollView;
type StatusBar (line 89) | type StatusBar = RXInterfaces.StatusBar;
type Storage (line 91) | type Storage = RXInterfaces.Storage;
type Styles (line 93) | type Styles = RXInterfaces.Styles;
type Text (line 95) | type Text = RXInterfaces.Text;
type TextInput (line 97) | type TextInput = RXInterfaces.TextInput;
type UserInterface (line 99) | type UserInterface = RXInterfaces.UserInterface;
type UserPresence (line 101) | type UserPresence = RXInterfaces.UserPresence;
type View (line 103) | type View = RXInterfaces.View;
FILE: src/ios/StatusBar.ts
class StatusBar (line 14) | class StatusBar extends RX.StatusBar {
method isOverlay (line 15) | isOverlay(): boolean {
method setBarStyle (line 21) | setBarStyle(style: 'default' | 'light-content' | 'dark-content', anima...
method setHidden (line 25) | setHidden(hidden: boolean, showHideTransition: 'fade' | 'slide'): void {
method setNetworkActivityIndicatorVisible (line 29) | setNetworkActivityIndicatorVisible(value: boolean): void {
method setBackgroundColor (line 33) | setBackgroundColor(color: string, animated: boolean): void {
method setTranslucent (line 37) | setTranslucent(translucent: boolean): void {
FILE: src/macos/Accessibility.ts
type AnnouncementFinishedPayload (line 15) | interface AnnouncementFinishedPayload {
class Accessibility (line 22) | class Accessibility extends NativeAccessibility {
method constructor (line 27) | constructor() {
method _updateScreenReaderStatus (line 39) | protected _updateScreenReaderStatus(isEnabled: boolean): void {
method announceForAccessibility (line 47) | announceForAccessibility(announcement: string): void {
method _postAnnouncement (line 68) | private _postAnnouncement(announcement: string, resetTimestamp = true)...
FILE: src/macos/AccessibilityUtil.ts
class AccessibilityUtil (line 16) | class AccessibilityUtil extends AccessibilityPlatformUtil {
method setAccessibilityFocus (line 17) | setAccessibilityFocus(component: React.Component<any, any>): void {
FILE: src/macos/GestureView.tsx
class GestureView (line 15) | class GestureView extends BaseGestureView {
method constructor (line 17) | constructor(props: Types.GestureViewProps) {
method _getPreferredPanRatio (line 21) | protected _getPreferredPanRatio(): number {
method _getEventTimestamp (line 25) | protected _getEventTimestamp(e: Types.TouchEvent | Types.MouseEvent): ...
FILE: src/macos/Input.ts
class Input (line 12) | class Input extends RX.Input {
method constructor (line 13) | constructor() {
FILE: src/macos/Linking.ts
class Linking (line 13) | class Linking extends CommonLinking {
method _createSmsUrl (line 15) | protected _createSmsUrl(smsInfo: Types.SmsInfo): string {
FILE: src/macos/ReactXP.ts
type Accessibility (line 54) | type Accessibility = RXInterfaces.Accessibility;
type ActivityIndicator (line 56) | type ActivityIndicator = RXInterfaces.ActivityIndicator;
type Alert (line 58) | type Alert = RXInterfaces.Alert;
type App (line 60) | type App = RXInterfaces.App;
type Button (line 62) | type Button = RXInterfaces.Button;
type Picker (line 64) | type Picker = RXInterfaces.Picker;
type Clipboard (line 66) | type Clipboard = RXInterfaces.Clipboard;
type GestureView (line 68) | type GestureView = RXInterfaces.GestureView;
type Image (line 70) | type Image = RXInterfaces.Image;
type Input (line 72) | type Input = RXInterfaces.Input;
type International (line 74) | type International = RXInterfaces.International;
type Link (line 76) | type Link = RXInterfaces.Link;
type Linking (line 78) | type Linking = RXInterfaces.Linking;
type Location (line 80) | type Location = RXInterfaces.Location;
type Modal (line 82) | type Modal = RXInterfaces.Modal;
type Platform (line 84) | type Platform = RXInterfaces.Platform;
type Popup (line 86) | type Popup = RXInterfaces.Popup;
type ScrollView (line 88) | type ScrollView = RXInterfaces.ScrollView;
type StatusBar (line 90) | type StatusBar = RXInterfaces.StatusBar;
type Storage (line 92) | type Storage = RXInterfaces.Storage;
type Styles (line 94) | type Styles = RXInterfaces.Styles;
type Text (line 96) | type Text = RXInterfaces.Text;
type TextInput (line 98) | type TextInput = RXInterfaces.TextInput;
type UserInterface (line 100) | type UserInterface = RXInterfaces.UserInterface;
type UserPresence (line 102) | type UserPresence = RXInterfaces.UserPresence;
type View (line 104) | type View = RXInterfaces.View;
FILE: src/macos/StatusBar.ts
class StatusBar (line 12) | class StatusBar extends RX.StatusBar {
method isOverlay (line 13) | isOverlay(): boolean {
method setHidden (line 18) | setHidden(hidden: boolean, showHideTransition: 'fade' | 'slide'): void {
method setBackgroundColor (line 22) | setBackgroundColor(color: string, animated: boolean): void {
method setTranslucent (line 26) | setTranslucent(translucent: boolean): void {
method setBarStyle (line 30) | setBarStyle(style: 'default' | 'light-content' | 'dark-content', anima...
method setNetworkActivityIndicatorVisible (line 34) | setNetworkActivityIndicatorVisible(value: boolean): void {
FILE: src/macos/View.tsx
class View (line 15) | class View extends ViewCommon {
method _buildInternalProps (line 17) | protected _buildInternalProps(props: Types.ViewProps) {
FILE: src/native-common/Accessibility.ts
type MacComponentAccessibilityProps (line 16) | interface MacComponentAccessibilityProps {
class Accessibility (line 22) | class Accessibility extends CommonAccessibility {
method constructor (line 25) | constructor() {
method _updateScreenReaderStatus (line 51) | protected _updateScreenReaderStatus(isEnabled: boolean): void {
method isScreenReaderEnabled (line 58) | isScreenReaderEnabled(): boolean {
FILE: src/native-common/AccessibilityUtil.ts
type AccessibilityLiveRegionValue (line 24) | type AccessibilityLiveRegionValue = 'none' | 'polite' | 'assertive';
type AccessibilityComponentTypeValue (line 59) | type AccessibilityComponentTypeValue = 'none' | 'button' | 'radiobutton_...
class AccessibilityUtil (line 75) | class AccessibilityUtil extends CommonAccessibilityUtil {
method setAccessibilityPlatformUtil (line 79) | setAccessibilityPlatformUtil(instance: AccessibilityPlatformUtil): void {
method accessibilityTraitToString (line 87) | accessibilityTraitToString(overrideTraits: Types.AccessibilityTrait | ...
method accessibilityComponentTypeToString (line 109) | accessibilityComponentTypeToString(overrideTraits: Types.Accessibility...
method accessibilityLiveRegionToString (line 123) | accessibilityLiveRegionToString(liveRegion: Types.AccessibilityLiveReg...
method setAccessibilityFocus (line 131) | setAccessibilityFocus(component: React.Component<any, any>): void {
FILE: src/native-common/ActivityIndicator.tsx
type ActivityIndicatorState (line 16) | interface ActivityIndicatorState {
class ActivityIndicator (line 20) | class ActivityIndicator extends React.Component<Types.ActivityIndicatorP...
method constructor (line 23) | constructor(props: Types.ActivityIndicatorProps) {
method componentDidMount (line 29) | componentDidMount() {
method componentWillUnmount (line 43) | componentWillUnmount() {
method render (line 47) | render() {
FILE: src/native-common/Alert.ts
class Alert (line 17) | class Alert implements RX.Alert {
method show (line 18) | show(title: string, message?: string, buttons?: RX.Types.AlertButtonSp...
FILE: src/native-common/Animated.tsx
type AnimatedClasses (line 21) | interface AnimatedClasses {
class AnimatedWrapper (line 37) | class AnimatedWrapper<P, T, C> extends RX.AnimatedComponent<P, T, C> {
method setNativeProps (line 40) | setNativeProps(props: P) {
method focus (line 46) | focus() {
method requestFocus (line 53) | requestFocus() {
method blur (line 60) | blur() {
class AnimatedImage (line 72) | class AnimatedImage extends AnimatedWrapper<RX.Types.AnimatedImageProps,...
method render (line 73) | render() {
class AnimatedText (line 86) | class AnimatedText extends AnimatedWrapper<RX.Types.AnimatedTextProps, R...
method render (line 87) | render() {
class AnimatedTextInput (line 100) | class AnimatedTextInput extends AnimatedWrapper<RX.Types.AnimatedTextInp...
method render (line 101) | render() {
class AnimatedView (line 114) | class AnimatedView extends AnimatedWrapper<RX.Types.AnimatedViewProps, R...
method setFocusRestricted (line 115) | setFocusRestricted(restricted: boolean) {
method setFocusLimited (line 119) | setFocusLimited(limited: boolean) {
method render (line 123) | render() {
class FocusRestrictedAnimatedView (line 136) | class FocusRestrictedAnimatedView extends AnimatedView {
method setFocusRestricted (line 137) | setFocusRestricted(restricted: boolean) {
method setFocusLimited (line 144) | setFocusLimited(limited: boolean) {
function animate (line 159) | function animate(): void {
function makeAnimated (line 208) | function makeAnimated(nativeAnimatedClasses: AnimatedClasses, useFocusRe...
FILE: src/native-common/App.ts
class App (line 27) | class App extends RX.App {
method constructor (line 28) | constructor() {
method initialize (line 41) | initialize(debug: boolean, development: boolean): void {
method getActivationState (line 48) | getActivationState(): RX.Types.AppActivationState {
method getRootViewFactory (line 52) | protected getRootViewFactory(): RN.ComponentProvider {
method getRootViewUsingPropsFactory (line 56) | protected getRootViewUsingPropsFactory(): RN.ComponentProvider {
FILE: src/native-common/Button.tsx
function noop (line 53) | function noop() { /* noop */ }
function applyMixin (line 55) | function applyMixin(thisObj: any, mixin: {[propertyName: string]: any}, ...
type ButtonContext (line 67) | interface ButtonContext {
class Button (line 72) | class Button extends ButtonBase {
method constructor (line 106) | constructor(props: Types.ButtonProps, context?: ButtonContext) {
method _render (line 124) | protected _render(internalProps: RN.ViewProps, onMount: (btn: RN.View ...
method render (line 132) | render() {
method componentDidMount (line 186) | componentDidMount() {
method componentWillUnmount (line 195) | componentWillUnmount() {
method UNSAFE_componentWillReceiveProps (line 200) | UNSAFE_componentWillReceiveProps(nextProps: Types.ButtonProps) {
method getChildContext (line 205) | getChildContext(): ButtonContext {
method setNativeProps (line 209) | setNativeProps(nativeProps: RN.ViewProps) {
method requestFocus (line 280) | requestFocus() {
method blur (line 288) | blur() {
method focus (line 294) | focus() {
method _setOpacityStyles (line 303) | private _setOpacityStyles(props: Types.ButtonProps, prevProps?: Types....
method _isTouchFeedbackApplicable (line 318) | private _isTouchFeedbackApplicable() {
method _opacityActive (line 322) | private _opacityActive(duration: number) {
method _opacityInactive (line 326) | private _opacityInactive(duration: number) {
method _getDefaultOpacityValue (line 330) | private _getDefaultOpacityValue(style?: StyleRuleSetRecursive<ButtonSt...
method setOpacityTo (line 372) | setOpacityTo(value: number, duration: number) {
method _hasPressHandler (line 383) | private _hasPressHandler() {
method _showUnderlay (line 392) | private _showUnderlay() {
FILE: src/native-common/Clipboard.ts
class Clipboard (line 14) | class Clipboard extends RX.Clipboard {
method setText (line 15) | setText(text: string): void {
method getText (line 19) | getText(): Promise<string> {
FILE: src/native-common/FrontLayerViewManager.tsx
class ModalStackContext (line 22) | class ModalStackContext {
method constructor (line 23) | constructor(public modalId: string, public modal: React.ReactElement<T...
class PopupStackContext (line 26) | class PopupStackContext {
method constructor (line 27) | constructor(public popupId: string, public popupOptions: Types.PopupOp...
constant MAX_CACHED_POPUPS (line 39) | const MAX_CACHED_POPUPS = 4;
class FrontLayerViewManager (line 41) | class FrontLayerViewManager {
method showModal (line 47) | showModal(modal: React.ReactElement<Types.ViewProps>, modalId: string,...
method isModalDisplayed (line 56) | isModalDisplayed(modalId?: string): boolean {
method dismissModal (line 64) | dismissModal(modalId: string): void {
method dismissAllmodals (line 73) | dismissAllmodals(): void {
method showPopup (line 80) | showPopup(popupOptions: Types.PopupOptions, popupId: string, delay?: n...
method dismissPopup (line 98) | dismissPopup(popupId: string): void {
method dismissAllPopups (line 118) | dismissAllPopups(): void {
method getModalLayerView (line 125) | getModalLayerView(rootViewId?: string | null): React.ReactElement<any>...
method getActivePopupId (line 149) | getActivePopupId(): string | null {
method releaseCachedPopups (line 157) | releaseCachedPopups(): void {
method _modalOptionsMatchesRootViewId (line 162) | private _modalOptionsMatchesRootViewId(options?: Types.ModalOptions, r...
method _renderPopup (line 166) | private _renderPopup(context: PopupStackContext, hidden: boolean): JSX...
method _getOverlayContext (line 179) | private _getOverlayContext(rootViewId?: string | null): PopupStackCont...
method isPopupActiveFor (line 186) | isPopupActiveFor(rootViewId?: string | null): boolean {
method getPopupLayerView (line 190) | getPopupLayerView(rootViewId?: string | null): JSX.Element | null {
method _dismissActivePopup (line 263) | private _dismissActivePopup(): void {
method _findIndexOfModal (line 271) | private _findIndexOfModal(modalId: string): number {
method _findIndexOfPopup (line 275) | private _findIndexOfPopup(popupId: string): number {
method _getActiveOverlay (line 279) | private _getActiveOverlay() {
method isPopupDisplayed (line 284) | isPopupDisplayed(popupId?: string): boolean {
FILE: src/native-common/GestureView.tsx
method constructor (line 34) | constructor(props: Types.GestureViewProps) {
method render (line 74) | render() {
method focus (line 126) | focus() {
method blur (line 132) | blur() {
FILE: src/native-common/Image.tsx
type ImageContext (line 31) | interface ImageContext {
type ImageState (line 35) | interface ImageState {
class Image (line 41) | class Image extends React.Component<Types.ImageProps, ImageState> implem...
method prefetch (line 46) | static prefetch(url: string): Promise<boolean> {
method getMetadata (line 50) | static getMetadata(url: string): Promise<Types.ImageMetadata> {
method _getAdditionalProps (line 71) | protected _getAdditionalProps(): RN.ImageProperties | {} {
method render (line 75) | render() {
method UNSAFE_componentWillReceiveProps (line 122) | UNSAFE_componentWillReceiveProps(nextProps: Types.ImageProps) {
method setNativeProps (line 134) | setNativeProps(nativeProps: RN.ImageProps) {
method getChildContext (line 140) | getChildContext() {
method getStyles (line 147) | protected getStyles() {
method _buildResizeMode (line 151) | private _buildResizeMode(): RN.ImageResizeMode {
method _maybeOverrideHeaders (line 199) | private static _maybeOverrideHeaders(props: Types.ImageProps): Types.H...
method _buildSource (line 212) | private _buildSource(): RN.ImageSourcePropType {
method _getMaxStaleHeader (line 226) | private static _getMaxStaleHeader(headers?: Types.Headers): string | u...
method getNativeWidth (line 240) | getNativeWidth(): number | undefined {
method getNativeHeight (line 244) | getNativeHeight(): number | undefined {
FILE: src/native-common/Input.ts
class Input (line 14) | class Input extends RX.Input {
method constructor (line 15) | constructor() {
FILE: src/native-common/International.ts
class International (line 14) | class International implements RX.International {
method constructor (line 17) | constructor() {
method allowRTL (line 25) | allowRTL(allow: boolean): void {
method forceRTL (line 29) | forceRTL(force: boolean): void {
method isRTL (line 33) | isRTL(): boolean {
FILE: src/native-common/Link.tsx
type LinkContext (line 21) | interface LinkContext {
class LinkBase (line 26) | class LinkBase<S> extends React.Component<RX.Types.LinkProps, S> {
method setNativeProps (line 38) | setNativeProps(nativeProps: RN.TextProps) {
method render (line 44) | render() {
method componentDidMount (line 59) | componentDidMount() {
method componentWillUnmount (line 67) | componentWillUnmount() {
method _render (line 71) | protected _render(internalProps: RN.TextProps, onMount: (text: RN.Text...
method requestFocus (line 116) | requestFocus() {
method focus (line 124) | focus() {
method blur (line 133) | blur() {
class Link (line 140) | class Link extends LinkBase<{}> {
FILE: src/native-common/Linking.ts
class Linking (line 15) | class Linking extends CommonLinking {
method constructor (line 16) | constructor() {
method _openUrl (line 24) | protected _openUrl(url: string): Promise<void> {
method getInitialUrl (line 47) | getInitialUrl(): Promise<string | undefined> {
method launchEmail (line 60) | launchEmail(emailInfo: Types.EmailInfo): Promise<void> {
FILE: src/native-common/MainViewStore.ts
class MainViewStore (line 14) | class MainViewStore extends SubscribableEvent<() => void> {
method getMainView (line 17) | getMainView(): React.ReactElement<any> | undefined {
method setMainView (line 21) | setMainView(view: React.ReactElement<any>): void {
FILE: src/native-common/Modal.ts
class Modal (line 17) | class Modal extends RX.Modal {
method isDisplayed (line 18) | isDisplayed(modalId?: string): boolean {
method show (line 22) | show(modal: React.ReactElement<RX.Types.ViewProps>, modalId: string, o...
method dismiss (line 29) | dismiss(modalId: string): void {
method dismissAll (line 35) | dismissAll(): void {
FILE: src/native-common/ModalContainer.tsx
type ModalContainerProps (line 36) | interface ModalContainerProps extends Types.CommonProps<ModalContainer> {
class ModalContainer (line 40) | class ModalContainer extends React.Component<ModalContainerProps, Types....
method constructor (line 41) | constructor(props: ModalContainerProps) {
method render (line 45) | render() {
FILE: src/native-common/Picker.tsx
class Picker (line 17) | class Picker extends RX.Picker {
method render (line 18) | render() {
FILE: src/native-common/Platform.ts
class Platform (line 14) | class Platform extends RX.Platform {
method getType (line 15) | getType(): RX.Types.PlatformType {
method select (line 19) | select<T>(specifics: { [ platform in RX.Types.PlatformType | 'default'...
FILE: src/native-common/Popup.ts
class Popup (line 16) | class Popup extends RX.Popup {
method show (line 17) | show(options: RX.Types.PopupOptions, popupId: string, delay?: number):...
method autoDismiss (line 24) | autoDismiss(popupId: string, delay?: number): void {
method dismiss (line 30) | dismiss(popupId: string): void {
method dismissAll (line 36) | dismissAll(): void {
method isDisplayed (line 40) | isDisplayed(popupId?: string): boolean {
method _isValidAnchor (line 44) | private _isValidAnchor(options: RX.Types.PopupOptions): boolean {
FILE: src/native-common/PopupContainerView.tsx
type PopupContainerViewProps (line 26) | interface PopupContainerViewProps extends PopupContainerViewBaseProps<Po...
type PopupContainerViewState (line 32) | interface PopupContainerViewState extends RecalcResult {
class PopupContainerView (line 41) | class PopupContainerView extends PopupContainerViewBase<PopupContainerVi...
method constructor (line 46) | constructor(props: PopupContainerViewProps, context?: PopupContainerVi...
method _getInitialState (line 51) | private _getInitialState(): PopupContainerViewState {
method UNSAFE_componentWillReceiveProps (line 65) | UNSAFE_componentWillReceiveProps(prevProps: PopupContainerViewProps) {
method componentDidUpdate (line 72) | componentDidUpdate(prevProps: PopupContainerViewProps, prevState: Popu...
method componentDidMount (line 86) | componentDidMount() {
method componentWillUnmount (line 97) | componentWillUnmount() {
method render (line 101) | render() {
method _recalcPosition (line 142) | private _recalcPosition() {
method _recalcPositionFromLayoutData (line 177) | private _recalcPositionFromLayoutData(anchorRect: ClientRect, popupRec...
method _dismissPopup (line 215) | private _dismissPopup() {
method _startRepositionPopupTimer (line 221) | private _startRepositionPopupTimer() {
method _stopRepositionPopupTimer (line 227) | private _stopRepositionPopupTimer() {
FILE: src/native-common/RootView.tsx
type BaseRootViewProps (line 28) | interface BaseRootViewProps {
type RootViewPropsWithMainViewType (line 32) | interface RootViewPropsWithMainViewType extends BaseRootViewProps {
type RootViewState (line 36) | interface RootViewState {
method constructor (line 69) | constructor(props: P) {
method UNSAFE_componentWillMount (line 74) | UNSAFE_componentWillMount(): void {
method componentDidMount (line 94) | componentDidMount(): void {
method componentWillUnmount (line 100) | componentWillUnmount(): void {
method render (line 121) | render() {
method _renderAnnouncerView (line 150) | protected _renderAnnouncerView(): JSX.Element {
method renderTopView (line 160) | renderTopView(content: JSX.Element): JSX.Element {
class RootViewUsingStore (line 166) | class RootViewUsingStore extends BaseRootView<BaseRootViewProps> {
method constructor (line 169) | constructor(props: BaseRootViewProps) {
method UNSAFE_componentWillMount (line 178) | UNSAFE_componentWillMount(): void {
method componentWillUnmount (line 185) | componentWillUnmount(): void {
method _onChange (line 190) | private _onChange() {
method _getStateFromStore (line 194) | private _getStateFromStore(): RootViewState {
method _getPropsForMainView (line 206) | protected _getPropsForMainView(): {} {
class RootViewUsingProps (line 213) | class RootViewUsingProps extends BaseRootView<RootViewPropsWithMainViewT...
method constructor (line 214) | constructor(props: RootViewPropsWithMainViewType) {
method _getPropsForMainView (line 232) | protected _getPropsForMainView(): {} {
FILE: src/native-common/ScrollView.tsx
class ScrollView (line 22) | class ScrollView extends ViewBase<RX.Types.ScrollViewProps, RX.Types.Sta...
method _render (line 28) | protected _render(nativeProps: RN.ScrollViewProps & React.Props<RN.Scr...
method render (line 45) | render() {
method setScrollTop (line 154) | setScrollTop(scrollTop: number, animate?: boolean): void {
method setScrollLeft (line 169) | setScrollLeft(scrollLeft: number, animate?: boolean): void {
method useCustomScrollbars (line 184) | static useCustomScrollbars() {
FILE: src/native-common/Storage.ts
class Storage (line 15) | class Storage extends RX.Storage {
method getItem (line 16) | getItem(key: string): Promise<string | undefined> {
method setItem (line 32) | setItem(key: string, value: string): Promise<void> {
method removeItem (line 48) | removeItem(key: string): Promise<void> {
method clear (line 64) | clear(): Promise<void> {
FILE: src/native-common/StyleLeakDetector.ts
class StyleLeakDetector (line 14) | class StyleLeakDetector extends CommonStyleLeakDetector {
method isDisabled (line 15) | protected isDisabled(): boolean {
FILE: src/native-common/Styles.ts
type ReactNativeViewAndImageCommonStyle (line 35) | type ReactNativeViewAndImageCommonStyle<Style extends RX.Types.ViewAndIm...
class Styles (line 44) | class Styles extends RX.Styles {
method combine (line 45) | combine<S>(ruleSet1: RX.Types.StyleRuleSetRecursive<S> | undefined,
method createViewStyle (line 85) | createViewStyle(ruleSet: RX.Types.ViewStyle, cacheStyle = true): RX.Ty...
method createAnimatedViewStyle (line 90) | createAnimatedViewStyle(ruleSet: RX.Types.AnimatedViewStyle): RX.Types...
method createScrollViewStyle (line 95) | createScrollViewStyle(ruleSet: RX.Types.ScrollViewStyle, cacheStyle = ...
method createButtonStyle (line 100) | createButtonStyle(ruleSet: RX.Types.ButtonStyle, cacheStyle = true): R...
method createTextStyle (line 105) | createTextStyle(ruleSet: RX.Types.TextStyle, cacheStyle = true): RX.Ty...
method createAnimatedTextStyle (line 110) | createAnimatedTextStyle(ruleSet: RX.Types.AnimatedTextStyle): RX.Types...
method createTextInputStyle (line 115) | createTextInputStyle(ruleSet: RX.Types.TextInputStyle, cacheStyle = tr...
method createAnimatedTextInputStyle (line 120) | createAnimatedTextInputStyle(ruleSet: RX.Types.AnimatedTextInputStyle)...
method createImageStyle (line 125) | createImageStyle(ruleSet: RX.Types.ImageStyle, cacheStyle = true): RX....
method createAnimatedImageStyle (line 130) | createAnimatedImageStyle(ruleSet: RX.Types.AnimatedImageStyle): RX.Typ...
method createLinkStyle (line 135) | createLinkStyle(ruleSet: RX.Types.LinkStyle, cacheStyle = true): RX.Ty...
method createPickerStyle (line 140) | createPickerStyle(ruleSet: RX.Types.PickerStyle, cacheStyle = true): R...
method getCssPropertyAliasesCssStyle (line 144) | getCssPropertyAliasesCssStyle(): {[key: string]: string} {
method _adaptStyles (line 149) | private _adaptStyles<S extends RX.Types.ViewAndImageCommonStyle>(def: S,
method _adaptAnimatedStyles (line 224) | private _adaptAnimatedStyles<T extends RX.Types.AnimatedViewAndImageCo...
FILE: src/native-common/Text.tsx
type TextContext (line 28) | interface TextContext {
class Text (line 34) | class Text extends React.Component<Types.TextProps, Types.Stateless> imp...
method setNativeProps (line 49) | setNativeProps(nativeProps: RN.TextProps) {
method render (line 55) | render() {
method componentDidMount (line 80) | componentDidMount() {
method _getExtendedProperties (line 90) | protected _getExtendedProperties(): RN.ExtendedTextProps {
method getChildContext (line 112) | getChildContext() {
method _getStyles (line 119) | protected _getStyles(): Types.StyleRuleSetRecursiveArray<Types.TextSty...
method requestFocus (line 123) | requestFocus() {
method focus (line 131) | focus() {
method blur (line 141) | blur() {
method getSelectedText (line 147) | getSelectedText(): string {
FILE: src/native-common/TextInput.tsx
type TextInputState (line 27) | interface TextInputState {
type TextInputContext (line 32) | interface TextInputContext {
type Selection (line 36) | interface Selection {
class TextInput (line 41) | class TextInput extends React.Component<Types.TextInputProps, TextInputS...
method constructor (line 52) | constructor(props: Types.TextInputProps, context?: TextInputContext) {
method UNSAFE_componentWillReceiveProps (line 61) | UNSAFE_componentWillReceiveProps(nextProps: Types.TextInputProps) {
method componentDidMount (line 69) | componentDidMount() {
method _render (line 75) | protected _render(props: RN.TextInputProps, onMount: (textInput: RN.Te...
method render (line 81) | render() {
method blur (line 201) | blur() {
method requestFocus (line 207) | requestFocus() {
method focus (line 215) | focus() {
method setAccessibilityFocus (line 221) | setAccessibilityFocus() {
method isFocused (line 227) | isFocused() {
method selectAll (line 231) | selectAll() {
method selectRange (line 237) | selectRange(start: number, end: number) {
method getSelectionRange (line 246) | getSelectionRange(): { start: number; end: number } {
method setValue (line 250) | setValue(value: string): void {
FILE: src/native-common/UserInterface.tsx
class UserInterface (line 21) | class UserInterface extends RX.UserInterface {
method constructor (line 27) | constructor() {
method measureLayoutRelativeToWindow (line 36) | measureLayoutRelativeToWindow(component: React.Component<any, any>): P...
method measureLayoutRelativeToAncestor (line 56) | measureLayoutRelativeToAncestor(component: React.Component<any, any>,
method measureWindow (line 80) | measureWindow(rootViewId?: string): RX.Types.LayoutInfo {
method getContentSizeMultiplier (line 101) | getContentSizeMultiplier(): Promise<number> {
method useCustomScrollbars (line 115) | useCustomScrollbars(enable = true) {
method dismissKeyboard (line 119) | dismissKeyboard() {
method isHighPixelDensityScreen (line 126) | isHighPixelDensityScreen() {
method getPixelRatio (line 132) | getPixelRatio(): number {
method setMainView (line 136) | setMainView(element: React.ReactElement<any>) {
method registerRootViewUsingPropsFactory (line 140) | registerRootViewUsingPropsFactory(factory: RN.ComponentProvider) {
method registerRootView (line 144) | registerRootView(viewKey: string, getComponentFunc: Function) {
method renderMainView (line 164) | renderMainView() {
method enableTouchLatencyEvents (line 168) | enableTouchLatencyEvents(latencyThresholdMs: number): void {
method evaluateTouchLatency (line 172) | evaluateTouchLatency(e: RX.Types.SyntheticEvent) {
method isNavigatingWithKeyboard (line 181) | isNavigatingWithKeyboard(): boolean {
method notifyRootViewInstanceCreated (line 189) | notifyRootViewInstanceCreated(rootViewId: string, nodeHandle: number):...
method notifyRootViewInstanceDestroyed (line 200) | notifyRootViewInstanceDestroyed(rootViewId: string): void {
method findNodeHandleByRootViewId (line 204) | findNodeHandleByRootViewId(rootViewId: string): number | undefined {
FILE: src/native-common/UserPresence.ts
class UserPresence (line 13) | class UserPresence extends RX.UserPresence {
method isUserPresent (line 16) | isUserPresent(): boolean {
FILE: src/native-common/View.tsx
function noop (line 43) | function noop() { /* noop */ }
function applyMixin (line 45) | function applyMixin(thisObj: any, mixin: {[propertyName: string]: any}, ...
function removeMixin (line 57) | function removeMixin(thisObj: any, mixin: {[propertyName: string]: any},...
type ChildKey (line 69) | type ChildKey = string | number;
function extractChildrenKeys (line 70) | function extractChildrenKeys(children: React.ReactNode): ChildKey[] {
function findInvalidRefs (line 87) | function findInvalidRefs(children: React.ReactNode) {
function _childrenEdited (line 102) | function _childrenEdited(prevChildrenKeys: ChildKey[], nextChildrenKeys:...
type ViewContext (line 128) | interface ViewContext {
class View (line 132) | class View extends ViewBase<RX.Types.ViewProps, RX.Types.Stateless, RN.V...
method constructor (line 168) | constructor(props: RX.Types.ViewProps, context?: ViewContext) {
method UNSAFE_componentWillReceiveProps (line 178) | UNSAFE_componentWillReceiveProps(nextProps: RX.Types.ViewProps) {
method UNSAFE_componentWillUpdate (line 187) | UNSAFE_componentWillUpdate(nextProps: RX.Types.ViewProps, nextState: {...
method componentDidMount (line 246) | componentDidMount() {
method componentWillUnmount (line 257) | componentWillUnmount() {
method _updateMixin (line 264) | private _updateMixin(props: RX.Types.ViewProps, initial: boolean) {
method getChildContext (line 312) | getChildContext() {
method _buildInternalProps (line 327) | protected _buildInternalProps(props: RX.Types.ViewProps) {
method _isTouchFeedbackApplicable (line 415) | private _isTouchFeedbackApplicable() {
method _opacityActive (line 419) | private _opacityActive(duration: number) {
method _opacityInactive (line 423) | private _opacityInactive(duration: number) {
method _getDefaultOpacityValue (line 427) | private _getDefaultOpacityValue(props: RX.Types.ViewProps): number {
method _setOpacityTo (line 436) | private _setOpacityTo(value: number, duration: number) {
method _showUnderlay (line 447) | private _showUnderlay() {
method _isButton (line 471) | protected _isButton(viewProps: RX.Types.ViewProps): boolean {
method _updateFocusArbitratorProvider (line 475) | private _updateFocusArbitratorProvider(props: RX.Types.ViewProps) {
method render (line 487) | render() {
method touchableHandlePress (line 503) | touchableHandlePress(e: RX.Types.SyntheticEvent): void {
method touchableHandleLongPress (line 516) | touchableHandleLongPress(e: RX.Types.SyntheticEvent): void {
method touchableHandleActivePressIn (line 524) | touchableHandleActivePressIn(e: RX.Types.SyntheticEvent): void {
method touchableHandleActivePressOut (line 541) | touchableHandleActivePressOut(e: RX.Types.SyntheticEvent): void {
method touchableGetHighlightDelayMS (line 556) | touchableGetHighlightDelayMS(): number {
method touchableGetPressRectOffset (line 560) | touchableGetPressRectOffset() {
method setFocusRestricted (line 564) | setFocusRestricted(restricted: boolean) {
method setFocusLimited (line 568) | setFocusLimited(limited: boolean) {
method blur (line 572) | blur() {
method requestFocus (line 578) | requestFocus() {
method focus (line 586) | focus() {
FILE: src/native-common/ViewBase.tsx
method setDefaultViewStyle (line 30) | static setDefaultViewStyle(defaultViewStyle: RX.Types.ViewStyleRuleSet) {
method getDefaultViewStyle (line 34) | static getDefaultViewStyle() {
method setNativeProps (line 39) | setNativeProps(nativeProps: RN.ViewProps) {
method _getStyles (line 51) | protected _getStyles(props: RX.Types.ViewProps) {
FILE: src/native-common/utils/EventHelpers.ts
class EventHelpers (line 16) | class EventHelpers {
method toKeyboardEvent (line 17) | toKeyboardEvent(e: Types.SyntheticEvent): Types.KeyboardEvent {
method toFocusEvent (line 274) | toFocusEvent(e: Types.SyntheticEvent): Types.FocusEvent {
method toMouseEvent (line 281) | toMouseEvent(e: Types.SyntheticEvent): Types.MouseEvent {
method toDragEvent (line 330) | toDragEvent(e: Types.SyntheticEvent): Types.DragEvent {
method isRightMouseButton (line 336) | isRightMouseButton(e: Types.SyntheticEvent): boolean {
method keyboardToMouseEvent (line 343) | keyboardToMouseEvent(e: Types.KeyboardEvent, layoutInfo: Types.LayoutI...
FILE: src/native-desktop/App.ts
class App (line 16) | class App extends AppCommon {
method getRootViewFactory (line 18) | protected getRootViewFactory(): ComponentProvider {
method getRootViewUsingPropsFactory (line 22) | protected getRootViewUsingPropsFactory(): ComponentProvider {
FILE: src/native-desktop/Input.ts
class Input (line 13) | class Input extends InputCommon {
method constructor (line 14) | constructor() {
method dispatchKeyDown (line 18) | dispatchKeyDown(e: Types.KeyboardEvent): void {
method dispatchKeyUp (line 22) | dispatchKeyUp(e: Types.KeyboardEvent): void {
FILE: src/native-desktop/RootView.tsx
constant KEY_CODE_TAB (line 30) | const KEY_CODE_TAB = 9;
constant KEY_CODE_ESC (line 31) | const KEY_CODE_ESC = 27;
type Constructor (line 46) | type Constructor<T extends React.Component> = new (...args: any[]) => T;
function applyDesktopBehaviorMixin (line 48) | function applyDesktopBehaviorMixin<TRootViewBase extends Constructor<Rea...
FILE: src/native-desktop/ScrollView.tsx
type ScrollViewProps (line 16) | type ScrollViewProps = RN.ScrollViewProps & React.Props<RN.ScrollView>;
class ScrollView (line 20) | class ScrollView extends ScrollViewBase {
method _render (line 21) | protected _render(nativeProps: ScrollViewProps): JSX.Element {
FILE: src/native-desktop/utils/FocusManager.ts
type OverrideType (line 27) | enum OverrideType {
type StoredFocusableComponent (line 36) | interface StoredFocusableComponent extends StoredFocusableComponentBase {
type FocusManagerFocusableComponent (line 40) | interface FocusManagerFocusableComponent {
type FocusableComponentInternal (line 48) | interface FocusableComponentInternal extends FocusManagerFocusableCompon...
class FocusManager (line 56) | class FocusManager extends FocusManagerBase {
method constructor (line 58) | constructor(parent: FocusManager | undefined) {
method addFocusListenerOnComponent (line 62) | protected /* static */ addFocusListenerOnComponent(component: Focusabl...
method removeFocusListenerFromComponent (line 67) | protected /* static */ removeFocusListenerFromComponent(component: Foc...
method focusComponent (line 71) | protected /* static */ focusComponent(component: FocusableComponentInt...
method _focusFirst (line 79) | private static _focusFirst(): void {
method resetFocus (line 115) | protected /* static */ resetFocus(focusFirstWhenNavigatingWithKeyboard...
method _updateComponentFocusRestriction (line 147) | protected /* static */ _updateComponentFocusRestriction(storedComponen...
method _updateComponentTabIndexAndIFAOverrides (line 173) | private static _updateComponentTabIndexAndIFAOverrides(component: Focu...
function updateNativeAccessibilityProps (line 193) | function updateNativeAccessibilityProps(component: FocusableComponentInt...
function applyFocusableComponentMixin (line 204) | function applyFocusableComponentMixin(Component: any, isConditionallyFoc...
FILE: src/tslint/groupedImportRule.ts
constant FAILURE_STRING_PART (line 18) | const FAILURE_STRING_PART = 'Ambient and relative imports must be separa...
class Rule (line 20) | class Rule extends Rules.AbstractRule {
method apply (line 21) | apply(sourceFile: ts.SourceFile): RuleFailure[] {
type ImportType (line 28) | enum ImportType {
class GroupedImportModuleWalker (line 34) | class GroupedImportModuleWalker extends RuleWalker {
method visitNode (line 38) | visitNode(node: ts.Node): void {
method _checkImportType (line 63) | private _checkImportType(node: ts.ImportEqualsDeclaration | ts.ImportD...
FILE: src/tslint/incorrectThisPropsRule.ts
constant THIS_PROPS_REFERENCED (line 19) | const THIS_PROPS_REFERENCED = '"this.props" referenced within method tha...
constant THIS_PROPS (line 22) | const THIS_PROPS = 'this.props';
constant ALLOWED_OLD_PROPS (line 23) | const ALLOWED_OLD_PROPS = 'oldProps = ' + THIS_PROPS;
class Rule (line 25) | class Rule extends Rules.AbstractRule {
method apply (line 26) | apply(sourceFile: ts.SourceFile): RuleFailure[] {
class ThisPropsWalker (line 33) | class ThisPropsWalker extends RuleWalker {
method walk (line 34) | walk(node: ts.Node): void {
method visitMethodDeclaration (line 38) | visitMethodDeclaration(node: ts.MethodDeclaration): void {
FILE: src/tslint/noUnreferencedStylesRule.ts
constant STYLES_NOT_CONST (line 18) | const STYLES_NOT_CONST = 'Styles array is not marked const';
constant STYLE_NOT_REFERENCED (line 19) | const STYLE_NOT_REFERENCED = 'Unreferenced style ';
class Rule (line 21) | class Rule extends Rules.AbstractRule {
method apply (line 22) | apply(sourceFile: ts.SourceFile): RuleFailure[] {
type StyleInfo (line 29) | interface StyleInfo {
class StylesWalker (line 35) | class StylesWalker extends RuleWalker {
method walk (line 38) | walk(node: ts.Node): void {
method visitVariableDeclaration (line 44) | visitVariableDeclaration(node: ts.VariableDeclaration): void {
method _addKnownStyles (line 59) | private _addKnownStyles(node: ts.Node, prefix: string): boolean {
method visitFunctionDeclaration (line 96) | visitFunctionDeclaration(node: ts.FunctionDeclaration): void {
method visitConstructorDeclaration (line 100) | visitConstructorDeclaration(node: ts.ConstructorDeclaration): void {
method visitMethodDeclaration (line 104) | visitMethodDeclaration(node: ts.MethodDeclaration): void {
method visitArrowFunction (line 108) | visitArrowFunction(node: ts.FunctionLikeDeclaration): void {
method visitPropertyDeclaration (line 112) | visitPropertyDeclaration(node: ts.PropertyDeclaration): void {
method _markReferencedStyles (line 116) | private _markReferencedStyles(functionText: string): void {
method _reportUnreferencedStyles (line 130) | private _reportUnreferencedStyles(): void {
FILE: src/typings/prop-types.d.ts
type Validator (line 8) | type Validator<T> = (object: T, key: string, componentName: string, ...r...
type Requireable (line 12) | interface Requireable<T> {
type ValidationMap (line 16) | type ValidationMap<T> = {[K in keyof T]?: Validator<T> };
FILE: src/typings/react-native-extensions.d.ts
type ExtendedViewProps (line 15) | interface ExtendedViewProps extends RN.ViewProps {
type ExtendedTextProps (line 25) | interface ExtendedTextProps extends RN.TextProps, RNW.TextWindowsProps {
type ExtendedTextInputProps (line 30) | interface ExtendedTextInputProps extends RN.TextInputProps {
type ExtendedDesktopScrollViewProps (line 35) | interface ExtendedDesktopScrollViewProps extends RN.ScrollViewProps, Rea...
type ExtendedImageProps (line 42) | interface ExtendedImageProps extends RN.ImageProps {
type RtlEventNativePayload (line 46) | interface RtlEventNativePayload {
type RectOffset (line 66) | interface RectOffset {
type State (line 73) | interface State {
type TouchableMixin (line 77) | interface TouchableMixin extends React.Mixin<any, any> {
type ExtendedAccessibilityInfoStatic (line 96) | interface ExtendedAccessibilityInfoStatic extends RN.AccessibilityInfoSt...
type ExtendedAlertOptions (line 100) | interface ExtendedAlertOptions extends RN.AlertOptions {
type EventMapping (line 105) | type EventMapping = { [key: string]: Mapping } | AnimatedValue;
type ValueListenerCallback (line 106) | type ValueListenerCallback = (state: { value: number }) => void;
type AnimatedEventConfig (line 107) | interface AnimatedEventConfig<T> {
FILE: src/typings/react-native-windows.d.ts
type TextWindowsSelectionChangeEventData (line 15) | interface TextWindowsSelectionChangeEventData {
type TextWindowsProps (line 19) | interface TextWindowsProps {
type AccessibilityEvents (line 24) | interface AccessibilityEvents {
type ViewProps (line 28) | interface ViewProps {
type FocusableWindowsProps (line 35) | type FocusableWindowsProps<P = {}> = P & {
type FocusableWindows (line 50) | interface FocusableWindows<P> extends RN.ReactNativeBaseComponent<Focusa...
type FocusableComponentConstructor (line 55) | type FocusableComponentConstructor<P> = new() => FocusableWindows<P>;
type HyperlinkWindowsProps (line 59) | type HyperlinkWindowsProps = RN.TextProps & {
class HyperlinkWindows (line 64) | class HyperlinkWindows extends RN.ReactNativeBaseComponent<HyperlinkWind...
type RootInputViewWindowsProps (line 69) | type RootInputViewWindowsProps = RN.ViewProps & {
class RootInputViewWindows (line 75) | class RootInputViewWindows extends RN.ReactNativeBaseComponent<RootInput...
FILE: src/typings/rebound.d.ts
class SpringSystem (line 2) | class SpringSystem {
FILE: src/typings/window.d.ts
type Window (line 2) | interface Window {
FILE: src/web/Accessibility.ts
class Accessibility (line 13) | class Accessibility extends CommonAccessibility {
method isScreenReaderEnabled (line 15) | isScreenReaderEnabled(): boolean {
FILE: src/web/AccessibilityAnnouncer.tsx
type AccessibilityAnnouncerState (line 20) | interface AccessibilityAnnouncerState {
class AccessibilityAnnouncer (line 45) | class AccessibilityAnnouncer extends React.Component<{}, AccessibilityAn...
method constructor (line 49) | constructor(props: {}) {
method _getInitialState (line 84) | private _getInitialState(): AccessibilityAnnouncerState {
method componentDidUpdate (line 91) | componentDidUpdate(prevProps: {}, prevState: AccessibilityAnnouncerSta...
method componentWillUnmount (line 99) | componentWillUnmount() {
method render (line 106) | render() {
method _cancelClearAnnouncementTimer (line 123) | private _cancelClearAnnouncementTimer() {
method _startClearAnnouncementTimer (line 130) | private _startClearAnnouncementTimer() {
FILE: src/web/AccessibilityUtil.ts
class AccessibilityUtil (line 51) | class AccessibilityUtil extends CommonAccessibiltiyUtil {
method accessibilityLiveRegionToString (line 53) | accessibilityLiveRegionToString(liveRegion: Types.AccessibilityLiveReg...
method accessibilityTraitToString (line 62) | accessibilityTraitToString(traits: Types.AccessibilityTrait | Types.Ac...
method accessibilityTraitToAriaSelected (line 78) | accessibilityTraitToAriaSelected(traits: Types.AccessibilityTrait | Ty...
method accessibilityTraitToAriaChecked (line 89) | accessibilityTraitToAriaChecked(traits: Types.AccessibilityTrait | Typ...
method accessibilityTraitToAriaHasPopup (line 100) | accessibilityTraitToAriaHasPopup(traits: Types.AccessibilityTrait | Ty...
FILE: src/web/ActivityIndicator.tsx
type ActivityIndicatorState (line 622) | interface ActivityIndicatorState {
class ActivityIndicator (line 626) | class ActivityIndicator extends React.Component<Types.ActivityIndicatorP...
method _installStyleSheet (line 630) | private static _installStyleSheet() {
method constructor (line 653) | constructor(props: Types.ActivityIndicatorProps) {
method componentDidMount (line 661) | componentDidMount() {
method componentWillUnmount (line 675) | componentWillUnmount() {
method render (line 679) | render() {
FILE: src/web/Alert.tsx
class Alert (line 18) | class Alert extends RX.Alert {
method show (line 21) | show(title: string, message?: string, buttons?: RX.Types.AlertButtonSp...
FILE: src/web/AlertModalContent.tsx
type AppModalContentProps (line 20) | interface AppModalContentProps extends RX.Types.ViewProps {
type AppModalContentState (line 29) | interface AppModalContentState {
class AlertModalContent (line 94) | class AlertModalContent extends RX.Component<AppModalContentProps, AppMo...
method constructor (line 95) | constructor(props: AppModalContentProps) {
method render (line 102) | render() {
method _onPressButton (line 168) | private _onPressButton(btnSpec: RX.Types.AlertButtonSpec) {
FILE: src/web/Animated.tsx
type ValueListener (line 74) | interface ValueListener {
class Value (line 82) | class Value extends RX.Types.AnimatedValue {
method constructor (line 87) | constructor(value: number) {
method _getInputValue (line 94) | _getInputValue(): number | string {
method _getOutputValue (line 98) | _getOutputValue(): number | string {
method _getInterpolatedValue (line 102) | _getInterpolatedValue(inputVal: number | string): number | string {
method _isInterpolated (line 106) | _isInterpolated(): boolean {
method interpolate (line 110) | interpolate(config: RX.Types.Animated.InterpolationConfigType) {
method setValue (line 115) | setValue(value: number | string): void {
method _addListener (line 131) | _addListener(listenerToAdd: ValueListener): void {
method _removeListener (line 138) | _removeListener(listenerToRemove: ValueListener): void {
method _removeAllListeners (line 143) | _removeAllListeners(): void {
method _startTransition (line 148) | _startTransition(toValue: number | string, duration: number, easing: s...
method _stopTransition (line 182) | _stopTransition() {
method _updateFinalValue (line 193) | _updateFinalValue(value: number | string) {
class InterpolatedValue (line 198) | class InterpolatedValue extends Value {
method constructor (line 200) | constructor(private _config: RX.Types.Animated.InterpolationConfigType...
method _startTransition (line 230) | _startTransition(toValue: number | string, duration: number, easing: s...
method _convertValueToNumeric (line 245) | _convertValueToNumeric(inputVal: number | string): number {
method _addUnitsToNumericValue (line 253) | _addUnitsToNumericValue(value: number, templateValue: number | string)...
method _getInterpolatedValue (line 270) | _getInterpolatedValue(inputVal: number | string): number | string {
method _isInterpolated (line 301) | _isInterpolated(): boolean {
type ExtendedTransition (line 443) | interface ExtendedTransition extends TransitionSpec {
type AnimatedAttribute (line 448) | interface AnimatedAttribute {
type AnimatedValueMap (line 453) | interface AnimatedValueMap {
function createAnimatedComponent (line 458) | function createAnimatedComponent<PropsType extends RX.Types.CommonProps<...
type Image (line 918) | type Image = RX.AnimatedImage;
type Text (line 919) | type Text = RX.AnimatedText;
type TextInput (line 920) | type TextInput = RX.AnimatedTextInput;
type View (line 921) | type View = RX.AnimatedView;
FILE: src/web/App.ts
class App (line 14) | class App extends RX.App {
method constructor (line 17) | constructor() {
method initialize (line 37) | initialize(debug: boolean, development: boolean): void {
method getActivationState (line 41) | getActivationState(): RX.Types.AppActivationState {
FILE: src/web/Button.tsx
type ButtonContext (line 44) | interface ButtonContext {
class Button (line 49) | class Button extends ButtonBase {
method constructor (line 70) | constructor(props: Types.ButtonProps, context?: ButtonContext) {
method getChildContext (line 80) | getChildContext(): ButtonContext {
method render (line 84) | render() {
method componentDidMount (line 128) | componentDidMount() {
method requestFocus (line 134) | requestFocus() {
method focus (line 142) | focus() {
method blur (line 148) | blur() {
method _getStyles (line 167) | private _getStyles(): Types.ButtonStyleRuleSet {
FILE: src/web/Clipboard.ts
class Clipboard (line 12) | class Clipboard extends RX.Clipboard {
method setText (line 13) | setText(text: string): void {
method getText (line 22) | getText(): Promise<string> {
method _createInvisibleNode (line 28) | private static _createInvisibleNode(): HTMLTextAreaElement {
method _copyNode (line 44) | private static _copyNode(node: HTMLTextAreaElement): void {
FILE: src/web/CustomScrollbar.ts
constant UNIT (line 15) | const UNIT = 'px';
constant SCROLLER_MIN_SIZE (line 16) | const SCROLLER_MIN_SIZE = 15;
constant SCROLLER_NEGATIVE_MARGIN (line 17) | const SCROLLER_NEGATIVE_MARGIN = 30;
constant NEUTRAL_OVERRIDE_CLASS (line 18) | const NEUTRAL_OVERRIDE_CLASS = 'neutraloverride';
type ScrollbarInfo (line 20) | interface ScrollbarInfo {
type ScrollbarOptions (line 31) | interface ScrollbarOptions {
class Scrollbar (line 160) | class Scrollbar {
method getNativeScrollbarWidth (line 181) | static getNativeScrollbarWidth(): number {
method _installStyleSheet (line 217) | private static _installStyleSheet(): void {
method constructor (line 240) | constructor(container: HTMLElement) {
method _tryLtrOverride (line 246) | private _tryLtrOverride(): void {
method _prevent (line 267) | private _prevent(e: React.SyntheticEvent<any>): void {
method _updateSliders (line 271) | private _updateSliders(): void {
method _handleDrag (line 289) | private _handleDrag(e: React.MouseEvent<any>): void {
method _startDrag (line 297) | private _startDrag(dragIsVertical: boolean, e: React.MouseEvent<any>):...
method _stopDrag (line 314) | private _stopDrag(): void {
method _handleWheel (line 321) | private _handleWheel(e: React.WheelEvent<any>): void {
method _handleMouseDown (line 330) | private _handleMouseDown(e: React.MouseEvent<HTMLElement>): void {
method _normalizeDelta (line 353) | private _normalizeDelta(e: React.WheelEvent<any>): number {
method _addListeners (line 364) | private _addListeners(): void {
method _removeListeners (line 378) | private _removeListeners(): void {
method _createDivWithClass (line 392) | private _createDivWithClass(className: string): HTMLElement {
method _addScrollBar (line 399) | private _addScrollBar(scrollbarInfo: ScrollbarInfo, railClass: string,...
method _addScrollbars (line 409) | private _addScrollbars(): void {
method _removeScrollbars (line 425) | private _removeScrollbars(): void {
method _calcNewBarSize (line 437) | private _calcNewBarSize(bar: ScrollbarInfo, newSize: number, newScroll...
method _resize (line 464) | private _resize(): void {
method update (line 474) | update(): void {
method show (line 488) | show(): void {
method hide (line 496) | hide(): void {
method init (line 504) | init(options?: ScrollbarOptions): void {
method dispose (line 530) | dispose(): void {
FILE: src/web/FrontLayerViewManager.tsx
constant MAX_CACHED_POPUPS (line 19) | const MAX_CACHED_POPUPS = 4;
class FrontLayerViewManager (line 21) | class FrontLayerViewManager {
method setMainView (line 40) | setMainView(element: React.ReactElement<any>): void {
method isModalDisplayed (line 45) | isModalDisplayed(modalId?: string): boolean {
method showModal (line 53) | showModal(modal: React.ReactElement<Types.ViewProps>, modalId: string,...
method dismissModal (line 63) | dismissModal(modalId: string) {
method dismissAllModals (line 68) | dismissAllModals() {
method _updateModalDisplayedState (line 80) | private _updateModalDisplayedState() {
method showPopup (line 84) | showPopup(options: Types.PopupOptions, popupId: string, showDelay?: nu...
method _showPopup (line 100) | private _showPopup(options: Types.PopupOptions, popupId: string, showD...
method autoDismissPopup (line 138) | autoDismissPopup(popupId: string, dismissDelay?: number): void {
method dismissPopup (line 151) | dismissPopup(popupId: string): void {
method dismissAllPopups (line 177) | dismissAllPopups() {
method _renderRootView (line 183) | private _renderRootView() {
method isPopupDisplayed (line 211) | isPopupDisplayed(popupId?: string): boolean {
method allowRTL (line 219) | allowRTL(allow: boolean) {
method forceRTL (line 226) | forceRTL(force: boolean) {
method isRTL (line 233) | isRTL(): boolean {
FILE: src/web/GestureView.tsx
type GestureViewContext (line 41) | interface GestureViewContext {
type Point2D (line 47) | interface Point2D {
method _getPreferredPanRatio (line 71) | protected _getPreferredPanRatio(): number {
method _getEventTimestamp (line 76) | protected _getEventTimestamp(e: Types.TouchEvent | Types.MouseEvent): nu...
method componentDidMount (line 80) | componentDidMount() {
method componentWillUnmount (line 84) | componentWillUnmount() {
method render (line 90) | render() {
method blur (line 119) | blur() {
method focus (line 126) | focus() {
method _getContainer (line 133) | protected _getContainer(): HTMLElement | null {
method _createMouseResponder (line 145) | private _createMouseResponder(container: HTMLElement) {
method _disposeMouseResponder (line 191) | private _disposeMouseResponder() {
method _getStyles (line 209) | private _getStyles(): any {
method _reactTouchEventToBasic (line 308) | private static _reactTouchEventToBasic(e: React.TouchEvent<any>): TouchE...
method _mapReactTouchListToBasic (line 324) | private static _mapReactTouchListToBasic(l: React.TouchList): TouchListB...
method _mapReactTouchToRx (line 332) | private static _mapReactTouchToRx(l: React.Touch): Types.Touch {
method _getClientXYOffset (line 459) | protected _getClientXYOffset(): { x: number; y: number } {
method _getGestureViewClientRect (line 464) | private _getGestureViewClientRect() {
FILE: src/web/Image.tsx
type ImageState (line 39) | interface ImageState {
type ImageContext (line 45) | interface ImageContext {
type XhrBlobUrlCacheEntry (line 49) | interface XhrBlobUrlCacheEntry {
class XhrBlobUrlCache (line 55) | class XhrBlobUrlCache {
method get (line 61) | static get(source: string): string | undefined {
method insert (line 71) | static insert(source: string, xhrBlobUrl: string) {
method release (line 87) | static release(source: string) {
method _cleanupIfCapacityExceeded (line 95) | private static _cleanupIfCapacityExceeded() {
class Image (line 118) | class Image extends React.Component<Types.ImageProps, ImageState> {
method getChildContext (line 132) | getChildContext() {
method prefetch (line 139) | static prefetch(url: string): Promise<boolean> {
method getMetadata (line 160) | static getMetadata(url: string): Promise<Types.ImageMetadata> {
method constructor (line 188) | constructor(props: Types.ImageProps) {
method UNSAFE_componentWillReceiveProps (line 198) | UNSAFE_componentWillReceiveProps(nextProps: Types.ImageProps) {
method componentDidMount (line 211) | componentDidMount() {
method componentWillUnmount (line 215) | componentWillUnmount() {
method _initializeAndSetState (line 222) | private _initializeAndSetState(props: Types.ImageProps, initial: boole...
method _handleXhrBlob (line 251) | private _handleXhrBlob(blob: Blob) {
method _startXhrImageFetch (line 269) | private _startXhrImageFetch(props: Types.ImageProps) {
method _actuallyStartXhrImageFetch (line 275) | private _actuallyStartXhrImageFetch(props: Types.ImageProps) {
method render (line 340) | render() {
method _getStyles (line 382) | private _getStyles(): React.CSSProperties {
method _buildBackgroundSize (line 408) | private _buildBackgroundSize(resizeMode: Types.ImageResizeMode = DEFAU...
method _onError (line 457) | private _onError(err?: Error) {
method getNativeWidth (line 485) | getNativeWidth(): number | undefined {
method getNativeHeight (line 489) | getNativeHeight(): number | undefined {
FILE: src/web/Input.ts
class Input (line 12) | class Input extends RX.Input {
method dispatchKeyDown (line 13) | dispatchKeyDown(e: RX.Types.KeyboardEvent): void {
method dispatchKeyUp (line 17) | dispatchKeyUp(e: RX.Types.KeyboardEvent): void {
FILE: src/web/International.ts
class International (line 14) | class International implements RX.International {
method allowRTL (line 15) | allowRTL(allow: boolean): void {
method forceRTL (line 19) | forceRTL(force: boolean): void {
method isRTL (line 23) | isRTL(): boolean {
FILE: src/web/Link.tsx
type LinkContext (line 46) | interface LinkContext {
class Link (line 50) | class Link extends React.Component<Types.LinkProps, Types.Stateless> {
method render (line 60) | render() {
method componentDidMount (line 87) | componentDidMount() {
method requestFocus (line 93) | requestFocus() {
method focus (line 101) | focus() {
method blur (line 107) | blur() {
method _getStyles (line 117) | private _getStyles(): React.CSSProperties {
FILE: src/web/Linking.ts
class Linking (line 13) | class Linking extends CommonLinking {
method _openUrl (line 14) | protected _openUrl(url: string): Promise<void> {
method launchEmail (line 40) | launchEmail(emailInfo: Types.EmailInfo): Promise<void> {
method getInitialUrl (line 48) | getInitialUrl(): Promise<string | undefined> {
FILE: src/web/Modal.ts
class Modal (line 17) | class Modal extends RX.Modal {
method isDisplayed (line 18) | isDisplayed(modalId?: string): boolean {
method show (line 22) | show(modal: React.ReactElement<RX.Types.ViewProps>, modalId: string, o...
method dismiss (line 29) | dismiss(modalId: string): void {
method dismissAll (line 35) | dismissAll(): void {
FILE: src/web/ModalContainer.tsx
class ModalContainer (line 32) | class ModalContainer extends React.Component<Types.CommonProps<ModalCont...
method constructor (line 33) | constructor(props: Types.CommonProps<ModalContainer>) {
method render (line 37) | render() {
FILE: src/web/Picker.tsx
class Picker (line 17) | class Picker extends RX.Picker {
method render (line 18) | render() {
method _getStyles (line 31) | private _getStyles(): RX.Types.PickerStyleRuleSet {
FILE: src/web/Platform.ts
class Platform (line 12) | class Platform extends RX.Platform {
method getType (line 13) | getType(): RX.Types.PlatformType {
method select (line 17) | select<T>(specifics: { [ platform in RX.Types.PlatformType | 'default'...
FILE: src/web/Popup.ts
class Popup (line 15) | class Popup extends RX.Popup {
method show (line 16) | show(options: RX.Types.PopupOptions, popupId: string, delay?: number):...
method autoDismiss (line 22) | autoDismiss(popupId: string, delay?: number): void {
method dismiss (line 28) | dismiss(popupId: string): void {
method dismissAll (line 34) | dismissAll(): void {
method isDisplayed (line 38) | isDisplayed(popupId?: string): boolean {
FILE: src/web/PopupContainerView.tsx
type PopupContainerViewProps (line 17) | interface PopupContainerViewProps extends PopupContainerViewBaseProps<Po...
class PopupContainerView (line 23) | class PopupContainerView extends PopupContainerViewBase<PopupContainerVi...
method constructor (line 24) | constructor(props: PopupContainerViewProps, context?: PopupContainerVi...
method render (line 28) | render() {
FILE: src/web/ReactXP.ts
type Accessibility (line 56) | type Accessibility = RXInterfaces.Accessibility;
type ActivityIndicator (line 58) | type ActivityIndicator = RXInterfaces.ActivityIndicator;
type Alert (line 60) | type Alert = RXInterfaces.Alert;
type App (line 62) | type App = RXInterfaces.App;
type Button (line 64) | type Button = RXInterfaces.Button;
type Picker (line 66) | type Picker = RXInterfaces.Picker;
type Clipboard (line 68) | type Clipboard = RXInterfaces.Clipboard;
type GestureView (line 70) | type GestureView = RXInterfaces.GestureView;
type Image (line 72) | type Image = RXInterfaces.Image;
type Input (line 74) | type Input = RXInterfaces.Input;
type International (line 76) | type International = RXInterfaces.International;
type Link (line 78) | type Link = RXInterfaces.Link;
type Linking (line 80) | type Linking = RXInterfaces.Linking;
type Location (line 82) | type Location = RXInterfaces.Location;
type Modal (line 84) | type Modal = RXInterfaces.Modal;
type Platform (line 86) | type Platform = RXInterfaces.Platform;
type Popup (line 88) | type Popup = RXInterfaces.Popup;
type ScrollView (line 90) | type ScrollView = RXInterfaces.ScrollView;
type StatusBar (line 92) | type StatusBar = RXInterfaces.StatusBar;
type Storage (line 94) | type Storage = RXInterfaces.Storage;
type Styles (line 96) | type Styles = RXInterfaces.Styles;
type Text (line 98) | type Text = RXInterfaces.Text;
type TextInput (line 100) | type TextInput = RXInterfaces.TextInput;
type UserInterface (line 102) | type UserInterface = RXInterfaces.UserInterface;
type UserPresence (line 104) | type UserPresence = RXInterfaces.UserPresence;
type View (line 106) | type View = RXInterfaces.View;
FILE: src/web/RootView.tsx
class PopupDescriptor (line 28) | class PopupDescriptor {
method constructor (line 29) | constructor(public popupId: string, public popupOptions: Types.PopupOp...
type RootViewProps (line 32) | interface RootViewProps extends Types.CommonProps<RootView> {
type RootViewState (line 45) | interface RootViewState extends RecalcResult {
constant KEY_CODE_TAB (line 60) | const KEY_CODE_TAB = 9;
constant KEY_CODE_ESC (line 61) | const KEY_CODE_ESC = 27;
type MainViewContext (line 72) | interface MainViewContext {
class MainViewContainer (line 79) | class MainViewContainer extends React.Component<Types.CommonProps<MainVi...
method getChildContext (line 86) | getChildContext(): MainViewContext {
method render (line 92) | render() {
class RootView (line 99) | class RootView extends React.Component<RootViewProps, RootViewState> {
method constructor (line 118) | constructor(props: RootViewProps) {
method getChildContext (line 128) | getChildContext() {
method _getInitialState (line 135) | private _getInitialState(): RootViewState {
method UNSAFE_componentWillReceiveProps (line 150) | UNSAFE_componentWillReceiveProps(prevProps: RootViewProps) {
method componentDidUpdate (line 159) | componentDidUpdate(prevProps: RootViewProps, prevState: RootViewState) {
method componentDidMount (line 186) | componentDidMount() {
method componentWillUnmount (line 208) | componentWillUnmount() {
method _renderPopup (line 225) | private _renderPopup(popup: PopupDescriptor, hidden: boolean): JSX.Ele...
method render (line 267) | render() {
method _determineIfClickOnElement (line 373) | private _determineIfClickOnElement(elementReference: React.Component<a...
method _requestApplicationIsNotActive (line 468) | private _requestApplicationIsNotActive() {
method _cancelApplicationIsNotActive (line 477) | private _cancelApplicationIsNotActive() {
method _updateKeyboardNavigationState (line 484) | private _updateKeyboardNavigationState(isNavigatingWithKeyboard: boole...
method _onMouseEnter (line 517) | private _onMouseEnter(e: React.MouseEvent<any>) {
method _onMouseLeave (line 521) | private _onMouseLeave(e: React.MouseEvent<any>) {
method _startHidePopupTimer (line 525) | private _startHidePopupTimer() {
method _stopHidePopupTimer (line 539) | private _stopHidePopupTimer() {
method _dismissPopup (line 546) | private _dismissPopup() {
method _startRepositionPopupTimer (line 552) | private _startRepositionPopupTimer() {
method _stopRepositionPopupTimer (line 558) | private _stopRepositionPopupTimer() {
method _recalcPosition (line 567) | private _recalcPosition() {
FILE: src/web/ScrollView.tsx
class ScrollView (line 76) | class ScrollView extends ViewBase<RX.Types.ScrollViewProps, RX.Types.Sta...
method constructor (line 79) | constructor(props: RX.Types.ScrollViewProps) {
method componentDidUpdate (line 119) | componentDidUpdate() {
method render (line 136) | render() {
method UNSAFE_componentWillMount (line 140) | UNSAFE_componentWillMount() {
method componentDidMount (line 144) | componentDidMount() {
method UNSAFE_componentWillReceiveProps (line 151) | UNSAFE_componentWillReceiveProps(newProps: RX.Types.ScrollViewProps) {
method componentWillUnmount (line 156) | componentWillUnmount() {
method _getContainer (line 166) | protected _getContainer(): HTMLElement | null {
method _onPropsChange (line 211) | private _onPropsChange(props: RX.Types.ScrollViewProps) {
method _createCustomScrollbarsIfNeeded (line 219) | private _createCustomScrollbarsIfNeeded(props: RX.Types.ScrollViewProp...
method _getContainerStyle (line 246) | private _getContainerStyle(): RX.Types.ScrollViewStyleRuleSet {
method _renderNormal (line 262) | private _renderNormal() {
method _renderWithCustomScrollbar (line 281) | private _renderWithCustomScrollbar() {
method setScrollTop (line 321) | setScrollTop(scrollTop: number, animate = false): void {
method setScrollLeft (line 350) | setScrollLeft(scrollLeft: number, animate = false): void {
method _easeInOut (line 379) | private _easeInOut(currentTime: number, start: number, change: number,...
FILE: src/web/ScrollViewConfig.ts
class ScrollViewConfig (line 11) | class ScrollViewConfig {
method setUseCustomScrollbars (line 14) | setUseCustomScrollbars(value: boolean): void {
method useCustomScrollbars (line 18) | useCustomScrollbars(): boolean {
FILE: src/web/StatusBar.tsx
class StatusBar (line 12) | class StatusBar extends RX.StatusBar {
method isOverlay (line 13) | isOverlay(): boolean {
method setBarStyle (line 17) | setBarStyle(style: 'default' | 'light-content' | 'dark-content', anima...
method setHidden (line 21) | setHidden(hidden: boolean, showHideTransition: 'fade' | 'slide'): void {
method setNetworkActivityIndicatorVisible (line 25) | setNetworkActivityIndicatorVisible(value: boolean): void {
method setBackgroundColor (line 29) | setBackgroundColor(color: string, animated: boolean): void {
method setTranslucent (line 33) | setTranslucent(translucent: boolean): void {
FILE: src/web/Storage.ts
class Storage (line 12) | class Storage extends RX.Storage {
method getItem (line 13) | getItem(key: string): Promise<string | undefined> {
method setItem (line 18) | setItem(key: string, value: string): Promise<void> {
method removeItem (line 27) | removeItem(key: string): Promise<void> {
method clear (line 32) | clear(): Promise<void> {
FILE: src/web/Styles.ts
type CssAliasMap (line 16) | interface CssAliasMap {
class Styles (line 20) | class Styles extends RX.Styles {
method combine (line 22) | combine<S>(ruleSet1: RX.Types.StyleRuleSetRecursive<S> | undefined, ru...
method createViewStyle (line 97) | createViewStyle(ruleSet: RX.Types.ViewStyle, cacheStyle = true): RX.Ty...
method createAnimatedViewStyle (line 102) | createAnimatedViewStyle(ruleSet: RX.Types.AnimatedViewStyle): RX.Types...
method createScrollViewStyle (line 107) | createScrollViewStyle(ruleSet: RX.Types.ScrollViewStyle, cacheStyle = ...
method createButtonStyle (line 112) | createButtonStyle(ruleSet: RX.Types.ButtonStyle, cacheStyle = true): R...
method createTextStyle (line 117) | createTextStyle(ruleSet: RX.Types.TextStyle, cacheStyle = true): RX.Ty...
method createAnimatedTextStyle (line 122) | createAnimatedTextStyle(ruleSet: RX.Types.AnimatedTextStyle): RX.Types...
method createTextInputStyle (line 127) | createTextInputStyle(ruleSet: RX.Types.TextInputStyle, cacheStyle = tr...
method createAnimatedTextInputStyle (line 132) | createAnimatedTextInputStyle(ruleSet: RX.Types.AnimatedTextInputStyle)...
method createLinkStyle (line 137) | createLinkStyle(ruleSet: RX.Types.LinkStyle, cacheStyle = true): RX.Ty...
method createImageStyle (line 142) | createImageStyle(ruleSet: RX.Types.ImageStyle, cacheStyle = true): RX....
method createAnimatedImageStyle (line 147) | createAnimatedImageStyle(ruleSet: RX.Types.AnimatedImageStyle): RX.Typ...
method createPickerSt
Condensed preview — 790 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (2,735K chars).
[
{
"path": ".eslintrc.json",
"chars": 1679,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {\n \"no"
},
{
"path": ".gitignore",
"chars": 708,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Runtime data\npids\n*.pid\n*.seed\n\n# Directory for instrumented libs generated by jscov"
},
{
"path": ".npmignore",
"chars": 84,
"preview": "/node_modules\n/src/.vs\n/src/bin\n/src/obj\n/samples\n/extensions\n/docs\n*.user\n.eslintrc"
},
{
"path": ".npmrc",
"chars": 0,
"preview": ""
},
{
"path": ".travis.yml",
"chars": 235,
"preview": "language: node_js\n\nnode_js:\n - \"node\"\n\ndist: trusty\n\nsudo: false\n\naddons:\n chrome: stable\n\ninstall:\n - node --version"
},
{
"path": "CONTRIBUTING.md",
"chars": 2368,
"preview": "# Contributing to ReactXP\n\nWe welcome contributions to ReactXP! This gude provides some tips for a successful contributi"
},
{
"path": "LICENSE",
"chars": 1126,
"preview": "ReactXP\r\n\r\nCopyright (c) Microsoft Corporation\r\nAll rights reserved. \r\n\r\nMIT License\r\n\r\nPermission is hereby granted, fr"
},
{
"path": "README.md",
"chars": 4820,
"preview": "# ReactXP\r\n\r\n[](https://github.com"
},
{
"path": "README_Hindi.md",
"chars": 4470,
"preview": "# ReactXP\n\n[](https://github.com/M"
},
{
"path": "SECURITY.md",
"chars": 2757,
"preview": "<!-- BEGIN MICROSOFT SECURITY.MD V0.0.8 BLOCK -->\n\n## Security\n\nMicrosoft takes the security of our software products an"
},
{
"path": "azure-pipelines.yml",
"chars": 421,
"preview": "# Node.js\n# Build a general Node.js project with npm.\n# Add steps that analyze code, save build artifacts, deploy, and m"
},
{
"path": "docs/Gemfile",
"chars": 184,
"preview": "source 'https://rubygems.org'\n\n# jekyll, which builds it all\n# 3.0 includes sass processing\ngem 'jekyll', '~>3.1'\n\n# Jek"
},
{
"path": "docs/_config.yml",
"chars": 755,
"preview": "theme: jekyll-theme-slate\nname: ReactXP\ndescription: A library for building cross-platform apps\nurl: https://microsoft.g"
},
{
"path": "docs/_data/authors.yml",
"chars": 261,
"preview": "# Map of short name to more information. `name` will be used but if you don't\n# want to use your real name, just use wha"
},
{
"path": "docs/_data/nav_docs.yml",
"chars": 2319,
"preview": "- title: Quick Start\n items:\n - id: getting-started\n title: Getting Started\n - id: using-reactxp\n title"
},
{
"path": "docs/_includes/blog_post.html",
"chars": 395,
"preview": "{% assign page = include.page %}\n\n<h1>\n{% if include.isPermalink %}\n {{ page.title }}\n{% else %}\n <a href=\"/reactxp{{ "
},
{
"path": "docs/_includes/footer.html",
"chars": 649,
"preview": "<footer class=\"nav-footer\">\n <section class=\"sitemap\">\n <a href=\"/reactxp/\" class=\"nav-home\">\n </a>\n <div>\n "
},
{
"path": "docs/_includes/hero.html",
"chars": 321,
"preview": "<div class=\"hero\">\n <div class=\"wrap\">\n <div class=\"text\"><strong>ReactXP</strong></div>\n <div class=\"minitext\">\n"
},
{
"path": "docs/_includes/nav_blog.html",
"chars": 385,
"preview": "<div class=\"nav-docs nav-blog\">\n <div class=\"nav-docs-section\">\n <h3>Recent posts</h3>\n <ul>\n {% for post in"
},
{
"path": "docs/_includes/nav_docs.html",
"chars": 465,
"preview": "<div class=\"nav-docs\">\n <!-- Docs Nav -->\n {% for section in site.data.nav_docs %}\n <div class=\"nav-docs-section\">\n"
},
{
"path": "docs/_includes/navigation.html",
"chars": 874,
"preview": "<div class=\"nav-main\">\n <div class=\"wrap\">\n <a class=\"nav-home\" href=\"/reactxp/\">\n ReactXP\n </a>\n <div cl"
},
{
"path": "docs/_layouts/default.html",
"chars": 1342,
"preview": "{% if page.excerpt %}\n{% assign type = 'article' %}\n{% assign sectionTitle = 'ReactXP Blog' %}\n{% assign description = p"
},
{
"path": "docs/_layouts/docs.html",
"chars": 585,
"preview": "---\nlayout: default\nsectionid: docs\n---\n\n<section class=\"content wrap documentationContent\">\n <div class=\"inner-content"
},
{
"path": "docs/_layouts/hero.html",
"chars": 149,
"preview": "---\nlayout: default\n---\n\n{% if page.id == 'home' %}\n {% include hero.html %}\n{% endif %}\n\n<section class=\"content wrap\""
},
{
"path": "docs/_layouts/post.html",
"chars": 243,
"preview": "---\nlayout: default\nsectionid: blog\n---\n\n<section class=\"content wrap blogContent\">\n\n <div class=\"inner-content\">\n {"
},
{
"path": "docs/_plugins/sass.rb",
"chars": 437,
"preview": "module Jekyll\n require 'sass'\n class SassConverter < Converter\n safe true\n priority :low\n\n def matches(ext)\n "
},
{
"path": "docs/_posts/2017-04-06-introducing-reactxp.md",
"chars": 3905,
"preview": "---\ntitle: Introducing ReactXP\nauthor: erictraut\n---\n\nThe Skype team at Microsoft are happy to announce that we are open"
},
{
"path": "docs/_posts/2017-04-27-building-skype-on-reactxp.md",
"chars": 8894,
"preview": "---\ntitle: Building Skype on ReactXP\nauthor: erictraut\n---\n\nReactXP was developed by the Skype team at Microsoft as a wa"
},
{
"path": "docs/_posts/2017-05-24-performance-tuning.md",
"chars": 8925,
"preview": "---\ntitle: Performance Tuning\nauthor: erictraut\n---\n\nPerformance tuning is an important part of any app development effo"
},
{
"path": "docs/_posts/2017-06-29-asset-loading.md",
"chars": 5777,
"preview": "---\ntitle: Asset Loading\nauthor: erictraut\n---\n\nWe've received questions about how we handle assets (images, videos, sou"
},
{
"path": "docs/_sass/_typography.scss",
"chars": 1437,
"preview": "@import 'variables';\n\n$textColor: $mediumColor;\n$textColorLight: lighten($textColor, 20%);\n\nhtml {\n font-family: $helve"
},
{
"path": "docs/_sass/_variables.scss",
"chars": 1485,
"preview": "$primary: #59b941;\n$linkColor: darken($primary, 9%);\n$linkInteract: darken($linkColor, 9%);\n$pageBg: #f9f9f9;\n\n$lightCol"
},
{
"path": "docs/blog/all.html",
"chars": 490,
"preview": "---\ntitle: Blog\nlayout: default\nsectionid: blog\nid: all-posts\n---\n\n<section class=\"content wrap documentationContent nos"
},
{
"path": "docs/blog/index.html",
"chars": 733,
"preview": "---\ntitle: Blog\nlayout: default\nsectionid: blog\n---\n\n<section class=\"content wrap blogContent\">\n {% include nav_blog.ht"
},
{
"path": "docs/community/support.md",
"chars": 674,
"preview": "---\nid: support\ntitle: Where To Get Support\nlayout: hero\nsectionid: community\npermalink: community/support.html\nredirect"
},
{
"path": "docs/css/reactxp.scss",
"chars": 18917,
"preview": "---\ntitle: reactxp.css\n---\n\n@import 'variables';\n@import 'typography';\n\n@mixin code-typography {\n font-family: 'source-"
},
{
"path": "docs/css/syntax.css",
"chars": 4175,
"preview": ".highlight pre code {\n color: #637c84;\n}\n\n.highlight {\n color: #333333;\n background: #f8f5ec;\n}\n\n.highlight .c {\n co"
},
{
"path": "docs/docs/accessibility.md",
"chars": 2522,
"preview": "---\nid: accessibility\ntitle: Accessibility\nlayout: docs\ncategory: Overview\npermalink: docs/accessibility.html\nnext: exte"
},
{
"path": "docs/docs/animations.md",
"chars": 5331,
"preview": "---\nid: animations\ntitle: Animations\nlayout: docs\ncategory: Overview\npermalink: docs/animations.html\nnext: accessibility"
},
{
"path": "docs/docs/apis/accessibility.md",
"chars": 1047,
"preview": "---\nid: apis/accessibility\ntitle: Accessibility\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/accessibility.htm"
},
{
"path": "docs/docs/apis/alert.md",
"chars": 2277,
"preview": "---\nid: apis/alert\ntitle: Alert\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/alert.html\nnext: apis/app\n---\n\nTh"
},
{
"path": "docs/docs/apis/app.md",
"chars": 1580,
"preview": "---\nid: apis/app\ntitle: App\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/app.html\nnext: apis/clipboard\n---\n\nTh"
},
{
"path": "docs/docs/apis/clipboard.md",
"chars": 399,
"preview": "---\nid: apis/clipboard\ntitle: Clipboard\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/clipboard.html\nnext: apis"
},
{
"path": "docs/docs/apis/input.md",
"chars": 788,
"preview": "---\nid: apis/input\ntitle: Input\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/input.html\nnext: apis/internation"
},
{
"path": "docs/docs/apis/international.md",
"chars": 1319,
"preview": "---\nid: apis/international\ntitle: International\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/international.htm"
},
{
"path": "docs/docs/apis/linking.md",
"chars": 1597,
"preview": "---\nid: apis/linking\ntitle: Linking\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/linking.html\nnext: apis/locat"
},
{
"path": "docs/docs/apis/location.md",
"chars": 1558,
"preview": "---\nid: apis/location\ntitle: Location\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/location.html\nnext: apis/mo"
},
{
"path": "docs/docs/apis/modal.md",
"chars": 2251,
"preview": "---\nid: apis/modal\ntitle: Modal\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/modal.html\nnext: apis/network\n---"
},
{
"path": "docs/docs/apis/network.md",
"chars": 266,
"preview": "---\nid: apis/network\ntitle: Network\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/network.html\nnext: apis/platf"
},
{
"path": "docs/docs/apis/platform.md",
"chars": 568,
"preview": "---\nid: apis/platform\ntitle: Platform\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/platform.html\nnext: apis/po"
},
{
"path": "docs/docs/apis/popup.md",
"chars": 6506,
"preview": "---\nid: apis/popup\ntitle: Popup\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/popup.html\nnext: apis/statusbar\n-"
},
{
"path": "docs/docs/apis/statusbar.md",
"chars": 1014,
"preview": "---\nid: apis/statusbar\ntitle: StatusBar\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/statusbar.html\nnext: apis"
},
{
"path": "docs/docs/apis/storage.md",
"chars": 717,
"preview": "---\nid: apis/storage\ntitle: Storage\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/storage.html\nnext: apis/useri"
},
{
"path": "docs/docs/apis/userinterface.md",
"chars": 3144,
"preview": "---\nid: apis/userinterface\ntitle: UserInterface\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/userinterface.htm"
},
{
"path": "docs/docs/apis/userpresence.md",
"chars": 975,
"preview": "---\nid: apis/userpresence\ntitle: UserPresence\nlayout: docs\ncategory: Interfaces\npermalink: docs/apis/userpresence.html\nn"
},
{
"path": "docs/docs/components/activityindicator.md",
"chars": 938,
"preview": "---\nid: components/activityindicator\ntitle: ActivityIndicator\nlayout: docs\ncategory: Components\npermalink: docs/componen"
},
{
"path": "docs/docs/components/button.md",
"chars": 5146,
"preview": "---\nid: components/button\ntitle: Button\nlayout: docs\ncategory: Components\npermalink: docs/components/button.html\nnext: c"
},
{
"path": "docs/docs/components/gestureview.md",
"chars": 3040,
"preview": "---\nid: components/gestureview\ntitle: GestureView\nlayout: docs\ncategory: Components\npermalink: docs/components/gesturevi"
},
{
"path": "docs/docs/components/image.md",
"chars": 2974,
"preview": "---\nid: components/image\ntitle: Image\nlayout: docs\ncategory: Components\npermalink: docs/components/image.html\nnext: comp"
},
{
"path": "docs/docs/components/link.md",
"chars": 3217,
"preview": "---\nid: components/link\ntitle: Link\nlayout: docs\ncategory: Components\npermalink: docs/components/link.html\nnext: compone"
},
{
"path": "docs/docs/components/picker.md",
"chars": 2260,
"preview": "---\nid: components/picker\ntitle: Picker\nlayout: docs\ncategory: Components\npermalink: docs/components/picker.html\nnext: c"
},
{
"path": "docs/docs/components/scrollview.md",
"chars": 4158,
"preview": "---\nid: components/scrollview\ntitle: ScrollView\nlayout: docs\ncategory: Components\npermalink: docs/components/scrollview."
},
{
"path": "docs/docs/components/text.md",
"chars": 5412,
"preview": "---\nid: components/text\ntitle: Text\nlayout: docs\ncategory: Components\npermalink: docs/components/text.html\nnext: compone"
},
{
"path": "docs/docs/components/textinput.md",
"chars": 6482,
"preview": "---\nid: components/textinput\ntitle: TextInput\nlayout: docs\ncategory: Components\npermalink: docs/components/textinput.htm"
},
{
"path": "docs/docs/components/view.md",
"chars": 10039,
"preview": "---\nid: components/view\ntitle: View\nlayout: docs\ncategory: Components\npermalink: docs/components/view.html\nnext: compone"
},
{
"path": "docs/docs/components/webview.md",
"chars": 276,
"preview": "---\nid: components/webview\ntitle: WebView\nlayout: docs\ncategory: Components\npermalink: docs/components/webview.html\nnext"
},
{
"path": "docs/docs/extensions/database.md",
"chars": 617,
"preview": "---\nid: extensions/database\ntitle: Database\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/database.html\nn"
},
{
"path": "docs/docs/extensions/imagesvg.md",
"chars": 2581,
"preview": "---\nid: extensions/imagesvg\ntitle: ImageSvg\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/imagesvg.html\nn"
},
{
"path": "docs/docs/extensions/navigator.md",
"chars": 7494,
"preview": "---\nid: extensions/navigator\ntitle: Navigator\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/navigator.htm"
},
{
"path": "docs/docs/extensions/netinfo.md",
"chars": 1352,
"preview": "---\nid: extensions/netinfo\ntitle: NetInfo\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/netinfo.html\nnext"
},
{
"path": "docs/docs/extensions/restclient.md",
"chars": 1783,
"preview": "---\nid: extensions/restclient\ntitle: REST Client\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/restclient"
},
{
"path": "docs/docs/extensions/video.md",
"chars": 3289,
"preview": "---\nid: extensions/video\ntitle: Video\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/video.html\nnext: exte"
},
{
"path": "docs/docs/extensions/virtuallistview.md",
"chars": 8940,
"preview": "---\nid: extensions/virtuallistview\ntitle: VirtualListView\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/v"
},
{
"path": "docs/docs/extensions/webview.md",
"chars": 3872,
"preview": "---\nid: extensions/webview\ntitle: WebView\nlayout: docs\ncategory: Extensions\npermalink: docs/extensions/webview.html\n---\n"
},
{
"path": "docs/docs/extensions.md",
"chars": 4014,
"preview": "---\nid: extensions\ntitle: Extensions\nlayout: docs\ncategory: Overview\npermalink: docs/extensions.html\nnext: components/ac"
},
{
"path": "docs/docs/faq.md",
"chars": 4961,
"preview": "---\nid: faq\ntitle: Frequently Asked Questions\nlayout: docs\ncategory: Overview\npermalink: docs/faq.html\nnext: react_conce"
},
{
"path": "docs/docs/getting-started.md",
"chars": 2249,
"preview": "---\nid: getting-started\ntitle: Getting Started\nlayout: docs\ncategory: Overview\npermalink: docs/getting-started.html\nnext"
},
{
"path": "docs/docs/react_concepts.md",
"chars": 8202,
"preview": "---\nid: react_concepts\ntitle: React Concepts\nlayout: docs\ncategory: Overview\npermalink: docs/react_concepts.html\nnext: r"
},
{
"path": "docs/docs/react_lifecycle.md",
"chars": 3983,
"preview": "---\nid: react_lifecycle\ntitle: Component Lifecycle\nlayout: docs\ncategory: Overview\npermalink: docs/react_lifecycle.html\n"
},
{
"path": "docs/docs/react_stores.md",
"chars": 1896,
"preview": "---\nid: react_stores\ntitle: Stores & Services\nlayout: docs\ncategory: Overview\npermalink: docs/react_stores.html\nnext: st"
},
{
"path": "docs/docs/styles.md",
"chars": 8948,
"preview": "---\nid: styles\ntitle: Styles\nlayout: docs\ncategory: Overview\npermalink: docs/styles.html\nnext: animations\n---\n\nEach comp"
},
{
"path": "docs/docs/using-reactxp.md",
"chars": 1515,
"preview": "---\nid: using-reactxp\ntitle: Using ReactXP\nlayout: docs\ncategory: Overview\npermalink: docs/using-reactxp.html\nnext: faq\n"
},
{
"path": "docs/index.md",
"chars": 2203,
"preview": "---\nlayout: hero\ntitle: A library for building cross-platform apps\nid: home\n---\n\n<section class=\"light home-section\">\n "
},
{
"path": "docs/versions/version_history.md",
"chars": 35325,
"preview": "---\nid: version_history\ntitle: Version History\nlayout: hero\nsectionid: versions\npermalink: versions/version_history.html"
},
{
"path": "extensions/README.md",
"chars": 612,
"preview": "# ReactXP Extensions\nThe ReactXP library is designed to be as lightweight as possible, including only those cross-platf"
},
{
"path": "extensions/imagesvg/.eslintrc.json",
"chars": 429,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {},\n \"ov"
},
{
"path": "extensions/imagesvg/.gitignore",
"chars": 207,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Dependency directories\nnode_modules\npackage-lock.json\n\n# Optional npm cache director"
},
{
"path": "extensions/imagesvg/.npmignore",
"chars": 48,
"preview": "/node_modules\n/src/.vs\n/src/bin\n/src/obj\n*.user\n"
},
{
"path": "extensions/imagesvg/README.md",
"chars": 1236,
"preview": "# reactxp-imagesvg\nThis module provides cross-platform support for SVG (Scalable Vector Graphics) within the [ReactXP](h"
},
{
"path": "extensions/imagesvg/index.android.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/android/PluginBase.js');\n"
},
{
"path": "extensions/imagesvg/index.ios.js",
"chars": 69,
"preview": "'use strict';\n\nmodule.exports = require('./dist/ios/PluginBase.js');\n"
},
{
"path": "extensions/imagesvg/index.js",
"chars": 149,
"preview": "'use strict';\n\n// Export web by default. Other platforms have custom index.[platform].js files\nmodule.exports = require("
},
{
"path": "extensions/imagesvg/index.macos.js",
"chars": 71,
"preview": "'use strict';\n\nmodule.exports = require('./dist/macos/PluginBase.js');\n"
},
{
"path": "extensions/imagesvg/index.windows.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/windows/PluginBase.js');\n"
},
{
"path": "extensions/imagesvg/package.json",
"chars": 932,
"preview": "{\n \"name\": \"reactxp-imagesvg\",\n \"version\": \"2.0.0\",\n \"description\": \"Plugin for ReactXP that provides support for SVG"
},
{
"path": "extensions/imagesvg/src/android/PluginBase.tsx",
"chars": 431,
"preview": "/*\n * PluginBase.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/common/Interfaces.ts",
"chars": 641,
"preview": "/*\n * Interfaces.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/common/PluginBaseChecker.ts",
"chars": 844,
"preview": "/*\n * PluginBaseChecker.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT licens"
},
{
"path": "extensions/imagesvg/src/common/Types.ts",
"chars": 1184,
"preview": "/*\n * Types.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * Typ"
},
{
"path": "extensions/imagesvg/src/common/assert.ts",
"chars": 294,
"preview": "/**\n * assert\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n */\n"
},
{
"path": "extensions/imagesvg/src/ios/PluginBase.tsx",
"chars": 427,
"preview": "/*\n * PluginBase.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/macos/PluginBase.tsx",
"chars": 427,
"preview": "/*\n * PluginBase.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/native-common/ImageSvg.tsx",
"chars": 1218,
"preview": "/**\n * ImageSvg.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n"
},
{
"path": "extensions/imagesvg/src/native-common/SvgPath.tsx",
"chars": 828,
"preview": "/**\n * SvgPath.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n *"
},
{
"path": "extensions/imagesvg/src/native-common/SvgRect.tsx",
"chars": 951,
"preview": "/**\n * SvgPath.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n *"
},
{
"path": "extensions/imagesvg/src/typings/react-native-svg.d.ts",
"chars": 2606,
"preview": "/**\n * react-native-svg.d.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT lice"
},
{
"path": "extensions/imagesvg/src/web/ImageSvg.tsx",
"chars": 3413,
"preview": "/*\n * ImageSvg.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/web/PluginBase.ts",
"chars": 383,
"preview": "/*\n * PluginBase.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/web/SvgPath.tsx",
"chars": 769,
"preview": "/*\n * SvgPath.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/imagesvg/src/web/SvgRect.tsx",
"chars": 892,
"preview": "/*\n * SvgRect.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/imagesvg/src/windows/ImageSvg.tsx",
"chars": 493,
"preview": "/**\n * ImageSvg.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/windows/PluginBase.ts",
"chars": 383,
"preview": "/*\n * PluginBase.ts\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/imagesvg/src/windows/SvgPath.tsx",
"chars": 467,
"preview": "/*\n * SvgPath.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/imagesvg/src/windows/SvgRect.tsx",
"chars": 467,
"preview": "/*\n * SvgRect.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/imagesvg/tsconfig.json",
"chars": 403,
"preview": "{\n \"compilerOptions\": {\n \"declaration\": true,\n \"noResolve\": false,\n \"jsx\": \"react\",\n \"mod"
},
{
"path": "extensions/navigation/.eslintrc.json",
"chars": 699,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {\n \"no"
},
{
"path": "extensions/navigation/.gitignore",
"chars": 45,
"preview": "dist\nnode_modules\n.DS_Store\npackage-lock.json"
},
{
"path": "extensions/navigation/.npmignore",
"chars": 6,
"preview": "!dist\n"
},
{
"path": "extensions/navigation/README.md",
"chars": 1204,
"preview": "# reactxp-navigation\nThis module provides cross-platform navigation support [ReactXP](https://microsoft.github.io/reactx"
},
{
"path": "extensions/navigation/index.android.js",
"chars": 74,
"preview": "'use strict';\n\nmodule.exports = require('./dist/native-common/Navigator');"
},
{
"path": "extensions/navigation/index.ios.js",
"chars": 74,
"preview": "'use strict';\n\nmodule.exports = require('./dist/native-common/Navigator');"
},
{
"path": "extensions/navigation/index.js",
"chars": 144,
"preview": "'use strict';\n\n// Export web by default. Other platforms have custom index.[platform].js files\nmodule.exports = require("
},
{
"path": "extensions/navigation/index.macos.js",
"chars": 75,
"preview": "'use strict';\n\nmodule.exports = require('./dist/native-common/Navigator');\n"
},
{
"path": "extensions/navigation/index.windows.js",
"chars": 74,
"preview": "'use strict';\n\nmodule.exports = require('./dist/native-common/Navigator');"
},
{
"path": "extensions/navigation/package.json",
"chars": 1279,
"preview": "{\n \"name\": \"reactxp-navigation\",\n \"version\": \"2.0.0\",\n \"description\": \"Plugin for ReactXP that provides a navigation "
},
{
"path": "extensions/navigation/src/common/Types.ts",
"chars": 4817,
"preview": "/**\n * Types.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n * Ty"
},
{
"path": "extensions/navigation/src/common/assert.ts",
"chars": 294,
"preview": "/**\n * assert\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n */\n"
},
{
"path": "extensions/navigation/src/common/lodashMini.ts",
"chars": 828,
"preview": "/**\n * lodashMini.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n"
},
{
"path": "extensions/navigation/src/native-common/Navigator.tsx",
"chars": 4158,
"preview": "/**\n * Navigator.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license."
},
{
"path": "extensions/navigation/src/native-common/NavigatorExperimentalDelegate.tsx",
"chars": 13545,
"preview": "/**\n * NavigatorExperimentalDelegate.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed und"
},
{
"path": "extensions/navigation/src/typings/react-native-deprecated-custom-components.d.ts",
"chars": 1312,
"preview": "declare module 'react-native-deprecated-custom-components' {\n import * as RN from 'react-native';\n\n interface Navi"
},
{
"path": "extensions/navigation/src/typings/rebound.d.ts",
"chars": 89,
"preview": "declare module 'rebound' {\n class SpringSystem {\n createSpring(): any;\n }\n}\n"
},
{
"path": "extensions/navigation/src/web/Navigator.tsx",
"chars": 23012,
"preview": "/*\n * Navigator.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n"
},
{
"path": "extensions/navigation/src/web/NavigatorSceneConfigFactory.tsx",
"chars": 8590,
"preview": "/**\n * NavigatorSceneConfigFactory.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under "
},
{
"path": "extensions/navigation/tsconfig.json",
"chars": 436,
"preview": "{\n \"compilerOptions\": {\n \"experimentalDecorators\": true,\n \"noImplicitAny\": true,\n \"skipLibCheck\""
},
{
"path": "extensions/netinfo/.eslintrc.json",
"chars": 414,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\"],\n \"rules\": {},\n \"overrides\": [\n "
},
{
"path": "extensions/netinfo/.gitignore",
"chars": 208,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Dependency directories\nnode_modules\npackage-lock.json\n\n# Optional npm cache director"
},
{
"path": "extensions/netinfo/.npmignore",
"chars": 48,
"preview": "/node_modules\n/src/.vs\n/src/bin\n/src/obj\n*.user\n"
},
{
"path": "extensions/netinfo/README.md",
"chars": 1844,
"preview": "# reactxp-netinfo\nThis module provides cross-platform support for detecting network ionformation within the [ReactXP](ht"
},
{
"path": "extensions/netinfo/index.android.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/android/PluginBase.js');\n"
},
{
"path": "extensions/netinfo/index.ios.js",
"chars": 69,
"preview": "'use strict';\n\nmodule.exports = require('./dist/ios/PluginBase.js');\n"
},
{
"path": "extensions/netinfo/index.js",
"chars": 149,
"preview": "'use strict';\n\n// Export web by default. Other platforms have custom index.[platform].js files\nmodule.exports = require("
},
{
"path": "extensions/netinfo/index.macos.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/macos/PluginBase.js');"
},
{
"path": "extensions/netinfo/index.windows.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/windows/PluginBase.js');\n"
},
{
"path": "extensions/netinfo/package.json",
"chars": 799,
"preview": "{\n \"name\": \"reactxp-netinfo\",\n \"version\": \"2.0.0\",\n \"description\": \"Plugin for ReactXP that provides information abou"
},
{
"path": "extensions/netinfo/src/android/PluginBase.tsx",
"chars": 317,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/src/common/Interfaces.ts",
"chars": 669,
"preview": "/*\n * Interfaces.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/src/common/PluginBaseChecker.ts",
"chars": 847,
"preview": "/*\n * PluginBaseChecker.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT lic"
},
{
"path": "extensions/netinfo/src/common/Types.ts",
"chars": 273,
"preview": "/*\n * Types.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/netinfo/src/ios/PluginBase.tsx",
"chars": 313,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/src/macos/PluginBase.tsx",
"chars": 313,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/src/native-common/NetInfo.tsx",
"chars": 2346,
"preview": "/**\n * NetInfo.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n"
},
{
"path": "extensions/netinfo/src/web/NetInfo.tsx",
"chars": 1034,
"preview": "/**\n * Video.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/netinfo/src/web/PluginBase.ts",
"chars": 299,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/src/windows/PluginBase.ts",
"chars": 317,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/netinfo/tsconfig.json",
"chars": 651,
"preview": "{\n \"compilerOptions\": {\n \"forceConsistentCasingInFileNames\": true,\n \"strictPropertyInitialization\": tru"
},
{
"path": "extensions/video/.eslintrc.json",
"chars": 429,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {},\n \"ov"
},
{
"path": "extensions/video/.gitignore",
"chars": 208,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Dependency directories\nnode_modules\npackage-lock.json\n\n# Optional npm cache director"
},
{
"path": "extensions/video/.npmignore",
"chars": 48,
"preview": "/node_modules\n/src/.vs\n/src/bin\n/src/obj\n*.user\n"
},
{
"path": "extensions/video/README.md",
"chars": 1214,
"preview": "# reactxp-video\nThis module provides cross-platform support for video playback within the [ReactXP](https://microsoft.gi"
},
{
"path": "extensions/video/index.android.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/android/PluginBase.js');\n"
},
{
"path": "extensions/video/index.ios.js",
"chars": 69,
"preview": "'use strict';\n\nmodule.exports = require('./dist/ios/PluginBase.js');\n"
},
{
"path": "extensions/video/index.js",
"chars": 149,
"preview": "'use strict';\n\n// Export web by default. Other platforms have custom index.[platform].js files\nmodule.exports = require("
},
{
"path": "extensions/video/index.macos.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/macos/PluginBase.js');"
},
{
"path": "extensions/video/index.windows.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/windows/PluginBase.js');\n"
},
{
"path": "extensions/video/package.json",
"chars": 1035,
"preview": "{\n \"name\": \"reactxp-video\",\n \"version\": \"2.0.0\",\n \"description\": \"Plugin for ReactXP that provides a video player com"
},
{
"path": "extensions/video/src/android/PluginBase.tsx",
"chars": 311,
"preview": "/*\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/video/src/common/Interfaces.ts",
"chars": 621,
"preview": "/*\n * Interfaces.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n "
},
{
"path": "extensions/video/src/common/PluginBaseChecker.ts",
"chars": 847,
"preview": "/*\n * PluginBaseChecker.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT lic"
},
{
"path": "extensions/video/src/common/Types.ts",
"chars": 1295,
"preview": "/*\n * Types.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n * "
},
{
"path": "extensions/video/src/ios/PluginBase.tsx",
"chars": 308,
"preview": "/**\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n"
},
{
"path": "extensions/video/src/macos/PluginBase.tsx",
"chars": 310,
"preview": "/**\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n"
},
{
"path": "extensions/video/src/native-common/Video.tsx",
"chars": 4311,
"preview": "/**\n * Video.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/video/src/typings/react-native-video.d.ts",
"chars": 2435,
"preview": "/**\n * react-native-video.d.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT"
},
{
"path": "extensions/video/src/web/PluginBase.ts",
"chars": 249,
"preview": "/**\n * PluginBase.ts\n * Author: David de Regt\n * Copyright: Microsoft 2016\n *\n * Base export for the Web implementation "
},
{
"path": "extensions/video/src/web/Video.tsx",
"chars": 5266,
"preview": "/**\n * Video.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/video/src/windows/PluginBase.ts",
"chars": 294,
"preview": "/**\n * PluginBase.ts\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n"
},
{
"path": "extensions/video/src/windows/Video.tsx",
"chars": 1363,
"preview": "/**\n * Video.tsx\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n "
},
{
"path": "extensions/video/tsconfig.json",
"chars": 669,
"preview": "{\n \"compilerOptions\": {\n \"forceConsistentCasingInFileNames\": true,\n \"strictPropertyInitialization\": tru"
},
{
"path": "extensions/virtuallistview/.eslintrc.json",
"chars": 283,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {},\n \"ov"
},
{
"path": "extensions/virtuallistview/.gitignore",
"chars": 204,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Dependency directories\nnode_modules\n\n# Optional npm cache directory\n.npm\n\n# Build ar"
},
{
"path": "extensions/virtuallistview/.npmignore",
"chars": 21,
"preview": "/node_modules\n*.user\n"
},
{
"path": "extensions/virtuallistview/LICENSE",
"chars": 1104,
"preview": "ReactXP\n\nCopyright (c) Microsoft Corporation\nAll rights reserved. \n\nMIT License\n\nPermission is hereby granted, free of c"
},
{
"path": "extensions/virtuallistview/README.md",
"chars": 1215,
"preview": "# ReactXP VirtualListView\nVirtualListView is a flexible, generalized list view built on [ReactXP](https://microsoft.gith"
},
{
"path": "extensions/virtuallistview/index.android.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/VirtualListView.js');\n"
},
{
"path": "extensions/virtuallistview/index.ios.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/VirtualListView.js');\n"
},
{
"path": "extensions/virtuallistview/index.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/VirtualListView.js');\n"
},
{
"path": "extensions/virtuallistview/index.macos.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/VirtualListView.js');\n"
},
{
"path": "extensions/virtuallistview/index.windows.js",
"chars": 70,
"preview": "'use strict';\n\nmodule.exports = require('./dist/VirtualListView.js');\n"
},
{
"path": "extensions/virtuallistview/package.json",
"chars": 1230,
"preview": "{\n \"name\": \"reactxp-virtuallistview\",\n \"version\": \"2.1.0\",\n \"description\": \"General-purpose virtualized list view bui"
},
{
"path": "extensions/virtuallistview/src/VirtualListCell.tsx",
"chars": 15484,
"preview": "/**\n * VirtualListCell.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT licens"
},
{
"path": "extensions/virtuallistview/src/VirtualListView.tsx",
"chars": 60837,
"preview": "/**\n * VirtualListView.tsx\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT licens"
},
{
"path": "extensions/virtuallistview/src/assert.ts",
"chars": 294,
"preview": "/**\n * assert\n *\n * Copyright (c) Microsoft Corporation. All rights reserved.\n * Licensed under the MIT license.\n *\n */\n"
},
{
"path": "extensions/virtuallistview/tsconfig.json",
"chars": 640,
"preview": "{\n \"compilerOptions\": {\n \"declaration\": true,\n \"noResolve\": false,\n \"importHelpers\": true,\n "
},
{
"path": "extensions/webview/.eslintrc.json",
"chars": 429,
"preview": "{\n \"parserOptions\": {\n \"project\": \"./tsconfig.json\"\n },\n \"extends\": [\"skype\", \"skype/react\"],\n \"rules\": {},\n \"ov"
},
{
"path": "extensions/webview/.gitignore",
"chars": 208,
"preview": "# Logs\nlogs\n*.log\nnpm-debug.log*\n\n# Dependency directories\nnode_modules\npackage-lock.json\n\n# Optional npm cache director"
},
{
"path": "extensions/webview/.npmignore",
"chars": 48,
"preview": "/node_modules\n/src/.vs\n/src/bin\n/src/obj\n*.user\n"
},
{
"path": "extensions/webview/README.md",
"chars": 1876,
"preview": "# reactxp-webview\nThis module provides a cross-platform control that allows the display of an independent web page withi"
},
{
"path": "extensions/webview/index.android.js",
"chars": 73,
"preview": "'use strict';\n\nmodule.exports = require('./dist/android/PluginBase.js');\n"
},
{
"path": "extensions/webview/index.ios.js",
"chars": 69,
"preview": "'use strict';\n\nmodule.exports = require('./dist/ios/PluginBase.js');\n"
}
]
// ... and 590 more files (download for full content)
About this extraction
This page contains the full source code of the microsoft/reactxp GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 790 files (2.5 MB), approximately 684.6k tokens, and a symbol index with 2664 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.