@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.
1 lines • 3.91 kB
Source Map (JSON)
{"version":3,"sources":["../../src/rhf/index.ts","../../src/rhf/useFieldArray.ts"],"sourcesContent":["export * from './useFieldArray';\n","import {\n type FieldArray,\n type FieldArrayPath,\n type FieldValues,\n set,\n useFieldArray as useFieldArrayOriginal,\n type UseFieldArrayProps as UseFieldArrayPropsOriginal,\n type UseFieldArrayReturn,\n} from 'react-hook-form';\n\nimport type { LensCore } from '../LensCore';\n\ninterface UseFieldArrayProps<\n TFieldValues extends FieldValues = FieldValues,\n TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>,\n TKeyName extends string = 'id',\n> extends UseFieldArrayPropsOriginal<TFieldValues, TFieldArrayName, TKeyName> {\n lens?: LensCore;\n}\n\nexport function useFieldArray<\n TFieldValues extends FieldValues = FieldValues,\n TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>,\n TKeyName extends string = 'id',\n>(props: UseFieldArrayProps<TFieldValues, TFieldArrayName, TKeyName>): UseFieldArrayReturn<TFieldValues, TFieldArrayName, TKeyName> {\n const result = useFieldArrayOriginal(props);\n\n const transformOnSet = (value: FieldArray<TFieldValues, TFieldArrayName>) => {\n if (!props.lens || !props.lens.settings.lensesMap || !value) {\n return value;\n }\n\n const newValue = {} as typeof value;\n\n Object.entries(value || {}).forEach(([key, value]) => {\n // @ts-expect-error temporal workaround for array lense reflection\n const restructuredLens = props.lens.settings.lensesMap?.[0]?.[key];\n const newKey = restructuredLens?.settings.propPath?.slice(`${props.lens?.settings.restructureSourcePath}.`.length);\n set(newValue, newKey, value);\n });\n\n return newValue;\n };\n\n return {\n ...result,\n prepend: (value, options) => {\n const newValue = Array.isArray(value) ? value.map(transformOnSet) : transformOnSet(value);\n result.prepend(newValue, options);\n },\n append: (value, options) => {\n const newValue = Array.isArray(value) ? value.map(transformOnSet) : transformOnSet(value);\n result.append(newValue, options);\n },\n insert: (index, value, options) => {\n const newValue = Array.isArray(value) ? value.map(transformOnSet) : transformOnSet(value);\n result.insert(index, newValue, options);\n },\n update: (index, value) => {\n const newValue = transformOnSet(value);\n result.update(index, newValue);\n },\n replace: (value) => {\n const newValue = Array.isArray(value) ? value.map(transformOnSet) : transformOnSet(value);\n result.replace(newValue);\n },\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,6BAQO;AAYA,SAAS,cAId,OAAkI;AAClI,QAAM,aAAS,uBAAAA,eAAsB,KAAK;AAE1C,QAAM,iBAAiB,CAAC,UAAqD;AAC3E,QAAI,CAAC,MAAM,QAAQ,CAAC,MAAM,KAAK,SAAS,aAAa,CAAC,OAAO;AAC3D,aAAO;AAAA,IACT;AAEA,UAAM,WAAW,CAAC;AAElB,WAAO,QAAQ,SAAS,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,KAAKC,MAAK,MAAM;AAlC1D;AAoCM,YAAM,oBAAmB,iBAAM,KAAK,SAAS,cAApB,mBAAgC,OAAhC,mBAAqC;AAC9D,YAAM,UAAS,0DAAkB,SAAS,aAA3B,mBAAqC,MAAM,IAAG,WAAM,SAAN,mBAAY,SAAS,qBAAqB,IAAI;AAC3G,sCAAI,UAAU,QAAQA,MAAK;AAAA,IAC7B,CAAC;AAED,WAAO;AAAA,EACT;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS,CAAC,OAAO,YAAY;AAC3B,YAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,MAAM,IAAI,cAAc,IAAI,eAAe,KAAK;AACxF,aAAO,QAAQ,UAAU,OAAO;AAAA,IAClC;AAAA,IACA,QAAQ,CAAC,OAAO,YAAY;AAC1B,YAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,MAAM,IAAI,cAAc,IAAI,eAAe,KAAK;AACxF,aAAO,OAAO,UAAU,OAAO;AAAA,IACjC;AAAA,IACA,QAAQ,CAAC,OAAO,OAAO,YAAY;AACjC,YAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,MAAM,IAAI,cAAc,IAAI,eAAe,KAAK;AACxF,aAAO,OAAO,OAAO,UAAU,OAAO;AAAA,IACxC;AAAA,IACA,QAAQ,CAAC,OAAO,UAAU;AACxB,YAAM,WAAW,eAAe,KAAK;AACrC,aAAO,OAAO,OAAO,QAAQ;AAAA,IAC/B;AAAA,IACA,SAAS,CAAC,UAAU;AAClB,YAAM,WAAW,MAAM,QAAQ,KAAK,IAAI,MAAM,IAAI,cAAc,IAAI,eAAe,KAAK;AACxF,aAAO,QAAQ,QAAQ;AAAA,IACzB;AAAA,EACF;AACF;","names":["useFieldArrayOriginal","value"]}