@hookform/lenses
Version:
Type-safe lenses for React Hook Form that enable precise control over nested form state. Build reusable form components with composable operations, array handling, and full TypeScript support.
59 lines • 1.9 kB
JavaScript
// src/rhf/useFieldArray.ts
import { useMemo } from "react";
import {
useFieldArray as useFieldArrayOriginal
} from "react-hook-form";
function useFieldArray(props) {
const original = useFieldArrayOriginal(props);
const newFields = useMemo(() => {
if (!props.getTransformer) {
return original.fields;
}
return original.fields.map(props.getTransformer);
}, [original.fields, props.getTransformer]);
return {
fields: newFields,
move: original.move,
remove: original.remove,
swap: original.swap,
prepend: (value, options) => {
if (!props.setTransformer) {
return original.prepend(value, options);
}
const newValue = Array.isArray(value) ? value.map(props.setTransformer) : props.setTransformer(value);
original.prepend(newValue, options);
},
append: (value, options) => {
if (!props.setTransformer) {
return original.append(value, options);
}
const newValue = Array.isArray(value) ? value.map(props.setTransformer) : props.setTransformer(value);
original.append(newValue, options);
},
insert: (index, value, options) => {
if (!props.setTransformer) {
return original.insert(index, value, options);
}
const newValue = Array.isArray(value) ? value.map(props.setTransformer) : props.setTransformer(value);
original.insert(index, newValue, options);
},
update: (index, value) => {
if (!props.setTransformer) {
return original.update(index, value);
}
const newValue = props.setTransformer(value);
original.update(index, newValue);
},
replace: (value) => {
if (!props.setTransformer) {
return original.replace(value);
}
const newValue = props.setTransformer(value);
original.replace(newValue);
}
};
}
export {
useFieldArray
};
//# sourceMappingURL=index.js.map