@conform-to/react 1.8.1 → 1.9.0

package/dist/future/index.d.ts

@@ -1,4 +1,5 @@
-export { unstable_isDirty as isDirty } from '@conform-to/dom';
-export { useControl, useFormData } from './hooks';
-export type { Control } from './hooks';
+export type { FormValue, FormError } from '@conform-to/dom/future';
+export { parseSubmission, report, isDirty } from '@conform-to/dom/future';
+export type { Control, FormOptions, Fieldset, DefaultValue } from './types';
+export { FormProvider, useControl, useField, useForm, useFormData, useFormMetadata, useIntent, } from './hooks';
 //# sourceMappingURL=index.d.ts.map

package/dist/future/index.js

@@ -2,14 +2,27 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var dom = require('@conform-to/dom');
+var future = require('@conform-to/dom/future');
 var hooks = require('./hooks.js');
 
 
 
 Object.defineProperty(exports, 'isDirty', {
 	enumerable: true,
-	get: function () { return dom.unstable_isDirty; }
+	get: function () { return future.isDirty; }
 });
+Object.defineProperty(exports, 'parseSubmission', {
+	enumerable: true,
+	get: function () { return future.parseSubmission; }
+});
+Object.defineProperty(exports, 'report', {
+	enumerable: true,
+	get: function () { return future.report; }
+});
+exports.FormProvider = hooks.FormProvider;
 exports.useControl = hooks.useControl;
+exports.useField = hooks.useField;
+exports.useForm = hooks.useForm;
 exports.useFormData = hooks.useFormData;
+exports.useFormMetadata = hooks.useFormMetadata;
+exports.useIntent = hooks.useIntent;

package/dist/future/index.mjs

@@ -1,2 +1,2 @@
-export { unstable_isDirty as isDirty } from '@conform-to/dom';
-export { useControl, useFormData } from './hooks.mjs';
+export { isDirty, parseSubmission, report } from '@conform-to/dom/future';
+export { FormProvider, useControl, useField, useForm, useFormData, useFormMetadata, useIntent } from './hooks.mjs';

package/dist/future/intent.d.ts

@@ -0,0 +1,35 @@
+import type { FormValue, Submission } from '@conform-to/dom/future';
+import type { ActionHandler, IntentDispatcher, UnknownIntent } from './types';
+/**
+ * Serializes intent to string format: "type" or "type(payload)".
+ */
+export declare function serializeIntent<Intent extends UnknownIntent = UnknownIntent>(intent: Intent): string;
+/**
+ * Parses serialized intent string back to intent object.
+ */
+export declare function deserializeIntent(value: string): UnknownIntent;
+/**
+ * Applies intent transformation to submission payload.
+ * Returns modified payload or null for reset intent.
+ */
+export declare function applyIntent(submission: Submission, options?: {
+    handlers?: Record<string, ActionHandler>;
+}): Record<string, FormValue> | null;
+export declare function insertItem<Item>(list: Array<Item>, item: Item, index: number): void;
+export declare function removeItem(list: Array<unknown>, index: number): void;
+export declare function reorderItems(list: Array<unknown>, fromIndex: number, toIndex: number): void;
+/**
+ * Updates list keys by removing child keys and optionally transforming remaining keys.
+ */
+export declare function updateListKeys(keys: Record<string, string[]> | undefined, keyToBeRemoved: string, updateKey?: (key: string) => string | null): Record<string, string[]>;
+/**
+ * Built-in action handlers for form intents:
+ * - reset: clears form data
+ * - validate: marks fields as touched for validation display
+ * - update: updates specific field values
+ * - insert/remove/reorder: manages array field operations
+ */
+export declare const actionHandlers: {
+    [Type in keyof IntentDispatcher]: IntentDispatcher[Type] extends (payload: any) => void ? ActionHandler<IntentDispatcher[Type]> : never;
+};
+//# sourceMappingURL=intent.d.ts.map

package/dist/future/intent.js

