{"id":18264737,"url":"https://github.com/native-ly/native-agreement","last_synced_at":"2026-04-11T00:09:25.500Z","repository":{"id":38173989,"uuid":"313075731","full_name":"native-ly/native-agreement","owner":"native-ly","description":"✅ Make sure the user has read the agreement","archived":false,"fork":false,"pushed_at":"2023-02-03T15:05:23.000Z","size":3138,"stargazers_count":1,"open_issues_count":20,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-15T03:19:21.758Z","etag":null,"topics":["agree","agreement","android","component","confirm","content","contract","expo","ios","mobile","policy","position","react","react-native","read","scroll","web"],"latest_commit_sha":null,"homepage":"https://snack.expo.io/@jbiesiada/native-agreement","language":"TypeScript","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/native-ly.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-11-15T16:39:44.000Z","updated_at":"2021-12-18T15:18:43.000Z","dependencies_parsed_at":"2023-02-06T06:47:11.074Z","dependency_job_id":null,"html_url":"https://github.com/native-ly/native-agreement","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-agreement","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-agreement/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-agreement/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-agreement/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/native-ly","download_url":"https://codeload.github.com/native-ly/native-agreement/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247958710,"owners_count":21024821,"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":["agree","agreement","android","component","confirm","content","contract","expo","ios","mobile","policy","position","react","react-native","read","scroll","web"],"created_at":"2024-11-05T11:15:46.678Z","updated_at":"2025-12-30T23:06:03.683Z","avatar_url":"https://github.com/native-ly.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [Native Agreement](https://github.com/native-ly/native-agreement)\n\n[![NPM version](https://flat.badgen.net/npm/v/native-agreement)](https://www.npmjs.com/package/native-agreement)\n[![NPM downloads](https://flat.badgen.net/npm/dm/native-agreement)](https://www.npmjs.com/package/native-agreement)\n[![NPM license](https://flat.badgen.net/npm/license/native-agreement)](https://www.npmjs.com/package/native-agreement)\n[![run in expo snack](https://img.shields.io/badge/Run%20in%20Snack-4630EB?style=flat-square\u0026logo=EXPO\u0026labelColor=FFF\u0026logoColor=000)](https://snack.expo.io/@jbiesiada/native-agreement)\n[![Codecov](https://flat.badgen.net/codecov/c/github/native-ly/native-agreement)](https://codecov.io/gh/native-ly/native-agreement)\n[![Travis](https://flat.badgen.net/travis/native-ly/native-agreement)](https://app.travis-ci.com/github/native-ly/native-agreement)\n[![Bundle size](https://flat.badgen.net/packagephobia/install/native-agreement)](https://packagephobia.com/result?p=native-agreement)\n\n## About\n\nA React Native component that allows you to display different footers depending on the scroll position of the content section, e.g. if you want to display agreement, you will be able to render another button or disable it until the user read (scroll to bottom) the contract section.\n\n## How to Install\n\nFirst, install the library in your project by npm:\n\n```sh\n$ npm install native-agreement\n```\n\nOr Yarn:\n\n```sh\n$ yarn add native-agreement\n```\n\n## Getting Started\n\n**Connect the library with the project using ES6 import:**\n\n```js\nimport NativeAgreement from 'native-agreement'\n```\n\n## Options\n\nProps extends [ViewProps](https://reactnative.dev/docs/view#props)\n\n\u003c!-- TODO add defaults --\u003e\n\n| Name                 | Type                                                             | Description                                                 |\n| -------------------- | ---------------------------------------------------------------- | ----------------------------------------------------------- |\n| **renderHeader**     | (read: boolean) =\u003e React.ReactNode                               | Function to render component inside the header              |\n| **renderContent**    | (read: boolean) =\u003e React.ReactNode                               | Function to render component inside the scroll section      |\n| **renderFooter**     | (read: boolean) =\u003e React.ReactNode                               | Function to render component inside the footer              |\n| **headerComponent**  | React.ReactNode                                                  | Component to be rendered inside the header                  |\n| **contentComponent** | React.ReactNode                                                  | Component to be rendered inside the scroll section          |\n| **children**         | React.ReactNode                                                  | Children component to be rendered inside the scroll section |\n| **headerProps**      | [ViewProps](https://reactnative.dev/docs/view#props)             | Props for the header                                        |\n| **contentProps**     | [ScrollViewProps](https://reactnative.dev/docs/scrollview#props) | Props for the scroll section                                |\n| **footerProps**      | [ViewProps](https://reactnative.dev/docs/view#props)             | Props for the footer                                        |\n| **onRead**           | () =\u003e void                                                       | Callback on agreement read                                  |\n| **onReadChange**     | (read: boolean) =\u003e void                                          | Callback on read value change                               |\n| **isRead**           | boolean                                                          | Set and reset read value from outside the component         |\n\n## Example\n\n```js\nimport React, { useState } from 'react'\nimport { View, Text, Button } from 'react-native'\nimport NativeAgreement from 'native-agreement'\n\nconst App = () =\u003e {\n  const [agreed, setAgreed] = useState(false)\n\n  const headerRenderer = () =\u003e (\n    \u003cView\u003e\n      \u003cText\u003eAgreement\u003c/Text\u003e\n    \u003c/View\u003e\n  )\n\n  return (\n    \u003cNativeAgreement\n      renderHeader={headerRenderer}\n      contentComponent={\u003cText\u003eVery long text here...\u003c/Text\u003e}\n      renderFooter={(read) =\u003e (\n        \u003cButton onPress={() =\u003e setAgreed(true)} disabled={!read}\u003e\n          Agree\n        \u003c/Button\u003e\n      )}\n    /\u003e\n  )\n}\n\nexport default App\n```\n\n## License\n\nThis project is licensed under the MIT License © 2020-present Jakub Biesiada\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnative-ly%2Fnative-agreement","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnative-ly%2Fnative-agreement","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnative-ly%2Fnative-agreement/lists"}