Custom Array Form

[pgtoopx]

Hi, I am trying to make a custom array and arrayItem, because in my work I am required to use adminlte and I wanted to try this library, which forced me to make all the custom components, but I can not understand how to make an Array and an Array item, I have days and I do not have a clear idea. Might you help me? more specifically with GenField

[bmv437]

Hey there @pgtoopx,

This library comes with some default field types and components built in, including array and arrayItem types.

Here's where you can find the code for all the default field types:
https://github.com/isobar-us/redux-form-gen/tree/v0.11.0/src/defaultFieldTypes

Code for array and arrayItem implementations:
arrayType
GenArray

arrayItemType
GenArrayItem

If you're looking to just extend one of the built in field types instead of having to implement it from scratch, you can do using function composition like this:

import { defaultFieldTypes } from '@isobar-us/redux-form-gen';
import MyArrayComponent from './MyArrayComponent'; // your custom array component

const { arrayType: defaultArrayType } = defaultFieldTypes;

// your arrayType implementation
const arrayType = (options) => {
	return {
		...defaultArrayType(options),
		component: MyArrayComponent // your custom array component
	}
}

//...

// mapping the type string (key) to the type definition (value)
const customFieldTypes = {
  array: arrayType
};

If you have experience with redux-form, this library is used to generate fields for use with redux-form. For example, the array type uses the FieldArray under the hood, and you pass in a component prop just like you do in redux-form.

If you want me to go into more detail let me know what specific questions you have. Also, if you have an example of some code where you are stuck, you can create a codesandbox based on one of our templates here: Code Sandbox Templates. Then you can link to it in this issue. It really helps to have an example of what's not exactly clear. Thanks!