@@ -0,0 +1,305 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.js');
+var future = require('@conform-to/dom/future');
+var util = require('./util.js');
+var state = require('./state.js');
+
+/**
+ * Serializes intent to string format: "type" or "type(payload)".
+ */
+function serializeIntent(intent) {
+  if (!intent.payload) {
+    return intent.type;
+  }
+  return "".concat(intent.type, "(").concat(JSON.stringify(intent.payload), ")");
+}
+
+/**
+ * Parses serialized intent string back to intent object.
+ */
+function deserializeIntent(value) {
+  var type = value;
+  var payload;
+  var serializedPayload;
+  var openParenIndex = value.indexOf('(');
+  if (openParenIndex > 0 && value[value.length - 1] === ')') {
+    type = value.slice(0, openParenIndex);
+    serializedPayload = value.slice(openParenIndex + 1, -1);
+  }
+  if (serializedPayload) {
+    try {
+      payload = JSON.parse(serializedPayload);
+    } catch (_unused) {
+      // Ignore the error
+    }
+  }
+  return {
+    type,
+    payload
+  };
+}
+
+/**
+ * Applies intent transformation to submission payload.
+ * Returns modified payload or null for reset intent.
+ */
+function applyIntent(submission, options) {
+  var _options$handlers, _handler$validatePayl, _handler$validatePayl2;
+  if (!submission.intent) {
+    return submission.payload;
+  }
+  var intent = deserializeIntent(submission.intent);
+  var handlers = (_options$handlers = options === null || options === void 0 ? void 0 : options.handlers) !== null && _options$handlers !== void 0 ? _options$handlers : actionHandlers;
+  var handler = handlers[intent.type];
+  if (handler && handler.onApply && ((_handler$validatePayl = (_handler$validatePayl2 = handler.validatePayload) === null || _handler$validatePayl2 === void 0 ? void 0 : _handler$validatePayl2.call(handler, intent.payload)) !== null && _handler$validatePayl !== void 0 ? _handler$validatePayl : true)) {
+    return handler.onApply(submission.payload, intent.payload);
+  }
+  return submission.payload;
+}
+function insertItem(list, item, index) {
+  list.splice(index, 0, item);
+}
+function removeItem(list, index) {
+  list.splice(index, 1);
+}
+function reorderItems(list, fromIndex, toIndex) {
+  list.splice(toIndex, 0, ...list.splice(fromIndex, 1));
+}
+
+/**
+ * Updates list keys by removing child keys and optionally transforming remaining keys.
+ */
+function updateListKeys() {
+  var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var keyToBeRemoved = arguments.length > 1 ? arguments[1] : undefined;
+  var updateKey = arguments.length > 2 ? arguments[2] : undefined;
+  var basePath = future.getPathSegments(keyToBeRemoved);
+  return util.transformKeys(keys, field => {
+    var _updateKey;
+    return future.getRelativePath(field, basePath) !== null ? null : (_updateKey = updateKey === null || updateKey === void 0 ? void 0 : updateKey(field)) !== null && _updateKey !== void 0 ? _updateKey : field;
+  });
+}
+
+/**
+ * Built-in action handlers for form intents:
+ * - reset: clears form data
+ * - validate: marks fields as touched for validation display
+ * - update: updates specific field values
+ * - insert/remove/reorder: manages array field operations
+ */
+var actionHandlers = {
+  reset: {
+    onApply() {
+      return null;
+    }
+  },
+  validate: {
+    validatePayload(name) {
+      return util.isOptional(name, util.isString);
+    },
+    onUpdate(state, _ref) {
+      var _intent$payload;
+      var {
+        submission,
+        intent,
+        error
+      } = _ref;
+      var name = (_intent$payload = intent.payload) !== null && _intent$payload !== void 0 ? _intent$payload : '';
+      var basePath = future.getPathSegments(name);
+      var touchedFields = util.appendUniqueItem(state.touchedFields, name);
+      for (var field of submission.fields) {
+        // Add all child fields to the touched fields too
+        if (future.getRelativePath(field, basePath) !== null) {
+          touchedFields = util.appendUniqueItem(touchedFields, field);
+        }
+      }
+
+      // We couldn't find out all the fields from the FormData, e.g. unchecked checkboxes.
+      // or fieldsets without any fields, but we can at least include missing
+      // required fields based on the form error
+      if (name === '' && error) {
+        for (var _name of Object.keys(error.fieldErrors)) {
+          touchedFields = util.appendUniqueItem(touchedFields, _name);
+        }
+      }
+      return util.merge(state, {
+        touchedFields
+      });
+    }
+  },
+  update: {
+    validatePayload(options) {
+      return future.isPlainObject(options) && util.isOptional(options.name, util.isString) && util.isOptional(options.index, util.isNumber) && !util.isUndefined(options.value);
+    },
+    onApply(value, options) {
+      return util.updateValueAtPath(value, future.appendPathSegment(options.name, options.index), options.value);
+    },
+    onUpdate(state, _ref2) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref2;
+      var listKeys = state.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        // TODO: Do we really need to update the keys here?
+        var name = future.appendPathSegment(intent.payload.name, intent.payload.index);
+        // Remove all child keys
+        listKeys = name === '' ? {} : updateListKeys(state.listKeys, name);
+      }
+      var basePath = future.getPathSegments(intent.payload.name);
+      var touchedFields = state.touchedFields;
+      for (var field of submission.fields) {
+        if (basePath.length === 0 || future.getRelativePath(field, basePath) !== null) {
+          touchedFields = util.appendUniqueItem(touchedFields, field);
+        }
+      }
+      return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
+        listKeys,
+        touchedFields
+      });
+    }
+  },
+  insert: {
+    validatePayload(options) {
+      return future.isPlainObject(options) && util.isString(options.name) && util.isOptional(options.index, util.isNumber);
+    },
+    onApply(value, options) {
+      var _options$index;
+      var list = Array.from(util.getArrayAtPath(value, options.name));
+      insertItem(list, options.defaultValue, (_options$index = options.index) !== null && _options$index !== void 0 ? _options$index : list.length);
+      return util.updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state$1, _ref3) {
+      var _intent$payload$index;
+      var {
+        type,
+        submission,
+        intent
+      } = _ref3;
+      var currentValue = submission.payload;
+      var list = util.getArrayAtPath(currentValue, intent.payload.name);
+      var index = (_intent$payload$index = intent.payload.index) !== null && _intent$payload$index !== void 0 ? _intent$payload$index : list.length;
+      var updateListIndex = util.createPathIndexUpdater(intent.payload.name, currentIndex => index <= currentIndex ? currentIndex + 1 : currentIndex);
+      var touchedFields = util.appendUniqueItem(util.compactMap(state$1.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state$1.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten;
+        var listKeys = Array.from((_state$listKeys$inten = state$1.listKeys[intent.payload.name]) !== null && _state$listKeys$inten !== void 0 ? _state$listKeys$inten : state.getDefaultListKey(state$1.resetKey, currentValue, intent.payload.name));
+        insertItem(listKeys, util.generateUniqueKey(), index);
+        keys = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, updateListKeys(state$1.listKeys, future.appendPathSegment(intent.payload.name, index), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state$1), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  },
+  remove: {
+    validatePayload(options) {
+      return future.isPlainObject(options) && util.isString(options.name) && util.isNumber(options.index);
+    },
+    onApply(value, options) {
+      var list = Array.from(util.getArrayAtPath(value, options.name));
+      removeItem(list, options.index);
+      return util.updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state$1, _ref4) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref4;
+      var currentValue = submission.payload;
+      var updateListIndex = util.createPathIndexUpdater(intent.payload.name, currentIndex => {
+        if (intent.payload.index === currentIndex) {
+          return null;
+        }
+        return intent.payload.index < currentIndex ? currentIndex - 1 : currentIndex;
+      });
+      var touchedFields = util.appendUniqueItem(util.compactMap(state$1.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state$1.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten2;
+        var listKeys = Array.from((_state$listKeys$inten2 = state$1.listKeys[intent.payload.name]) !== null && _state$listKeys$inten2 !== void 0 ? _state$listKeys$inten2 : state.getDefaultListKey(state$1.resetKey, currentValue, intent.payload.name));
+        removeItem(listKeys, intent.payload.index);
+        keys = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, updateListKeys(state$1.listKeys, future.appendPathSegment(intent.payload.name, intent.payload.index), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state$1), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  },
+  reorder: {
+    validatePayload(options) {
+      return future.isPlainObject(options) && util.isString(options.name) && util.isNumber(options.from) && util.isNumber(options.to);
+    },
+    onApply(value, options) {
+      var list = Array.from(util.getArrayAtPath(value, options.name));
+      reorderItems(list, options.from, options.to);
+      return util.updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state$1, _ref5) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref5;
+      var currentValue = submission.payload;
+      var updateListIndex = util.createPathIndexUpdater(intent.payload.name, currentIndex => {
+        if (intent.payload.from === intent.payload.to) {
+          return currentIndex;
+        }
+        if (currentIndex === intent.payload.from) {
+          return intent.payload.to;
+        }
+        if (intent.payload.from < intent.payload.to) {
+          return currentIndex > intent.payload.from && currentIndex <= intent.payload.to ? currentIndex - 1 : currentIndex;
+        }
+        return currentIndex >= intent.payload.to && currentIndex < intent.payload.from ? currentIndex + 1 : currentIndex;
+      });
+      var touchedFields = util.appendUniqueItem(util.compactMap(state$1.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state$1.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten3;
+        var listKeys = Array.from((_state$listKeys$inten3 = state$1.listKeys[intent.payload.name]) !== null && _state$listKeys$inten3 !== void 0 ? _state$listKeys$inten3 : state.getDefaultListKey(state$1.resetKey, currentValue, intent.payload.name));
+        reorderItems(listKeys, intent.payload.from, intent.payload.to);
+        keys = _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, updateListKeys(state$1.listKeys, future.appendPathSegment(intent.payload.name, intent.payload.from), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state$1), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  }
+};
+
+exports.actionHandlers = actionHandlers;
+exports.applyIntent = applyIntent;
+exports.deserializeIntent = deserializeIntent;
+exports.insertItem = insertItem;
+exports.removeItem = removeItem;
+exports.reorderItems = reorderItems;
+exports.serializeIntent = serializeIntent;
+exports.updateListKeys = updateListKeys;

package/dist/future/intent.mjs

@@ -0,0 +1,294 @@
+import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.mjs';
+import { getPathSegments, getRelativePath, isPlainObject, appendPathSegment } from '@conform-to/dom/future';
+import { isOptional, appendUniqueItem, merge, isUndefined, updateValueAtPath, isString, getArrayAtPath, createPathIndexUpdater, compactMap, generateUniqueKey, isNumber, transformKeys } from './util.mjs';
+import { getDefaultListKey } from './state.mjs';
+
+/**
+ * Serializes intent to string format: "type" or "type(payload)".
+ */
+function serializeIntent(intent) {
+  if (!intent.payload) {
+    return intent.type;
+  }
+  return "".concat(intent.type, "(").concat(JSON.stringify(intent.payload), ")");
+}
+
+/**
+ * Parses serialized intent string back to intent object.
+ */
+function deserializeIntent(value) {
+  var type = value;
+  var payload;
+  var serializedPayload;
+  var openParenIndex = value.indexOf('(');
+  if (openParenIndex > 0 && value[value.length - 1] === ')') {
+    type = value.slice(0, openParenIndex);
+    serializedPayload = value.slice(openParenIndex + 1, -1);
+  }
+  if (serializedPayload) {
+    try {
+      payload = JSON.parse(serializedPayload);
+    } catch (_unused) {
+      // Ignore the error
+    }
+  }
+  return {
+    type,
+    payload
+  };
+}
+
+/**
+ * Applies intent transformation to submission payload.
+ * Returns modified payload or null for reset intent.
+ */
+function applyIntent(submission, options) {
+  var _options$handlers, _handler$validatePayl, _handler$validatePayl2;
+  if (!submission.intent) {
+    return submission.payload;
+  }
+  var intent = deserializeIntent(submission.intent);
+  var handlers = (_options$handlers = options === null || options === void 0 ? void 0 : options.handlers) !== null && _options$handlers !== void 0 ? _options$handlers : actionHandlers;
+  var handler = handlers[intent.type];
+  if (handler && handler.onApply && ((_handler$validatePayl = (_handler$validatePayl2 = handler.validatePayload) === null || _handler$validatePayl2 === void 0 ? void 0 : _handler$validatePayl2.call(handler, intent.payload)) !== null && _handler$validatePayl !== void 0 ? _handler$validatePayl : true)) {
+    return handler.onApply(submission.payload, intent.payload);
+  }
+  return submission.payload;
+}
+function insertItem(list, item, index) {
+  list.splice(index, 0, item);
+}
+function removeItem(list, index) {
+  list.splice(index, 1);
+}
+function reorderItems(list, fromIndex, toIndex) {
+  list.splice(toIndex, 0, ...list.splice(fromIndex, 1));
+}
+
+/**
+ * Updates list keys by removing child keys and optionally transforming remaining keys.
+ */
+function updateListKeys() {
+  var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var keyToBeRemoved = arguments.length > 1 ? arguments[1] : undefined;
+  var updateKey = arguments.length > 2 ? arguments[2] : undefined;
+  var basePath = getPathSegments(keyToBeRemoved);
+  return transformKeys(keys, field => {
+    var _updateKey;
+    return getRelativePath(field, basePath) !== null ? null : (_updateKey = updateKey === null || updateKey === void 0 ? void 0 : updateKey(field)) !== null && _updateKey !== void 0 ? _updateKey : field;
+  });
+}
+
+/**
+ * Built-in action handlers for form intents:
+ * - reset: clears form data
+ * - validate: marks fields as touched for validation display
+ * - update: updates specific field values
+ * - insert/remove/reorder: manages array field operations
+ */
+var actionHandlers = {
+  reset: {
+    onApply() {
+      return null;
+    }
+  },
+  validate: {
+    validatePayload(name) {
+      return isOptional(name, isString);
+    },
+    onUpdate(state, _ref) {
+      var _intent$payload;
+      var {
+        submission,
+        intent,
+        error
+      } = _ref;
+      var name = (_intent$payload = intent.payload) !== null && _intent$payload !== void 0 ? _intent$payload : '';
+      var basePath = getPathSegments(name);
+      var touchedFields = appendUniqueItem(state.touchedFields, name);
+      for (var field of submission.fields) {
+        // Add all child fields to the touched fields too
+        if (getRelativePath(field, basePath) !== null) {
+          touchedFields = appendUniqueItem(touchedFields, field);
+        }
+      }
+
+      // We couldn't find out all the fields from the FormData, e.g. unchecked checkboxes.
+      // or fieldsets without any fields, but we can at least include missing
+      // required fields based on the form error
+      if (name === '' && error) {
+        for (var _name of Object.keys(error.fieldErrors)) {
+          touchedFields = appendUniqueItem(touchedFields, _name);
+        }
+      }
+      return merge(state, {
+        touchedFields
+      });
+    }
+  },
+  update: {
+    validatePayload(options) {
+      return isPlainObject(options) && isOptional(options.name, isString) && isOptional(options.index, isNumber) && !isUndefined(options.value);
+    },
+    onApply(value, options) {
+      return updateValueAtPath(value, appendPathSegment(options.name, options.index), options.value);
+    },
+    onUpdate(state, _ref2) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref2;
+      var listKeys = state.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        // TODO: Do we really need to update the keys here?
+        var name = appendPathSegment(intent.payload.name, intent.payload.index);
+        // Remove all child keys
+        listKeys = name === '' ? {} : updateListKeys(state.listKeys, name);
+      }
+      var basePath = getPathSegments(intent.payload.name);
+      var touchedFields = state.touchedFields;
+      for (var field of submission.fields) {
+        if (basePath.length === 0 || getRelativePath(field, basePath) !== null) {
+          touchedFields = appendUniqueItem(touchedFields, field);
+        }
+      }
+      return _objectSpread2(_objectSpread2({}, state), {}, {
+        listKeys,
+        touchedFields
+      });
+    }
+  },
+  insert: {
+    validatePayload(options) {
+      return isPlainObject(options) && isString(options.name) && isOptional(options.index, isNumber);
+    },
+    onApply(value, options) {
+      var _options$index;
+      var list = Array.from(getArrayAtPath(value, options.name));
+      insertItem(list, options.defaultValue, (_options$index = options.index) !== null && _options$index !== void 0 ? _options$index : list.length);
+      return updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state, _ref3) {
+      var _intent$payload$index;
+      var {
+        type,
+        submission,
+        intent
+      } = _ref3;
+      var currentValue = submission.payload;
+      var list = getArrayAtPath(currentValue, intent.payload.name);
+      var index = (_intent$payload$index = intent.payload.index) !== null && _intent$payload$index !== void 0 ? _intent$payload$index : list.length;
+      var updateListIndex = createPathIndexUpdater(intent.payload.name, currentIndex => index <= currentIndex ? currentIndex + 1 : currentIndex);
+      var touchedFields = appendUniqueItem(compactMap(state.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten;
+        var listKeys = Array.from((_state$listKeys$inten = state.listKeys[intent.payload.name]) !== null && _state$listKeys$inten !== void 0 ? _state$listKeys$inten : getDefaultListKey(state.resetKey, currentValue, intent.payload.name));
+        insertItem(listKeys, generateUniqueKey(), index);
+        keys = _objectSpread2(_objectSpread2({}, updateListKeys(state.listKeys, appendPathSegment(intent.payload.name, index), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _objectSpread2(_objectSpread2({}, state), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  },
+  remove: {
+    validatePayload(options) {
+      return isPlainObject(options) && isString(options.name) && isNumber(options.index);
+    },
+    onApply(value, options) {
+      var list = Array.from(getArrayAtPath(value, options.name));
+      removeItem(list, options.index);
+      return updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state, _ref4) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref4;
+      var currentValue = submission.payload;
+      var updateListIndex = createPathIndexUpdater(intent.payload.name, currentIndex => {
+        if (intent.payload.index === currentIndex) {
+          return null;
+        }
+        return intent.payload.index < currentIndex ? currentIndex - 1 : currentIndex;
+      });
+      var touchedFields = appendUniqueItem(compactMap(state.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten2;
+        var listKeys = Array.from((_state$listKeys$inten2 = state.listKeys[intent.payload.name]) !== null && _state$listKeys$inten2 !== void 0 ? _state$listKeys$inten2 : getDefaultListKey(state.resetKey, currentValue, intent.payload.name));
+        removeItem(listKeys, intent.payload.index);
+        keys = _objectSpread2(_objectSpread2({}, updateListKeys(state.listKeys, appendPathSegment(intent.payload.name, intent.payload.index), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _objectSpread2(_objectSpread2({}, state), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  },
+  reorder: {
+    validatePayload(options) {
+      return isPlainObject(options) && isString(options.name) && isNumber(options.from) && isNumber(options.to);
+    },
+    onApply(value, options) {
+      var list = Array.from(getArrayAtPath(value, options.name));
+      reorderItems(list, options.from, options.to);
+      return updateValueAtPath(value, options.name, list);
+    },
+    onUpdate(state, _ref5) {
+      var {
+        type,
+        submission,
+        intent
+      } = _ref5;
+      var currentValue = submission.payload;
+      var updateListIndex = createPathIndexUpdater(intent.payload.name, currentIndex => {
+        if (intent.payload.from === intent.payload.to) {
+          return currentIndex;
+        }
+        if (currentIndex === intent.payload.from) {
+          return intent.payload.to;
+        }
+        if (intent.payload.from < intent.payload.to) {
+          return currentIndex > intent.payload.from && currentIndex <= intent.payload.to ? currentIndex - 1 : currentIndex;
+        }
+        return currentIndex >= intent.payload.to && currentIndex < intent.payload.from ? currentIndex + 1 : currentIndex;
+      });
+      var touchedFields = appendUniqueItem(compactMap(state.touchedFields, updateListIndex), intent.payload.name);
+      var keys = state.listKeys;
+
+      // Update the keys only for client updates to avoid double updates if there is no client validation
+      if (type === 'client') {
+        var _state$listKeys$inten3;
+        var listKeys = Array.from((_state$listKeys$inten3 = state.listKeys[intent.payload.name]) !== null && _state$listKeys$inten3 !== void 0 ? _state$listKeys$inten3 : getDefaultListKey(state.resetKey, currentValue, intent.payload.name));
+        reorderItems(listKeys, intent.payload.from, intent.payload.to);
+        keys = _objectSpread2(_objectSpread2({}, updateListKeys(state.listKeys, appendPathSegment(intent.payload.name, intent.payload.from), updateListIndex)), {}, {
+          // Update existing list keys
+          [intent.payload.name]: listKeys
+        });
+      }
+      return _objectSpread2(_objectSpread2({}, state), {}, {
+        listKeys: keys,
+        touchedFields
+      });
+    }
+  }
+};
+
+export { actionHandlers, applyIntent, deserializeIntent, insertItem, removeItem, reorderItems, serializeIntent, updateListKeys };