{"id":29066998,"url":"https://github.com/byteakp/validux","last_synced_at":"2026-03-03T00:39:52.329Z","repository":{"id":294171604,"uuid":"986151700","full_name":"byteakp/validux","owner":"byteakp","description":"A lightweight, flexible form validation hook for React applications.","archived":false,"fork":false,"pushed_at":"2025-05-19T08:32:25.000Z","size":14,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-03T18:43:07.805Z","etag":null,"topics":["nodejs","react","web-development"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/validux","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/byteakp.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,"zenodo":null}},"created_at":"2025-05-19T07:27:51.000Z","updated_at":"2025-05-23T07:42:45.000Z","dependencies_parsed_at":"2025-05-20T00:01:32.931Z","dependency_job_id":null,"html_url":"https://github.com/byteakp/validux","commit_stats":null,"previous_names":["byteakp/use-form-validator","byteakp/validux"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/byteakp/validux","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/byteakp%2Fvalidux","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/byteakp%2Fvalidux/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/byteakp%2Fvalidux/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/byteakp%2Fvalidux/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/byteakp","download_url":"https://codeload.github.com/byteakp/validux/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/byteakp%2Fvalidux/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30027634,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-03T00:31:48.536Z","status":"ssl_error","status_checked_at":"2026-03-03T00:30:56.176Z","response_time":60,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["nodejs","react","web-development"],"created_at":"2025-06-27T10:10:08.695Z","updated_at":"2026-03-03T00:39:52.300Z","avatar_url":"https://github.com/byteakp.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# validux\n\nA lightweight, flexible form validation hook for React applications.\n\n## Features\n\n- 🪶 **Lightweight**: Small bundle size with zero dependencies\n- 🔄 **Flexible**: Works with any form structure\n- ⚡ **Powerful**: Built-in validators and support for custom validators\n- 🎯 **Simple API**: Easy to integrate with existing forms\n- 📝 **TypeScript Support**: Includes type definitions\n- 🔍 **Async Validation**: Support for asynchronous validators\n- 💪 **Extensible**: Create custom validators easily\n\n## Installation\n\n```bash\nnpm install validux\n# or\nyarn add validux\n```\n\n## Basic Usage\n\n```jsx\nimport React from 'react';\nimport useFormValidator from 'validux';\n\nfunction LoginForm() {\n  const {\n    values,\n    errors,\n    touched,\n    isSubmitting,\n    handleChange,\n    handleBlur,\n    handleSubmit,\n    getFieldProps,\n  } = useFormValidator(\n    // Initial values\n    {\n      email: '',\n      password: '',\n    },\n    // Validation schema\n    {\n      email: ['required', 'email'],\n      password: ['required', { validator: 'minLength', params: [8], message: 'Password must be at least 8 characters' }],\n    }\n  );\n\n  const onSubmit = async (formValues) =\u003e {\n    // Submit logic here\n    console.log('Form submitted with values:', formValues);\n    await new Promise(resolve =\u003e setTimeout(resolve, 1000));\n    alert('Login successful!');\n  };\n\n  return (\n    \u003cform onSubmit={handleSubmit(onSubmit)}\u003e\n      \u003cdiv\u003e\n        \u003clabel htmlFor=\"email\"\u003eEmail\u003c/label\u003e\n        \u003cinput\n          type=\"email\"\n          id=\"email\"\n          {...getFieldProps('email')}\n        /\u003e\n        {touched.email \u0026\u0026 errors.email \u0026\u0026 (\n          \u003cdiv\u003e{errors.email}\u003c/div\u003e\n        )}\n      \u003c/div\u003e\n\n      \u003cdiv\u003e\n        \u003clabel htmlFor=\"password\"\u003ePassword\u003c/label\u003e\n        \u003cinput\n          type=\"password\"\n          id=\"password\"\n          {...getFieldProps('password')}\n        /\u003e\n        {touched.password \u0026\u0026 errors.password \u0026\u0026 (\n          \u003cdiv\u003e{errors.password}\u003c/div\u003e\n        )}\n      \u003c/div\u003e\n\n      \u003cbutton type=\"submit\" disabled={isSubmitting}\u003e\n        {isSubmitting ? 'Logging in...' : 'Login'}\n      \u003c/button\u003e\n    \u003c/form\u003e\n  );\n}\n```\n\n## API Reference\n\n### `useFormValidator(initialValues, validationSchema, options)`\n\nThe main hook that provides form validation.\n\n#### Parameters\n\n- `initialValues` (Object): The initial values of the form\n- `validationSchema` (Object): The validation rules for each field\n- `options` (Object, optional): Additional configuration options\n  - `validateOnChange` (Boolean, default: `true`): Whether to validate fields on change\n  - `validateOnBlur` (Boolean, default: `true`): Whether to validate fields on blur\n  - `validateOnSubmit` (Boolean, default: `true`): Whether to validate all fields on submit\n  - `customValidators` (Object, default: `{}`): Custom validators\n\n#### Returns\n\n- `values` (Object): Current form values\n- `errors` (Object): Validation errors for each field\n- `touched` (Object): Indicates which fields have been touched\n- `isSubmitting` (Boolean): Whether the form is currently submitting\n- `isValid` (Boolean): Whether the form is valid (no errors)\n- `handleChange` (Function): Change handler for inputs\n- `handleBlur` (Function): Blur handler for inputs\n- `handleSubmit` (Function): Submit handler for form\n- `setValue` (Function): Set a field value programmatically\n- `resetForm` (Function): Reset the form to its initial values\n- `validateForm` (Function): Validate all form fields\n- `getFieldProps` (Function): Get props for a field (name, value, onChange, onBlur)\n\n## Validation Schema\n\nThe validation schema defines the validation rules for each field. You can specify validation rules in several ways:\n\n### String (Built-in Validator)\n\n```js\n{\n  email: 'email',\n  username: 'required'\n}\n```\n\n### Array of Rules\n\n```js\n{\n  password: [\n    'required', \n    { validator: 'minLength', params: [8], message: 'Password must be at least 8 characters' }\n  ]\n}\n```\n\n### Custom Function\n\n```js\n{\n  confirmPassword: (value, values) =\u003e value === values.password ? '' : 'Passwords do not match'\n}\n```\n\n### Object with Validator, Params, and Message\n\n```js\n{\n  age: { validator: 'min', params: [18], message: 'You must be at least 18 years old' }\n}\n```\n\n## Built-in Validators\n\n- `required`: Field must not be empty\n- `email`: Field must be a valid email address\n- `minLength`: Field must have at least a minimum length\n- `maxLength`: Field must have at most a maximum length\n- `pattern`: Field must match a regex pattern\n- `number`: Field must be a number\n- `min`: Field must be at least a minimum value\n- `max`: Field must be at most a maximum value\n- `url`: Field must be a valid URL\n- `date`: Field must be a valid date\n\n## Custom Validators\n\nYou can create custom validators in two ways:\n\n### Using `createValidator`\n\n```js\nimport { createValidator } from 'validux';\n\nconst isEven = createValidator(\n  value =\u003e parseInt(value) % 2 === 0,\n  'Value must be an even number'\n);\n\n// Use in schema\n{\n  number: isEven\n}\n```\n\n### Using Custom Validators Option\n\n```js\nconst customValidators = {\n  strongPassword: (value) =\u003e {\n    if (!value) return '';\n    \n    const hasUpperCase = /[A-Z]/.test(value);\n    const hasLowerCase = /[a-z]/.test(value);\n    const hasNumbers = /\\d/.test(value);\n    const hasSpecialChar = /[!@#$%^\u0026*(),.?\":{}|\u003c\u003e]/.test(value);\n    \n    if (!(hasUpperCase \u0026\u0026 hasLowerCase \u0026\u0026 hasNumbers \u0026\u0026 hasSpecialChar)) {\n      return 'Password must contain uppercase, lowercase, number, and special character';\n    }\n    \n    return '';\n  }\n};\n\n// Use in hook options\nuseFormValidator(initialValues, validationSchema, { customValidators });\n\n// Then in schema\n{\n  password: 'strongPassword'\n}\n```\n\n## Async Validation\n\nYou can use async validators for checking values against an API:\n\n```js\nconst customValidators = {\n  uniqueUsername: async (value) =\u003e {\n    if (!value) return '';\n    \n    try {\n      const response = await fetch(`/api/check-username?username=${value}`);\n      const data = await response.json();\n      \n      return data.isAvailable ? '' : 'Username is already taken';\n    } catch (error) {\n      console.error('Username validation error:', error);\n      return 'Failed to validate username';\n    }\n  }\n};\n```\n\n## Examples\n\nCheck out the [examples](./examples) directory for more complete examples:\n\n- [Basic Login Form](./examples/basic-form/LoginForm.jsx)\n- [Advanced Registration Form](./examples/advanced-form/RegistrationForm.jsx)\n\n## License\n\nMIT","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbyteakp%2Fvalidux","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbyteakp%2Fvalidux","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbyteakp%2Fvalidux/lists"}