@modular-forms/solid/dist/source/components/FieldArray.jsx

The modular and type-safe form library for SolidJS

import { createMemo, mergeProps } from 'solid-js';
import { createLifecycle } from '../primitives';
import { initializeFieldArrayStore } from '../utils';
/**
 * Headless field array that provides reactive properties and state.
 */
export function FieldArray(props) {
    // Get store of specified field array
    const getFieldArray = createMemo(() => initializeFieldArrayStore(props.of, props.name));
    // Create lifecycle of field array
    // eslint-disable-next-line solid/reactivity
    createLifecycle(mergeProps({ getStore: getFieldArray }, props));
    return (<>
      {props.children({
            get name() {
                return props.name;
            },
            get items() {
                return getFieldArray().items.get();
            },
            get error() {
                return getFieldArray().error.get();
            },
            get active() {
                return getFieldArray().active.get();
            },
            get touched() {
                return getFieldArray().touched.get();
            },
            get dirty() {
                return getFieldArray().dirty.get();
            },
        })}
    </>);
}