@tanstack/form-core 1.25.0 → 1.27.0

package/src/metaHelper.ts

@@ -6,7 +6,7 @@ import type {
 import type { AnyFieldMeta } from './FieldApi'
 import type { DeepKeys } from './util-types'
 
-type ArrayFieldMode = 'insert' | 'remove' | 'swap' | 'move'
+type ValueFieldMode = 'insert' | 'remove' | 'swap' | 'move'
 
 export const defaultFieldMeta: AnyFieldMeta = {
   isValidating: false,
@@ -33,7 +33,7 @@ export function metaHelper<
   TOnDynamic extends undefined | FormValidateOrFn<TFormData>,
   TOnDynamicAsync extends undefined | FormAsyncValidateOrFn<TFormData>,
   TOnServer extends undefined | FormAsyncValidateOrFn<TFormData>,
-  TSubmitMeta,
+  TSubmitMeta = never,
 >(
   formApi: FormApi<
     TFormData,
@@ -50,57 +50,148 @@ export function metaHelper<
     TSubmitMeta
   >,
 ) {
-  function handleArrayFieldMetaShift(
+  /**
+   * Handle the meta shift caused from moving a field from one index to another.
+   */
+  function handleArrayMove(
     field: DeepKeys<TFormData>,
-    index: number,
-    mode: ArrayFieldMode,
-    secondIndex?: number,
+    fromIndex: number,
+    toIndex: number,
   ) {
-    const affectedFields = getAffectedFields(field, index, mode, secondIndex)
-
-    const handlers = {
-      insert: () => handleInsertMode(affectedFields, field, index),
-      remove: () => handleRemoveMode(affectedFields),
-      swap: () =>
-        secondIndex !== undefined &&
-        handleSwapMode(affectedFields, field, index, secondIndex),
-      move: () =>
-        secondIndex !== undefined &&
-        handleMoveMode(affectedFields, field, index, secondIndex),
+    const affectedFields = getAffectedFields(field, fromIndex, 'move', toIndex)
+
+    const startIndex = Math.min(fromIndex, toIndex)
+    const endIndex = Math.max(fromIndex, toIndex)
+    for (let i = startIndex; i <= endIndex; i++) {
+      affectedFields.push(getFieldPath(field, i))
     }
 
-    handlers[mode]()
+    // Store the original field meta that will be reapplied at the destination index
+    const fromFields = Object.keys(formApi.fieldInfo).reduce(
+      (fieldMap, fieldKey) => {
+        if (fieldKey.startsWith(getFieldPath(field, fromIndex))) {
+          fieldMap.set(
+            fieldKey as DeepKeys<TFormData>,
+            formApi.getFieldMeta(fieldKey as DeepKeys<TFormData>),
+          )
+        }
+        return fieldMap
+      },
+      new Map<DeepKeys<TFormData>, AnyFieldMeta | undefined>(),
+    )
+
+    shiftMeta(affectedFields, fromIndex < toIndex ? 'up' : 'down')
+
+    // Reapply the stored field meta at the destination index
+    Object.keys(formApi.fieldInfo)
+      .filter((fieldKey) => fieldKey.startsWith(getFieldPath(field, toIndex)))
+      .forEach((fieldKey) => {
+        const fromKey = fieldKey.replace(
+          getFieldPath(field, toIndex),
+          getFieldPath(field, fromIndex),
+        ) as DeepKeys<TFormData>
+
+        const fromMeta = fromFields.get(fromKey)
+        if (fromMeta) {
+          formApi.setFieldMeta(fieldKey as DeepKeys<TFormData>, fromMeta)
+        }
+      })
+  }
+
+  /**
+   * Handle the meta shift from removing a field at the specified index.
+   */
+  function handleArrayRemove(field: DeepKeys<TFormData>, index: number) {
+    const affectedFields = getAffectedFields(field, index, 'remove')
+
+    shiftMeta(affectedFields, 'up')
+  }
+
+  /**
+   * Handle the meta shift from swapping two fields at the specified indeces.
+   */
+  function handleArraySwap(
+    field: DeepKeys<TFormData>,
+    index: number,
+    secondIndex: number,
+  ) {
+    const affectedFields = getAffectedFields(field, index, 'swap', secondIndex)
+
+    affectedFields.forEach((fieldKey) => {
+      if (!fieldKey.toString().startsWith(getFieldPath(field, index))) {
+        return
+      }
+
+      const swappedKey = fieldKey
+        .toString()
+        .replace(
+          getFieldPath(field, index),
+          getFieldPath(field, secondIndex),
+        ) as DeepKeys<TFormData>
+
+      const [meta1, meta2] = [
+        formApi.getFieldMeta(fieldKey),
+        formApi.getFieldMeta(swappedKey),
+      ]
+
+      if (meta1) formApi.setFieldMeta(swappedKey, meta1)
+      if (meta2) formApi.setFieldMeta(fieldKey, meta2)
+    })
+  }
+
+  /**
+   * Handle the meta shift from inserting a field at the specified index.
+   */
+  function handleArrayInsert(field: DeepKeys<TFormData>, insertIndex: number) {
+    const affectedFields = getAffectedFields(field, insertIndex, 'insert')
+
+    shiftMeta(affectedFields, 'down')
+
+    affectedFields.forEach((fieldKey) => {
+      if (fieldKey.toString().startsWith(getFieldPath(field, insertIndex))) {
+        formApi.setFieldMeta(fieldKey, getEmptyFieldMeta())
+      }
+    })
   }
 
-  function getFieldPath(field: DeepKeys<TFormData>, index: number): string {
-    return `${field}[${index}]`
+  function getFieldPath(
+    field: DeepKeys<TFormData>,
+    index: number,
+  ): DeepKeys<TFormData> {
+    return `${field}[${index}]` as DeepKeys<TFormData>
   }
 
   function getAffectedFields(
     field: DeepKeys<TFormData>,
     index: number,
-    mode: ArrayFieldMode,
+    mode: ValueFieldMode,
     secondIndex?: number,
   ): DeepKeys<TFormData>[] {
     const affectedFieldKeys = [getFieldPath(field, index)]
 
-    if (mode === 'swap') {
-      affectedFieldKeys.push(getFieldPath(field, secondIndex!))
-    } else if (mode === 'move') {
-      const [startIndex, endIndex] = [
-        Math.min(index, secondIndex!),
-        Math.max(index, secondIndex!),
-      ]
-      for (let i = startIndex; i <= endIndex; i++) {
-        affectedFieldKeys.push(getFieldPath(field, i))
+    switch (mode) {
+      case 'swap':
+        affectedFieldKeys.push(getFieldPath(field, secondIndex!))
+        break
+      case 'move': {
+        const [startIndex, endIndex] = [
+          Math.min(index, secondIndex!),
+          Math.max(index, secondIndex!),
+        ]
+        for (let i = startIndex; i <= endIndex; i++) {
+          affectedFieldKeys.push(getFieldPath(field, i))
+        }
+        break
       }
-    } else {
-      const currentValue = formApi.getFieldValue(field)
-      const fieldItems = Array.isArray(currentValue)
-        ? (currentValue as Array<unknown>).length
-        : 0
-      for (let i = index + 1; i < fieldItems; i++) {
-        affectedFieldKeys.push(getFieldPath(field, i))
+      default: {
+        const currentValue = formApi.getFieldValue(field)
+        const fieldItems = Array.isArray(currentValue)
+          ? (currentValue as Array<unknown>).length
+          : 0
+        for (let i = index + 1; i < fieldItems; i++) {
+          affectedFieldKeys.push(getFieldPath(field, i))
+        }
+        break
       }
     }
 
@@ -137,85 +228,10 @@ export function metaHelper<
 
   const getEmptyFieldMeta = (): AnyFieldMeta => defaultFieldMeta
 
-  const handleInsertMode = (
-    fields: DeepKeys<TFormData>[],
-    field: DeepKeys<TFormData>,
-    insertIndex: number,
-  ) => {
-    shiftMeta(fields, 'down')
-
-    fields.forEach((fieldKey) => {
-      if (fieldKey.toString().startsWith(getFieldPath(field, insertIndex))) {
-        formApi.setFieldMeta(fieldKey, getEmptyFieldMeta())
-      }
-    })
+  return {
+    handleArrayMove,
+    handleArrayRemove,
+    handleArraySwap,
+    handleArrayInsert,
   }
-
-  const handleRemoveMode = (fields: DeepKeys<TFormData>[]) => {
-    shiftMeta(fields, 'up')
-  }
-
-  const handleMoveMode = (
-    fields: DeepKeys<TFormData>[],
-    field: DeepKeys<TFormData>,
-    fromIndex: number,
-    toIndex: number,
-  ) => {
-    // Store the original field meta that will be reapplied at the destination index
-    const fromFields = new Map(
-      Object.keys(formApi.fieldInfo)
-        .filter((fieldKey) =>
-          fieldKey.startsWith(getFieldPath(field, fromIndex)),
-        )
-        .map((fieldKey) => [
-          fieldKey as DeepKeys<TFormData>,
-          formApi.getFieldMeta(fieldKey as DeepKeys<TFormData>),
-        ]),
-    )
-
-    shiftMeta(fields, fromIndex < toIndex ? 'up' : 'down')
-
-    // Reapply the stored field meta at the destination index
-    Object.keys(formApi.fieldInfo)
-      .filter((fieldKey) => fieldKey.startsWith(getFieldPath(field, toIndex)))
-      .forEach((fieldKey) => {
-        const fromKey = fieldKey.replace(
-          getFieldPath(field, toIndex),
-          getFieldPath(field, fromIndex),
-        ) as DeepKeys<TFormData>
-
-        const fromMeta = fromFields.get(fromKey)
-        if (fromMeta) {
-          formApi.setFieldMeta(fieldKey as DeepKeys<TFormData>, fromMeta)
-        }
-      })
-  }
-
-  const handleSwapMode = (
-    fields: DeepKeys<TFormData>[],
-    field: DeepKeys<TFormData>,
-    index: number,
-    secondIndex: number,
-  ) => {
-    fields.forEach((fieldKey) => {
-      if (!fieldKey.toString().startsWith(getFieldPath(field, index))) return
-
-      const swappedKey = fieldKey
-        .toString()
-        .replace(
-          getFieldPath(field, index),
-          getFieldPath(field, secondIndex),
-        ) as DeepKeys<TFormData>
-
-      const [meta1, meta2] = [
-        formApi.getFieldMeta(fieldKey),
-        formApi.getFieldMeta(swappedKey),
-      ]
-
-      if (meta1) formApi.setFieldMeta(swappedKey, meta1)
-      if (meta2) formApi.setFieldMeta(fieldKey, meta2)
-    })
-  }
-
-  return { handleArrayFieldMetaShift }
 }

package/src/utils.ts

@@ -31,9 +31,9 @@ export function functionalUpdate<TInput, TOutput = TInput>(
  * Get a value from an object using a path, including dot notation.
  * @private
  */
-export function getBy(obj: any, path: any) {
+export function getBy(obj: unknown, path: string | (string | number)[]): any {
   const pathObj = makePathArray(path)
-  return pathObj.reduce((current: any, pathPart: any) => {
+  return pathObj.reduce((current: any, pathPart) => {
     if (current === null) return null
     if (typeof current !== 'undefined') {
       return current[pathPart]
@@ -108,7 +108,10 @@ export function deleteBy(obj: any, _path: any) {
 
     const key = path.shift()
 
-    if (typeof key === 'string') {
+    if (
+      typeof key === 'string' ||
+      (typeof key === 'number' && !Array.isArray(parent))
+    ) {
       if (typeof parent === 'object') {
         return {
           ...parent,