{"id":19466889,"url":"https://github.com/scommons/scommons-react-native","last_synced_at":"2025-04-25T11:30:42.232Z","repository":{"id":35664483,"uuid":"165878783","full_name":"scommons/scommons-react-native","owner":"scommons","description":"Scala.js facades for react-native and expo APIs and components","archived":false,"fork":false,"pushed_at":"2024-03-09T14:25:24.000Z","size":21490,"stargazers_count":11,"open_issues_count":6,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-03T20:11:11.867Z","etag":null,"topics":["demo","expo","facades","mobile","navigation","react-native","reactnative","scala","scala-facade","scala-facades","scalajs","scalajs-reactjs"],"latest_commit_sha":null,"homepage":"https://scommons.github.io/scommons-react-native/","language":"Scala","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/scommons.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-01-15T15:49:20.000Z","updated_at":"2024-03-26T14:33:16.000Z","dependencies_parsed_at":"2024-11-10T18:32:56.056Z","dependency_job_id":"afd77777-dede-43bf-885f-7df346123128","html_url":"https://github.com/scommons/scommons-react-native","commit_stats":{"total_commits":134,"total_committers":2,"mean_commits":67.0,"dds":0.007462686567164201,"last_synced_commit":"1d56c2ccc073790a42806f38d6169e5baa8282cf"},"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scommons%2Fscommons-react-native","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scommons%2Fscommons-react-native/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scommons%2Fscommons-react-native/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/scommons%2Fscommons-react-native/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/scommons","download_url":"https://codeload.github.com/scommons/scommons-react-native/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250808048,"owners_count":21490612,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["demo","expo","facades","mobile","navigation","react-native","reactnative","scala","scala-facade","scala-facades","scalajs","scalajs-reactjs"],"created_at":"2024-11-10T18:31:25.268Z","updated_at":"2025-04-25T11:30:40.414Z","avatar_url":"https://github.com/scommons.png","language":"Scala","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n[![CI](https://github.com/scommons/scommons-react-native/actions/workflows/ci.yml/badge.svg?branch=master)](https://github.com/scommons/scommons-react-native/actions/workflows/ci.yml?query=workflow%3Aci+branch%3Amaster)\n[![Coverage Status](https://coveralls.io/repos/github/scommons/scommons-react-native/badge.svg?branch=master)](https://coveralls.io/github/scommons/scommons-react-native?branch=master)\n[![scala-index](https://index.scala-lang.org/scommons/scommons-react-native/scommons-react-native-core/latest.svg)](https://index.scala-lang.org/scommons/scommons-react-native/scommons-react-native-core)\n[![Scala.js](https://www.scala-js.org/assets/badges/scalajs-1.8.0.svg)](https://www.scala-js.org)\n\n## Scala Commons React Native\nScala.js facades for core [react-native](https://facebook.github.io/react-native/docs/getting-started) utilities and components.\n\nIt uses excellent [scalajs-reactjs](https://github.com/shogowada/scalajs-reactjs) binding/facade library.\n\n![Screenshots](docs/images/screenshots.png)\n\n### How to add it to your project\n\n```scala\nval scommonsReactNativeVer = \"1.0.0-SNAPSHOT\"\n\nlibraryDependencies ++= Seq(\n  \"org.scommons.react-native\" %%% \"scommons-react-native-core\" % scommonsReactNativeVer,\n  \"org.scommons.react-native\" %%% \"scommons-react-native-community\" % scommonsReactNativeVer,\n  \"org.scommons.react-native\" %%% \"scommons-react-navigation\" % scommonsReactNativeVer,\n  \"org.scommons.react-native\" %%% \"scommons-expo\" % scommonsReactNativeVer,\n  \n  // ui module already includes all above modules\n  \"org.scommons.react-native\" %%% \"scommons-react-native-ui\" % scommonsReactNativeVer,\n  \n  // mocks of native Components and APIs\n  \"org.scommons.react-native\" %%% \"scommons-react-native-test\" % scommonsReactNativeVer % \"test\"\n)\n```\n\nLatest `SNAPSHOT` version is published to [Sonatype Repo](https://oss.sonatype.org/content/repositories/snapshots/org/scommons/), just make sure you added\nthe proper dependency resolver to your `build.sbt` settings:\n```scala\nresolvers += \"Sonatype Snapshots\" at \"https://oss.sonatype.org/content/repositories/snapshots/\"\n```\n\n### How to use it\n\n#### Demo Application\n\nSee [showcase/README.md](showcase/README.md) for how to build and run it.\n\n* [live expo link](https://expo.io/@viktorpodzigun/showcase)\n* [mobile browser](https://scommons.github.io/scommons-react-native/showcase.html)\n* [web emulator](https://scommons.github.io/scommons-react-native/showcase.browser.html)\n\n##### Demo App/UI Library Components\n\n* [app](showcase/src/main/scala/showcase/app/ShowcaseApp.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseAppSpec.scala)\n  * [controller](showcase/src/main/scala/showcase/app/ShowcaseController.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseControllerSpec.scala)\n  * [screen](showcase/src/main/scala/showcase/app/ShowcaseScreen.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseScreenSpec.scala)\n  * [state](showcase/src/main/scala/showcase/app/ShowcaseState.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseStateReducerSpec.scala)\n  * [TaskController](showcase/src/main/scala/showcase/app/ShowcaseTaskController.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseTaskControllerSpec.scala)\n* Screens with API calls\n  * [actions](showcase/src/main/scala/showcase/app/task/DemoTaskActions.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/task/DemoTaskActionsSpec.scala)\n  * [controller](showcase/src/main/scala/showcase/app/task/DemoTaskController.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/task/DemoTaskControllerSpec.scala)\n  * [screen](showcase/src/main/scala/showcase/app/task/DemoTaskScreen.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/task/DemoTaskScreenSpec.scala)\n* Reusable Custom UI Components\n  * [ChoiceGroup](showcase/src/main/scala/showcase/app/ui/ChoiceGroupDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ui/ChoiceGroupDemoSpec.scala)\n\n##### React Native Styling Examples\n\nNote: Many examples are from an excellent book [React Native in Action](https://www.manning.com/books/react-native-in-action) by [Nader Dabit](https://github.com/dabit3)\n\n* [Border Style](showcase/src/main/scala/showcase/app/style/BorderStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/BorderStyleDemoSpec.scala)\n* [Border Radius](showcase/src/main/scala/showcase/app/style/BorderRadiusDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/BorderRadiusDemoSpec.scala)\n* [Margin](showcase/src/main/scala/showcase/app/style/MarginStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/MarginStyleDemoSpec.scala)\n* [Padding](showcase/src/main/scala/showcase/app/style/PaddingStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/PaddingStyleDemoSpec.scala)\n* [Position](showcase/src/main/scala/showcase/app/style/PositionStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/PositionStyleDemoSpec.scala)\n* [TextStyle](showcase/src/main/scala/showcase/app/style/TextStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/TextStyleDemoSpec.scala)\n* [ProfileCard (with Images)](showcase/src/main/scala/showcase/app/style/ProfileCard.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/style/ProfileCardSpec.scala)\n\n### Facades\n\n#### react-native\n\n* [Components](https://facebook.github.io/react-native/docs/activityindicator):\n  * [ActivityIndicator](showcase/src/main/scala/showcase/ActivityIndicatorDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ActivityIndicatorDemoSpec.scala)\n  * [Button](showcase/src/main/scala/showcase/ButtonDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ButtonDemoSpec.scala)\n  * [FlatList](showcase/src/main/scala/showcase/FlatListDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/FlatListDemoSpec.scala)\n  * [Image](showcase/src/main/scala/showcase/ImageDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ImageDemoSpec.scala)\n    * [StaticResource](showcase/src/main/scala/showcase/app/ShowcaseImages.scala)\n  * [KeyboardAvoidingView](showcase/src/main/scala/showcase/KeyboardAvoidingViewDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/KeyboardAvoidingViewDemoSpec.scala)\n  * [Modal](showcase/src/main/scala/showcase/ModalDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ModalDemoSpec.scala)\n  * [ScrollView](showcase/src/main/scala/showcase/ScrollViewDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ScrollViewDemoSpec.scala)\n  * [StatusBar](showcase/src/main/scala/showcase/app/ShowcaseRoot.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseRootSpec.scala)\n  * [Switch](showcase/src/main/scala/showcase/SwitchDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/SwitchDemoSpec.scala)\n  * [TextInput](showcase/src/main/scala/showcase/TextInputDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/TextInputDemoSpec.scala)\n  * [TouchableHighlight](showcase/src/main/scala/showcase/TouchableHighlightDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/TouchableHighlightDemoSpec.scala)\n  * [TouchableOpacity](showcase/src/main/scala/showcase/TouchableOpacityDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/TouchableOpacityDemoSpec.scala)\n\n* [APIs](https://facebook.github.io/react-native/docs/accessibilityinfo):\n  * [Alert](showcase/src/main/scala/showcase/AlertDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/AlertDemoSpec.scala)\n  * [Platform](showcase/src/main/scala/showcase/PlatformDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/PlatformDemoSpec.scala)\n  * [Style](showcase/src/main/scala/showcase/StyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/StyleDemoSpec.scala)\n  * [TextStyle](showcase/src/main/scala/showcase/TextStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/TextStyleDemoSpec.scala)\n  * [ViewStyle](showcase/src/main/scala/showcase/ViewStyleDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/ViewStyleDemoSpec.scala)\n\n#### react-native-community\n\n* [@react-native-picker/picker](https://github.com/react-native-picker/picker)\n  * [Picker](showcase/src/main/scala/showcase/app/community/PickerDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/PickerDemoSpec.scala)\n* [react-native-safe-area-context](https://github.com/th3rdwave/react-native-safe-area-context)\n  * [SafeAreaProvider](showcase/src/main/scala/showcase/app/ShowcaseRoot.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseRootSpec.scala)\n  * [SafeAreaView](showcase/src/main/scala/showcase/app/community/WebViewDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/WebViewDemoSpec.scala)\n* [react-native-svg](https://github.com/react-native-community/react-native-svg)\n  * [SvgXml](showcase/src/main/scala/showcase/app/community/SvgXmlDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/SvgXmlDemoSpec.scala)\n  * [SvgCss](showcase/src/main/scala/showcase/app/community/SvgCssDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/SvgCssDemoSpec.scala)\n* [react-native-webview](showcase/src/main/scala/showcase/app/community/WebViewDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/WebViewDemoSpec.scala)\n* [react-native-htmlview](showcase/src/main/scala/showcase/app/community/HTMLViewDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/HTMLViewDemoSpec.scala)\n* [react-native-syntax-highlighter](showcase/src/main/scala/showcase/app/community/SyntaxHighlighterDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/community/SyntaxHighlighterDemoSpec.scala)\n\n#### react-navigation (v6)\n\n* [Components](https://reactnavigation.org/docs/hello-react-navigation/)\n  * [StackNavigator](showcase/src/main/scala/showcase/app/ReactNativeDemoScreen.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ReactNativeDemoScreenSpec.scala)\n  * [BottomTabNavigator](showcase/src/main/scala/showcase/app/ShowcaseRoot.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseRootSpec.scala)\n\n* [APIs](https://reactnavigation.org/docs/navigation-prop/)\n  * [Navigation](navigation/src/main/scala/scommons/react/navigation/Navigation.scala) =\u003e [tests](navigation/src/test/scala/scommons/react/navigation/NavigationSpec.scala)\n\n#### expo modules\n\n[expo docs](https://docs.expo.io/versions/latest/)\n\n* [expo-asset](showcase/src/main/scala/showcase/app/expo/AssetDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/expo/AssetDemoSpec.scala)\n  * [preloading-and-caching-assets](https://docs.expo.io/guides/preloading-and-caching-assets/) =\u003e [ShowcaseApp](showcase/src/main/scala/showcase/app/ShowcaseApp.scala)\n* [expo-font](showcase/src/main/scala/showcase/app/expo/FontDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/expo/FontDemoSpec.scala)\n* [@expo/vector-icons](showcase/src/main/scala/showcase/app/ShowcaseRoot.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/ShowcaseRootSpec.scala)\n* [expo-av](https://docs.expo.io/versions/latest/sdk/video/)\n  * [Video](showcase/src/main/scala/showcase/app/expo/av/VideoDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/expo/av/VideoDemoSpec.scala)\n* [expo-sqlite](https://docs.expo.io/versions/latest/sdk/sqlite/)\n  * [SQLite](showcase/src/main/scala/showcase/app/expo/sqlite/SQLiteDemo.scala) =\u003e [tests](showcase/src/test/scala/showcase/app/expo/sqlite/SQLiteDemoSpec.scala)\n  * See [scommons-websql](https://github.com/scommons/scommons-websql) for how to:\n    * use high-level `scommons-websql-io` module with expo SQLite\n    * use `scommons-websql-migrations` to automate your DB schema versioning\n\n### How to Build\n\nTo build and run all the tests use the following command:\n```bash\nsbt test\n```\n\n## Documentation\n\nYou can find more documentation [here](https://scommons.github.io/scommons-react-native)\n\n### Examples\n\nYou can find more examples [here](https://github.com/scommons/scommons-examples-mobile)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscommons%2Fscommons-react-native","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fscommons%2Fscommons-react-native","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fscommons%2Fscommons-react-native/lists"}