Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/manojadams/metaforms-core
A framework for building react form libraries.
https://github.com/manojadams/metaforms-core
forms react react-form-library react-forms
Last synced: 22 days ago
JSON representation
A framework for building react form libraries.
- Host: GitHub
- URL: https://github.com/manojadams/metaforms-core
- Owner: manojadams
- License: mit
- Created: 2022-08-12T18:05:01.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-04-12T21:21:16.000Z (10 months ago)
- Last Synced: 2024-04-14T07:09:28.210Z (10 months ago)
- Topics: forms, react, react-form-library, react-forms
- Language: TypeScript
- Homepage: https://manojadams.github.io/metaforms-core/
- Size: 1.35 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# metaform-core
A framework for building react form libraries. Create your react form components and use this framework for adding form behavior using JSON-based schema.
## Change logs
- [fix #88: fix validation errors with autofill](https://github.com/manojadams/metaforms-core/issues/88)
## Introduction
This library reads the JSON-based schema and lays out beautiful forms.
It acts as a base for creating a dynamic form library.
## Main features
- Layouting configuration
- Support for multiple-page forms
- Support for field dependencies
- Support custom components
## Core components/concepts
- Form control (BaseFormControl)
- Form group (BaseFormGroup)
- Form stepper (BaseFormStepper)
### Form control (BaseFormControl)
This is a class containing declarations of basic form controls as well as some other advanced form controls.
### Form group (BaseFormGroup)
Contains declarations of basic form grouping controls.
### Form stepper (BasicFormStepper)
This is another type of form grouping that contains declarations to implement stepper functionalities for your form.
## How to use
This library contains abstract declarations and requires the user to implement his own core components.
- BasicFormControl - for basic components
- BasicFormGroup - for basic form grouping
- BasicFormStepper = for stepper functionalities
- Write your classes (typescript) and extend the above controls.
- To know details, check the documentation.
## Implement an `email` control
````typescript
class MyFormControl extends CoreFormControl {
/**
* Implement email
*/
email() {
return (
Email address
)
}
}
````
## Implement a `phone` control
````typescript
class MyFormControl extends CoreFormControl {
/**
* Implement phone
*/
phone() {
return (
Your Phone
)
}
}
````
## Install
```bash
npm install --save @manojadams/metaform-core
```
## Basic usage of the library
```tsx
import MetaformRenderer from "@manojadams/metaforms-core";
import React from "react";
import FormControl from "./forms/FormControl"; // your form control implementation
import FormGroup from "./forms/FormGroup"; // your form group implementation
import { FormStepper } from "./forms/FormStepper"; // your form stepper implementation
class FormRenderer extends React.Component {
constructor(props: IFormRenderer) {
super(props);
}
render() {
return (
)
}
}
export default FormRenderer;
```
## License
MIT © [manojadams](https://github.com/manojadams)