{"id":15406975,"url":"https://github.com/negativetwelve/react-x","last_synced_at":"2025-04-15T16:41:53.541Z","repository":{"id":24693437,"uuid":"102228289","full_name":"negativetwelve/react-x","owner":"negativetwelve","description":"Cross-platform React components for ReactDOM and React Native","archived":false,"fork":false,"pushed_at":"2023-01-04T21:43:58.000Z","size":4417,"stargazers_count":10,"open_issues_count":24,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-07T16:09:12.707Z","etag":null,"topics":["cross-platform","react","react-dom","react-native"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/negativetwelve.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}},"created_at":"2017-09-02T23:00:35.000Z","updated_at":"2022-01-29T08:38:41.000Z","dependencies_parsed_at":"2023-01-14T01:26:25.849Z","dependency_job_id":null,"html_url":"https://github.com/negativetwelve/react-x","commit_stats":null,"previous_names":[],"tags_count":64,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/negativetwelve%2Freact-x","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/negativetwelve%2Freact-x/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/negativetwelve%2Freact-x/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/negativetwelve%2Freact-x/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/negativetwelve","download_url":"https://codeload.github.com/negativetwelve/react-x/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249110350,"owners_count":21214315,"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":["cross-platform","react","react-dom","react-native"],"created_at":"2024-10-01T16:26:32.957Z","updated_at":"2025-04-15T16:41:53.523Z","avatar_url":"https://github.com/negativetwelve.png","language":"JavaScript","readme":"# React X\n\n[![npm](https://img.shields.io/npm/v/react-x.svg)](https://www.npmjs.com/package/react-x)\n[![npm](https://img.shields.io/npm/dt/react-x.svg)](https://www.npmjs.com/package/react-x)\n[![npm](https://img.shields.io/npm/l/react-x.svg)](https://github.com/negativetwelve/react-x/blob/master/LICENSE)\n[![CircleCI](https://img.shields.io/circleci/project/github/negativetwelve/react-x.svg?label=circle)](https://circleci.com/gh/negativetwelve/react-x)\n[![Travis](https://img.shields.io/travis/negativetwelve/react-x.svg?label=travis)](https://travis-ci.org/negativetwelve/react-x)\n[![AppVeyor](https://img.shields.io/appveyor/ci/negativetwelve/react-x/master.svg?label=appveyor)](https://ci.appveyor.com/project/negativetwelve/react-x)\n[![Coveralls](https://img.shields.io/coveralls/negativetwelve/react-x.svg)](https://coveralls.io/github/negativetwelve/react-x?branch=master)\n\nCross-platform React components for ReactDOM and React Native.\n\n## Getting Started\n\nInstall `react-x` using `yarn`:\n\n```shell\nyarn add react-x\n```\n\n## Setup\n\n### React Native\n\nNo additional setup required for react-native.\n\n### React DOM\n\nIf using Webpack, you need to add the `.dom.js` extension to the extensions array.\n\n```javascript\nmodule.exports = {\n  resolve: {\n    extensions: ['.dom.js', '.js', '.json'],\n  },\n};\n```\n\n## Components\n\nName | Version | Description\n-----|---------|------------\n[`@react-x/activity-indicator`](/components/activity-indicator) | [![npm](https://img.shields.io/npm/v/@react-x/activity-indicator.svg)][npm-activity-indicator] | Cross-platform ActivityIndicator component for ReactDOM and React Native.\n[`@react-x/flat-list`](/components/flat-list) | [![npm](https://img.shields.io/npm/v/@react-x/flat-list.svg)][npm-flat-list] | Cross-platform FlatList component for ReactDOM and React Native.\n[`@react-x/image`](/components/image) | [![npm](https://img.shields.io/npm/v/@react-x/image.svg)][npm-image] | Cross-platform Image component for ReactDOM and React Native.\n[`@react-x/keyboard-avoiding-view`](/components/keyboard-avoiding-view) | [![npm](https://img.shields.io/npm/v/@react-x/keyboard-avoiding-view.svg)][npm-keyboard-avoiding-view] | Cross-platform KeyboardAvoidingView component for ReactDOM and React Native.\n[`@react-x/safe-area-view`](/components/safe-area-view) | [![npm](https://img.shields.io/npm/v/@react-x/safe-area-view.svg)][npm-safe-area-view] | Cross-platform SafeAreaView component for ReactDOM and React Native.\n[`@react-x/scroll-view`](/components/scroll-view) | [![npm](https://img.shields.io/npm/v/@react-x/scroll-view.svg)][npm-scroll-view] | Cross-platform ScrollView component for ReactDOM and React Native.\n[`@react-x/section-list`](/components/section-list) | [![npm](https://img.shields.io/npm/v/@react-x/section-list.svg)][npm-section-list] | Cross-platform SectionList component for ReactDOM and React Native.\n[`@react-x/svg`](/components/svg) | [![npm](https://img.shields.io/npm/v/@react-x/svg.svg)][npm-svg] | Cross-platform SVG support for ReactDOM and React Native.\n[`@react-x/switch`](/components/switch) | [![npm](https://img.shields.io/npm/v/@react-x/switch.svg)][npm-switch] | Switch component for toggling on/off.\n[`@react-x/text`](/components/text) | [![npm](https://img.shields.io/npm/v/@react-x/text.svg)][npm-text] | Cross-platform Text component for ReactDOM and React Native.\n[`@react-x/text-input`](/components/text-input) | [![npm](https://img.shields.io/npm/v/@react-x/text-input.svg)][npm-text-input] | TextInput component ReactDOM and React Native.\n[`@react-x/touchable`](/components/touchable) | [![npm](https://img.shields.io/npm/v/@react-x/touchable.svg)][npm-touchable] | Cross-platform Touchable components for ReactDOM and React Native.\n[`@react-x/view`](/components/view) | [![npm](https://img.shields.io/npm/v/@react-x/view.svg)][npm-view] | Cross-platform View component for ReactDOM and React Native.\n\n[npm-activity-indicator]: https://www.npmjs.com/package/@react-x/activity-indicator\n[npm-flat-list]: https://www.npmjs.com/package/@react-x/flat-list\n[npm-image]: https://www.npmjs.com/package/@react-x/image\n[npm-keyboard-avoiding-view]: https://www.npmjs.com/package/@react-x/keyboard-avoiding-view\n[npm-safe-area-view]: https://www.npmjs.com/package/@react-x/safe-area-view\n[npm-scroll-view]: https://www.npmjs.com/package/@react-x/scroll-view\n[npm-section-list]: https://www.npmjs.com/package/@react-x/section-list\n[npm-svg]: https://www.npmjs.com/package/@react-x/svg\n[npm-switch]: https://www.npmjs.com/package/@react-x/switch\n[npm-text]: https://www.npmjs.com/package/@react-x/text\n[npm-text-input]: https://www.npmjs.com/package/@react-x/text-input\n[npm-touchable]: https://www.npmjs.com/package/@react-x/touchable\n[npm-view]: https://www.npmjs.com/package/@react-x/view\n\n## Modules\n\nName | Version | Description\n-----|---------|------------\n[`@react-x/animated`](/modules/animated) | [![npm](https://img.shields.io/npm/v/@react-x/animated.svg)][npm-animated] | Animated module for React DOM and React Native.\n[`@react-x/clipboard`](/modules/clipboard) | [![npm](https://img.shields.io/npm/v/@react-x/clipboard.svg)][npm-clipboard] | Clipboard module for React DOM and React Native.\n[`@react-x/execution-environment`](/modules/execution-environment) | [![npm](https://img.shields.io/npm/v/@react-x/execution-environment.svg)][npm-execution-environment] | ExecutionEnvironment module for React DOM and React Native.\n[`@react-x/geolocation`](/modules/geolocation) | [![npm](https://img.shields.io/npm/v/@react-x/geolocation.svg)][npm-geolocation] | Geolocation module for React DOM and React Native.\n[`@react-x/keychain`](/modules/keychain) | [![npm](https://img.shields.io/npm/v/@react-x/keychain.svg)][npm-keychain] | Persistent storage for React DOM (cookies) and React Native (keychain).\n[`@react-x/linking`](/modules/linking) | [![npm](https://img.shields.io/npm/v/@react-x/linking.svg)][npm-linking] | Linking module for React DOM and React Native.\n[`@react-x/net-info`](/modules/net-info) | [![npm](https://img.shields.io/npm/v/@react-x/net-info.svg)][npm-net-info] | NetInfo module for React DOM and React Native.\n[`@react-x/platform`](/modules/platform) | [![npm](https://img.shields.io/npm/v/@react-x/platform.svg)][npm-platform] | Platform module for React DOM and React Native.\n[`@react-x/storage`](/modules/storage) | [![npm](https://img.shields.io/npm/v/@react-x/storage.svg)][npm-storage] | Storage module for React DOM and React Native.\n[`@react-x/style-sheet`](/modules/style-sheet) | [![npm](https://img.shields.io/npm/v/@react-x/style-sheet.svg)][npm-style-sheet] | StyleSheet module for React DOM and React Native.\n\n[npm-animated]: https://www.npmjs.com/package/@react-x/animated\n[npm-clipboard]: https://www.npmjs.com/package/@react-x/clipboard\n[npm-execution-environment]: https://www.npmjs.com/package/@react-x/execution-environment\n[npm-geolocation]: https://www.npmjs.com/package/@react-x/geolocation\n[npm-keychain]: https://www.npmjs.com/package/@react-x/keychain\n[npm-linking]: https://www.npmjs.com/package/@react-x/linking\n[npm-net-info]: https://www.npmjs.com/package/@react-x/net-info\n[npm-platform]: https://www.npmjs.com/package/@react-x/platform\n[npm-storage]: https://www.npmjs.com/package/@react-x/storage\n[npm-style-sheet]: https://www.npmjs.com/package/@react-x/style-sheet\n\n## Tools\n\nName | Version | Description\n-----|---------|------------\n[`@react-x/babel-preset`](/tools/babel-preset) | [![npm](https://img.shields.io/npm/v/@react-x/babel-preset.svg)][npm-babel-preset] | Babel preset for compiling react-x packages.\n[`@react-x/jest-preset-dom`](/tools/jest-preset-dom) | [![npm](https://img.shields.io/npm/v/@react-x/jest-preset-dom.svg)][npm-jest-preset-dom] | Jest preset for testing react-x dom packages.\n[`@react-x/jest-preset-native`](/tools/jest-preset-native) | [![npm](https://img.shields.io/npm/v/@react-x/jest-preset-native.svg)][npm-jest-preset-native] | Jest preset for testing react-x native packages.\n\n[npm-babel-preset]: https://www.npmjs.com/package/@react-x/babel-preset\n[npm-jest-preset-dom]: https://www.npmjs.com/package/@react-x/jest-preset-dom\n[npm-jest-preset-native]: https://www.npmjs.com/package/@react-x/jest-preset-native\n\n## Contributing\n\nIf you have any ideas on how this module could be better, [create an Issue](https://github.com/negativetwelve/react-x/issues) or [submit a PR](https://github.com/negativetwelve/react-x/pulls).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnegativetwelve%2Freact-x","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnegativetwelve%2Freact-x","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnegativetwelve%2Freact-x/lists"}