{"id":4501,"url":"https://github.com/srfaytkn/react-native-form-validator","last_synced_at":"2025-08-04T01:32:30.694Z","repository":{"id":57341188,"uuid":"162828438","full_name":"srfaytkn/react-native-form-validator","owner":"srfaytkn","description":"A simple validation library for react native","archived":false,"fork":false,"pushed_at":"2020-08-11T17:39:06.000Z","size":20,"stargazers_count":14,"open_issues_count":1,"forks_count":6,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-05T00:35:02.147Z","etag":null,"topics":["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":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/srfaytkn.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":"2018-12-22T17:00:37.000Z","updated_at":"2023-12-13T04:57:49.000Z","dependencies_parsed_at":"2022-09-02T22:23:26.150Z","dependency_job_id":null,"html_url":"https://github.com/srfaytkn/react-native-form-validator","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/srfaytkn/react-native-form-validator","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srfaytkn%2Freact-native-form-validator","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srfaytkn%2Freact-native-form-validator/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srfaytkn%2Freact-native-form-validator/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srfaytkn%2Freact-native-form-validator/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/srfaytkn","download_url":"https://codeload.github.com/srfaytkn/react-native-form-validator/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srfaytkn%2Freact-native-form-validator/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268636394,"owners_count":24282083,"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","status":"online","status_checked_at":"2025-08-03T02:00:12.545Z","response_time":2577,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["react-native"],"created_at":"2024-01-05T20:17:14.504Z","updated_at":"2025-08-04T01:32:30.442Z","avatar_url":"https://github.com/srfaytkn.png","language":"JavaScript","funding_links":[],"categories":["Components"],"sub_categories":["Forms"],"readme":"# react-native-form-validator\n\n[![npm version](https://badge.fury.io/js/react-native-validation.svg)](https://badge.fury.io/js/react-native-validation)\n\nA simple validation library for react native\n\n## Installation\n\nRun: `$ npm i react-native-validation --save`\n\n### Validators:\n+ matchRegexp\n+ isEmail\n+ isEmpty\n+ required\n+ isNumber\n+ isFloat\n+ isPositive\n+ maxNumber\n+ minNumber\n+ maxFloat\n+ minFloat\n+ isString\n+ minStringLength\n+ maxStringLength\n\nExample Component:\n````javascript\n\u003cValidationComponent\n  component={\n    \u003cRkTextInput\n      rkType=\"bordered\"\n      style={{ width: \"100%\" }}\n      placeholder=\"You can type a description\"\n      value={description}\n      onChangeText={value =\u003e this.setState({ description: value })}\n    /\u003e\n  }\n  validators={[\"required\",\"maxNumber:255\"]}\n  errorMessages={[\"this field is required\", \"must be max 255\"]}\n/\u003e\n````\n\n### Usage\n\n````javascript\nimport { ValidationForm, ValidationComponent } from \"react-native-validator\";\n\nconstructor(props, context) {\n  super(props, context);\n  ValidationComponent.setDefaultErrorMessageStyle({\n    color: \"white\",\n    fontSize: 12,\n  });\n}\n\nrender() {   \n    return (\n      \u003cValidationForm\n        style={style.container}\n        ref={ref =\u003e (this.form = ref)}\n        onSubmit={() =\u003e this.props.saveUserList()}\n        onError={() =\u003e console.log(\"houston we have a problem\")}\n      \u003e\n        \u003cValidationComponent\n          component={\n            \u003cRkTextInput\n              rkType=\"bordered\"\n              style={{ width: \"100%\" }}\n              placeholder=\"List Name\"\n              value={name}\n              onChangeText={value =\u003e this.setState({ name: value.trim() })}\n            /\u003e\n          }\n          validators={[\"required\", \"isEmail\"]}\n          errorMessages={[\"this field is required\", \"email is not valid\"]}\n        /\u003e\n        \u003cValidationComponent\n          component={\n            \u003cTextInput\n              style={{ width: \"100%\" }}\n              placeholder=\"You can type a description\"\n              value={description}\n              onChangeText={value =\u003e this.setState({ description: value })}\n            /\u003e\n          }\n          errorMessageStyle={{\n            color: \"red\"\n          }}\n          validators={[\"required\"]}\n          errorMessages={[\"this field is required\"]}\n        /\u003e\n        \u003cRkButton rkType=\"primary xlarge\" onPress={() =\u003e this.form.validate()}\u003e\n          Next\n        \u003c/RkButton\u003e\n      \u003c/ValidationForm\u003e\n    );\n}\n...\n````\n\n#### You can add your own rules\n````javascript\n// validators={[\"isPasswordMatch:param1:param2\"]}\nValidationForm.addValidationRule('isPasswordMatch', (value, param1, param2...) =\u003e {\n    if (value !== this.state.user.password) {\n        return false;\n    }\n    return true;\n});\n````\n\n#### You can set default error style\n````javascript\nconstructor(props, context) {\n  super(props, context);\n  ValidationComponent.setDefaultErrorMessageStyle({\n    color: \"white\",\n  });\n}\n````\n\n### API\n\n#### ValidationForm\n\n+ Props\n\n| Prop            | Required | Type     | Default value | Description                                                                                                                  |\n|-----------------|----------|----------|---------------|-------------------------------------|\n| onSubmit        | true     | function |               | triggered if form is valid          |\n| onError         | false    | function |               | triggered if form is not valid      |\n\n+ Methods\n\n| Name             | Params | Return | Descriptipon                                       |\n|------------------|--------|--------|----------------------------------------------------|\n| validate         |        |        | Check form is valid                                |\n| isValid          |        |  bool  | return current validation state                    |\n\n#### ValidationComponent\n\n+ Props\n\n| Prop              | Required | Type     | Default value | Description                                                                            |\n|-------------------|----------|----------|---------------|----------------------------------------------------------------------------------------|\n| validators        | true     | array    |               | Array of validators.                                                                   |\n| errorMessages     | true     | array    |               | Array of error messages. Must be in the same order as validation                       |\n| errorMessageStyle | false    | object   |               | Error textComponent style                                                              |\n| component         | true     | object   |               | Input component(Must include value prop)                                               |\n| style             | false    | object   |               | Container style props                                                                  |\n\n+ Methods\n\n| Name                         | Params            | Return | Descriptipon                                                                         |\n|------------------------------|-------------------|--------|--------------------------------------------------------------------------------------|\n| setDefaultErrorMessageStyle  |   styleObject     |        | Set default style for error textComponent                                            |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrfaytkn%2Freact-native-form-validator","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsrfaytkn%2Freact-native-form-validator","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrfaytkn%2Freact-native-form-validator/lists"}