@dnb/eufemia 10.15.0 → 10.16.0

package/cjs/extensions/forms/hooks/useDataValue.js

@@ -27,27 +27,39 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function useDataValue(props) {
   var _this = this,
-    _props$path,
-    _ref2,
-    _props$autoComplete;
+    _ref3,
+    _props$autoComplete,
+    _props$path;
   const {
     path,
-    elementPath,
+    itemPath,
     emptyValue,
     required,
     error: errorProp,
+    errorMessages,
     onFocus,
     onBlur,
     onChange,
-    validator,
     onBlurValidator,
+    validator,
     schema,
-    errorMessages,
     validateInitially,
     validateUnchanged,
     continuousValidation,
     toInput = value => value,
-    fromInput = value => value
+    fromInput = value => value,
+    toEvent = value => value,
+    fromExternal = value => value,
+    validateRequired = (value, _ref) => {
+      let {
+        emptyValue,
+        required
+      } = _ref;
+      const res = required && (value === emptyValue || typeof emptyValue === 'undefined' && value === '') ? new _types.FormError('The value is required', {
+        validationRule: 'required'
+      }) : undefined;
+      return res;
+    }
   } = props;
   const [, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
   const {
@@ -60,8 +72,16 @@ function useDataValue(props) {
   const dataContext = (0, _react.useContext)(_DataContext.Context);
   const fieldBlockContext = (0, _react.useContext)(_FieldBlockContext.default);
   const iterateElementContext = (0, _react.useContext)(_IterateElementContext.default);
+  const transformers = (0, _react.useRef)({
+    toInput,
+    fromInput,
+    toEvent,
+    fromExternal,
+    validateRequired
+  });
   const {
     handlePathChange: dataContextHandlePathChange,
+    updateDataValue: dataContextUpdateDataValue,
     setValueWithError: dataContextSetValueWithError,
     errors: dataContextErrors
   } = dataContext !== null && dataContext !== void 0 ? dataContext : {};
@@ -80,24 +100,28 @@ function useDataValue(props) {
   if (path && path.substring(0, 1) !== '/') {
     throw new Error('Invalid path. Data value path JSON Pointers must be from root (starting with a /).');
   }
-  if (elementPath && elementPath.substring(0, 1) !== '/') {
-    throw new Error('Invalid elementPath. Element pathJSON Pointers must be from root of iterate element (starting with a /).');
+  if (itemPath && itemPath.substring(0, 1) !== '/') {
+    throw new Error('Invalid itemPath. Item pathJSON Pointers must be from root of iterate element (starting with a /).');
   }
-  if (elementPath && !iterateElementContext) {
-    throw new Error('elementPath cannot be used when not inside an iterate element context. Wrap the component in an Iterate.Loop.');
+  if (itemPath && !iterateElementContext) {
+    throw new Error('itemPath cannot be used when not inside an iterate element context. Wrap the component in an Iterate.Loop.');
   }
   const identifier = (0, _react.useMemo)(() => {
     return path !== null && path !== void 0 ? path : id;
   }, [path, id]);
   const externalValue = (0, _react.useMemo)(() => {
     if (props.value !== undefined) {
-      return props.value;
+      let value = transformers.current.fromExternal(props.value);
+      if (props.capitalize) {
+        value = (0, _componentHelper.toCapitalized)(String(value || ''));
+      }
+      return value;
     }
-    if (inIterate && elementPath) {
-      if (elementPath === '/') {
+    if (inIterate && itemPath) {
+      if (itemPath === '/') {
         return iterateElementValue;
       }
-      return _jsonPointer.default.has(iterateElementValue, elementPath) ? _jsonPointer.default.get(iterateElementValue, elementPath) : undefined;
+      return _jsonPointer.default.has(iterateElementValue, itemPath) ? _jsonPointer.default.get(iterateElementValue, itemPath) : undefined;
     }
     if (dataContext.data && path) {
       if (path === '/') {
@@ -106,7 +130,7 @@ function useDataValue(props) {
       return _jsonPointer.default.has(dataContext.data, path) ? _jsonPointer.default.get(dataContext.data, path) : undefined;
     }
     return undefined;
-  }, [path, elementPath, inIterate, iterateElementValue, props.value, dataContext.data]);
+  }, [props.value, props.capitalize, inIterate, itemPath, dataContext.data, path, iterateElementValue]);
   const valueRef = (0, _react.useRef)(externalValue);
   const changedRef = (0, _react.useRef)(false);
   const hasFocusRef = (0, _react.useRef)(false);
@@ -118,10 +142,6 @@ function useDataValue(props) {
   (0, _react.useEffect)(() => {
     errorMessagesRef.current = errorMessages;
   }, [errorMessages]);
-  const schemaRef = (0, _react.useRef)(schema);
-  (0, _react.useEffect)(() => {
-    schemaRef.current = schema;
-  }, [schema]);
   const validatorRef = (0, _react.useRef)(validator);
   (0, _react.useEffect)(() => {
     validatorRef.current = validator;
@@ -142,8 +162,8 @@ function useDataValue(props) {
     if (error instanceof _types.FormError) {
       var _errorMessagesRef$cur, _error$messageValues;
       const message = typeof error.validationRule === 'string' && ((_errorMessagesRef$cur = errorMessagesRef.current) === null || _errorMessagesRef$cur === void 0 ? void 0 : _errorMessagesRef$cur[error.validationRule]) || error.message;
-      const messageWithValues = Object.entries((_error$messageValues = error.messageValues) !== null && _error$messageValues !== void 0 ? _error$messageValues : {}).reduce((message, _ref) => {
-        let [key, value] = _ref;
+      const messageWithValues = Object.entries((_error$messageValues = error.messageValues) !== null && _error$messageValues !== void 0 ? _error$messageValues : {}).reduce((message, _ref2) => {
+        let [key, value] = _ref2;
         return message.replace(`{${key}}`, value);
       }, message);
       return new _types.FormError(messageWithValues);
@@ -164,10 +184,13 @@ function useDataValue(props) {
   const validateValue = (0, _react.useCallback)(async () => {
     const isProcessActive = startProcess();
     try {
-      if (valueRef.current === emptyValue && required) {
-        throw new _types.FormError('The value is required', {
-          validationRule: 'required'
-        });
+      const requiredError = transformers.current.validateRequired(valueRef.current, {
+        emptyValue,
+        required,
+        isChanged: changedRef.current
+      });
+      if (requiredError instanceof Error) {
+        throw requiredError;
       }
       if (schemaValidatorRef.current && valueRef.current !== undefined && !schemaValidatorRef.current(valueRef.current)) {
         const error = (0, _ajv.ajvErrorsToOneFormError)(schemaValidatorRef.current.errors);
@@ -175,7 +198,7 @@ function useDataValue(props) {
       }
       if (validatorRef.current) {
         var _validatorRef$current;
-        const res = await ((_validatorRef$current = validatorRef.current) === null || _validatorRef$current === void 0 ? void 0 : _validatorRef$current.call(validatorRef, valueRef.current, errorMessages));
+        const res = await ((_validatorRef$current = validatorRef.current) === null || _validatorRef$current === void 0 ? void 0 : _validatorRef$current.call(validatorRef, valueRef.current, errorMessagesRef.current));
         if (res instanceof Error) {
           throw res;
         }
@@ -188,9 +211,10 @@ function useDataValue(props) {
         persistErrorState(error);
       }
     }
-  }, [emptyValue, required, errorMessages, startProcess, persistErrorState, clearErrorState]);
+  }, [startProcess, emptyValue, required, clearErrorState, persistErrorState]);
   (0, _useUpdateEffect.default)(() => {
     if (!schema) {
+      schemaValidatorRef.current = undefined;
       return;
     }
     schemaValidatorRef.current = _ajv.default.compile(schema);
@@ -214,55 +238,77 @@ function useDataValue(props) {
       forceUpdate();
     }
   }, [dataContext.showAllErrors, showError]);
+  (0, _react.useEffect)(() => {
+    if (path && props.value) {
+      const hasValue = _jsonPointer.default.has(dataContext.data, path);
+      const value = hasValue ? _jsonPointer.default.get(dataContext.data, path) : undefined;
+      if (!hasValue || props.value !== value && valueRef.current !== value) {
+        dataContextUpdateDataValue === null || dataContextUpdateDataValue === void 0 ? void 0 : dataContextUpdateDataValue(path, props.value);
+      }
+    }
+  }, [dataContext.data, dataContextUpdateDataValue, path, props.value]);
+  const handleError = (0, _react.useCallback)(() => {
+    if (continuousValidation || continuousValidation !== false && !hasFocusRef.current) {
+      showError();
+    } else {
+      hideError();
+    }
+  }, [continuousValidation, hideError, showError]);
   const setHasFocus = (0, _react.useCallback)((hasFocus, valueOverride) => {
     if (hasFocus) {
       hasFocusRef.current = true;
-      onFocus === null || onFocus === void 0 ? void 0 : onFocus(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current);
+      onFocus === null || onFocus === void 0 ? void 0 : onFocus(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current));
     } else {
       hasFocusRef.current = false;
-      onBlur === null || onBlur === void 0 ? void 0 : onBlur(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current);
+      onBlur === null || onBlur === void 0 ? void 0 : onBlur(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current));
       if (!changedRef.current && !validateUnchanged) {
         return;
       }
       if (typeof onBlurValidator === 'function') {
-        Promise.resolve(onBlurValidator(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current)).then(persistErrorState);
+        Promise.resolve(onBlurValidator(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current))).then(persistErrorState);
       }
       showError();
       forceUpdate();
     }
-  }, [validateUnchanged, onFocus, onBlur, onBlurValidator, persistErrorState, showError, forceUpdate]);
-  const handleFocus = (0, _react.useCallback)(() => setHasFocus(true), [setHasFocus]);
-  const handleBlur = (0, _react.useCallback)(() => setHasFocus(false), [setHasFocus]);
+  }, [onBlur, onBlurValidator, onFocus, persistErrorState, showError, validateUnchanged]);
   const updateValue = (0, _react.useCallback)(newValue => {
     if (newValue === valueRef.current) {
       return;
     }
     valueRef.current = newValue;
-    if (continuousValidation || continuousValidation !== false && !hasFocusRef.current) {
-      showError();
-    } else {
-      hideError();
-    }
     validateValue();
+    handleError();
     if (path) {
       dataContextHandlePathChange === null || dataContextHandlePathChange === void 0 ? void 0 : dataContextHandlePathChange(path, newValue);
     }
     forceUpdate();
-  }, [continuousValidation, dataContextHandlePathChange, hideError, path, showError, validateValue]);
+  }, [dataContextHandlePathChange, handleError, path, validateValue]);
   const handleChange = (0, _react.useCallback)(function (argFromInput) {
     let additionalArgs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
-    const newValue = fromInput(argFromInput);
+    let newValue = transformers.current.fromInput(argFromInput);
     if (newValue === valueRef.current) {
       return;
     }
+    if (props.capitalize) {
+      newValue = (0, _componentHelper.toCapitalized)(String(newValue || ''));
+    }
     updateValue(newValue);
     changedRef.current = true;
-    onChange === null || onChange === void 0 ? void 0 : onChange.apply(_this, typeof additionalArgs !== 'undefined' ? [newValue, additionalArgs] : [newValue]);
-    if (elementPath) {
-      const iterateValuePath = `/${iterateElementIndex}${elementPath && elementPath !== '/' ? elementPath : ''}`;
+    const value = transformers.current.toEvent(newValue);
+    onChange === null || onChange === void 0 ? void 0 : onChange.apply(_this, typeof additionalArgs !== 'undefined' ? [value, additionalArgs] : [value]);
+    if (itemPath) {
+      const iterateValuePath = `/${iterateElementIndex}${itemPath && itemPath !== '/' ? itemPath : ''}`;
       handleIterateElementChange === null || handleIterateElementChange === void 0 ? void 0 : handleIterateElementChange(iterateValuePath, newValue);
     }
-  }, [elementPath, fromInput, handleIterateElementChange, iterateElementIndex, onChange, updateValue]);
+  }, [props.capitalize, updateValue, onChange, itemPath, iterateElementIndex, handleIterateElementChange]);
+  const handleFocus = (0, _react.useCallback)(() => setHasFocus(true), [setHasFocus]);
+  const handleBlur = (0, _react.useCallback)(() => {
+    if (props.trim && /^\s|\s$/.test(String(valueRef.current))) {
+      const value = String(valueRef.current).trim();
+      handleChange(value);
+    }
+    setHasFocus(false);
+  }, [props.trim, setHasFocus, handleChange]);
   (0, _useMountEffect.default)(() => {
     dataContext === null || dataContext === void 0 ? void 0 : dataContext.handleMountField(identifier);
     validateValue();
@@ -273,12 +319,16 @@ function useDataValue(props) {
       dataContext === null || dataContext === void 0 ? void 0 : dataContext.handleUnMountField(identifier);
     };
   });
+  const error = showErrorRef.current ? (_ref3 = errorProp !== null && errorProp !== void 0 ? errorProp : localErrorRef.current) !== null && _ref3 !== void 0 ? _ref3 : contextErrorRef.current : undefined;
   return _objectSpread(_objectSpread({}, props), {}, {
+    autoComplete: (_props$autoComplete = props.autoComplete) !== null && _props$autoComplete !== void 0 ? _props$autoComplete : dataContext.autoComplete === true ? 'on' : 'off',
     id,
     name: props.name || ((_props$path = props.path) === null || _props$path === void 0 ? void 0 : _props$path.replace('/', '')) || id,
-    value: toInput(valueRef.current),
-    error: !inFieldBlock && showErrorRef.current ? (_ref2 = errorProp !== null && errorProp !== void 0 ? errorProp : localErrorRef.current) !== null && _ref2 !== void 0 ? _ref2 : contextErrorRef.current : undefined,
-    autoComplete: (_props$autoComplete = props.autoComplete) !== null && _props$autoComplete !== void 0 ? _props$autoComplete : dataContext.autoComplete === true ? 'on' : 'off',
+    value: transformers.current.toInput(valueRef.current),
+    error: !inFieldBlock ? error : undefined,
+    hasError: Boolean(error),
+    isChanged: changedRef.current,
+    dataContext,
     setHasFocus,
     handleFocus,
     handleBlur,

package/cjs/extensions/forms/hooks/useDataValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDataValue.js","names":["_react","require","_jsonPointer","_interopRequireDefault","_utils","_ajv","_interopRequireWildcard","_types","_DataContext","_FieldBlockContext","_IterateElementContext","_componentHelper","_useMountEffect","_useUpdateEffect","_useProcessManager","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","useDataValue","props","_this","_props$path","_ref2","_props$autoComplete","path","elementPath","emptyValue","required","error","errorProp","onFocus","onBlur","onChange","validator","onBlurValidator","schema","errorMessages","validateInitially","validateUnchanged","continuousValidation","toInput","fromInput","forceUpdate","useReducer","startProcess","useProcessManager","id","useMemo","_props$id","makeUniqueId","dataContext","useContext","Context","fieldBlockContext","FieldBlockContext","iterateElementContext","IterateElementContext","handlePathChange","dataContextHandlePathChange","setValueWithError","dataContextSetValueWithError","errors","dataContextErrors","dataContextError","inFieldBlock","Boolean","setError","setFieldBlockError","setShowError","setShowFieldBlockError","inIterate","index","iterateElementIndex","iterateElementValue","handleChange","handleIterateElementChange","substring","Error","identifier","externalValue","pointer","data","valueRef","useRef","changedRef","hasFocusRef","showErrorInitially","localErrorRef","contextErrorRef","showErrorRef","errorMessagesRef","useEffect","current","schemaRef","validatorRef","schemaValidatorRef","ajv","compile","showError","useCallback","hideError","prepareError","FormError","_errorMessagesRef$cur","_error$messageValues","message","validationRule","messageWithValues","entries","messageValues","reduce","_ref","replace","persistErrorState","errorArg","errorChanged","clearErrorState","validateValue","isProcessActive","ajvErrorsToOneFormError","_validatorRef$current","useUpdateEffect","showAllErrors","setHasFocus","hasFocus","valueOverride","Promise","resolve","then","handleFocus","handleBlur","updateValue","newValue","argFromInput","additionalArgs","iterateValuePath","useMountEffect","handleMountField","handleUnMountField","name","autoComplete"],"sources":["../../../../../src/extensions/forms/hooks/useDataValue.ts"],"sourcesContent":["import {\n  useRef,\n  useEffect,\n  useContext,\n  useCallback,\n  useMemo,\n  useReducer,\n} from 'react'\nimport pointer from 'json-pointer'\nimport { ValidateFunction } from 'ajv'\nimport { errorChanged } from '../utils'\nimport ajv, { ajvErrorsToOneFormError } from '../utils/ajv'\nimport { FormError, FieldProps, AdditionalEventArgs } from '../types'\nimport { Context } from '../DataContext'\nimport FieldBlockContext from '../FieldBlock/FieldBlockContext'\nimport IterateElementContext from '../Iterate/IterateElementContext'\nimport { makeUniqueId } from '../../../shared/component-helper'\nimport useMountEffect from './useMountEffect'\nimport useUpdateEffect from './useUpdateEffect'\nimport useProcessManager from './useProcessManager'\n\ninterface ReturnAdditional<Value> {\n  id: string\n  value: Value\n  error: Error | FormError | undefined\n  setHasFocus: (hasFocus: boolean, valueOverride?: unknown) => void\n  handleFocus: () => void\n  handleBlur: () => void\n  handleChange: FieldProps<unknown>['onChange']\n  updateValue: (value: Value) => void\n  forceUpdate: () => void\n}\n\nexport default function useDataValue<\n  Value = unknown,\n  Props extends FieldProps<Value> = FieldProps<Value>,\n>(props: Props): Props & ReturnAdditional<Value> {\n  const {\n    path,\n    elementPath,\n    emptyValue,\n    required,\n    error: errorProp,\n    onFocus,\n    onBlur,\n    onChange,\n    validator,\n    onBlurValidator,\n    schema,\n    errorMessages,\n    validateInitially,\n    validateUnchanged,\n    continuousValidation,\n    toInput = (value: Value) => value,\n    fromInput = (value: Value) => value,\n  } = props\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  const { startProcess } = useProcessManager()\n  const id = useMemo(() => props.id ?? makeUniqueId(), [props.id])\n  const dataContext = useContext(Context)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const iterateElementContext = useContext(IterateElementContext)\n\n  const {\n    handlePathChange: dataContextHandlePathChange,\n    setValueWithError: dataContextSetValueWithError,\n    errors: dataContextErrors,\n  } = dataContext ?? {}\n  const dataContextError = path ? dataContextErrors?.[path] : undefined\n  const inFieldBlock = Boolean(fieldBlockContext)\n  const {\n    setError: setFieldBlockError,\n    setShowError: setShowFieldBlockError,\n  } = fieldBlockContext ?? {}\n  const inIterate = Boolean(iterateElementContext)\n  const {\n    index: iterateElementIndex,\n    value: iterateElementValue,\n    handleChange: handleIterateElementChange,\n  } = iterateElementContext ?? {}\n\n  if (path && path.substring(0, 1) !== '/') {\n    throw new Error(\n      'Invalid path. Data value path JSON Pointers must be from root (starting with a /).'\n    )\n  }\n  if (elementPath && elementPath.substring(0, 1) !== '/') {\n    throw new Error(\n      'Invalid elementPath. Element pathJSON Pointers must be from root of iterate element (starting with a /).'\n    )\n  }\n  if (elementPath && !iterateElementContext) {\n    throw new Error(\n      'elementPath cannot be used when not inside an iterate element context. Wrap the component in an Iterate.Loop.'\n    )\n  }\n\n  const identifier = useMemo(() => {\n    // Identifier is used is registries of multiple fields, like in the DataContext keeping track of errors\n    return path ?? id\n  }, [path, id])\n\n  const externalValue = useMemo(() => {\n    if (props.value !== undefined) {\n      // Value-prop sent directly to the field has highest priority, overriding any surrounding source\n      return props.value\n    }\n\n    if (inIterate && elementPath) {\n      // This field is inside an iterate, and has a pointer from the base of the element being iterated\n      if (elementPath === '/') {\n        return iterateElementValue\n      }\n\n      return pointer.has(iterateElementValue, elementPath)\n        ? pointer.get(iterateElementValue, elementPath)\n        : undefined\n    }\n\n    if (dataContext.data && path) {\n      // There is a surrounding data context and a path for where in the source to find the data\n      if (path === '/') {\n        return dataContext.data\n      }\n\n      return pointer.has(dataContext.data, path)\n        ? pointer.get(dataContext.data, path)\n        : undefined\n    }\n    return undefined\n  }, [\n    path,\n    elementPath,\n    inIterate,\n    iterateElementValue,\n    props.value,\n    dataContext.data,\n  ])\n\n  // Many variables are kept in refs to avoid triggering unnecessary update loops because updates using\n  // useEffect depend on them (like the external `value`)\n\n  // Hold an internal copy of the input value in case the input component is used uncontrolled,\n  // and to handle errors in Eufemia on components that does not take updated callback functions into account.\n  const valueRef = useRef<Value>(externalValue)\n  const changedRef = useRef<boolean>(false)\n  const hasFocusRef = useRef<boolean>(false)\n\n  // Error handling\n  // - Should errors received through validation be shown initially. Assume that providing a direct prop to\n  // the component means it is supposed to be shown initially.\n  const showErrorInitially = validateInitially || errorProp\n  // - Local errors are errors based on validation instructions received by\n  const localErrorRef = useRef<Error | FormError | undefined>()\n  // - Context errors are from outer contexts, like validation for this field as part of the whole data set\n  const contextErrorRef = useRef<Error | FormError | undefined>(\n    dataContextError\n  )\n\n  const showErrorRef = useRef<boolean>(Boolean(showErrorInitially))\n  const errorMessagesRef = useRef(errorMessages)\n  useEffect(() => {\n    errorMessagesRef.current = errorMessages\n  }, [errorMessages])\n  const schemaRef = useRef(schema)\n  useEffect(() => {\n    schemaRef.current = schema\n  }, [schema])\n  const validatorRef = useRef(validator)\n  useEffect(() => {\n    validatorRef.current = validator\n  }, [validator])\n\n  const schemaValidatorRef = useRef<ValidateFunction>(\n    schema ? ajv.compile(schema) : undefined\n  )\n\n  const showError = useCallback(() => {\n    showErrorRef.current = true\n    setShowFieldBlockError?.(path ?? id, true)\n  }, [path, id, setShowFieldBlockError])\n\n  const hideError = useCallback(() => {\n    showErrorRef.current = false\n    setShowFieldBlockError?.(path ?? id, false)\n  }, [path, id, setShowFieldBlockError])\n\n  /**\n   * Prepare error from validation logic with correct error messages based on props\n   */\n  const prepareError = useCallback(\n    (error: Error | FormError | undefined): FormError | undefined => {\n      if (error === undefined) {\n        return\n      }\n\n      if (error instanceof FormError) {\n        const message =\n          (typeof error.validationRule === 'string' &&\n            errorMessagesRef.current?.[error.validationRule]) ||\n          error.message\n\n        const messageWithValues = Object.entries(\n          error.messageValues ?? {}\n        ).reduce((message, [key, value]) => {\n          return message.replace(`{${key}}`, value)\n        }, message)\n\n        return new FormError(messageWithValues)\n      }\n\n      return error\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    []\n  )\n\n  /**\n   * Based on validation, update error state, locally and relevant surrounding contexts\n   */\n  const persistErrorState = useCallback(\n    (errorArg: FormError | undefined) => {\n      const error = prepareError(errorArg)\n\n      if (!errorChanged(error, localErrorRef.current)) {\n        // In case different triggers lead to validation with no changes in the result (like still no error, or the same error),\n        // avoid unnecessary re-renders by letting the old error object stay in the state and skip re-rendering.\n        return\n      }\n\n      localErrorRef.current = error\n\n      // Tell the data context about the error, so it can stop the user from submitting the form until the error has been fixed\n      dataContextSetValueWithError?.(identifier, Boolean(error))\n\n      setFieldBlockError?.(path ?? id, error)\n      forceUpdate()\n    },\n    [\n      path,\n      identifier,\n      id,\n      prepareError,\n      dataContextSetValueWithError,\n      setFieldBlockError,\n      forceUpdate,\n    ]\n  )\n\n  const clearErrorState = useCallback(\n    () => persistErrorState(undefined),\n    [persistErrorState]\n  )\n\n  /**\n   * Validate the current state value by provided validator instructions\n   */\n  const validateValue = useCallback(async () => {\n    const isProcessActive = startProcess()\n\n    try {\n      // Validate required\n      if (valueRef.current === emptyValue && required) {\n        throw new FormError('The value is required', {\n          validationRule: 'required',\n        })\n      }\n\n      // Validate by provided JSON Schema for this value\n      if (\n        schemaValidatorRef.current &&\n        valueRef.current !== undefined &&\n        !schemaValidatorRef.current(valueRef.current)\n      ) {\n        const error = ajvErrorsToOneFormError(\n          schemaValidatorRef.current.errors\n        )\n        throw error\n      }\n      // Validate by provided derivative validator\n      if (validatorRef.current) {\n        const res = await validatorRef.current?.(\n          valueRef.current,\n          errorMessages\n        )\n        if (res instanceof Error) {\n          throw res\n        }\n      }\n\n      if (isProcessActive()) {\n        clearErrorState()\n      }\n    } catch (error: unknown) {\n      if (isProcessActive()) {\n        persistErrorState(error as Error)\n      }\n    }\n  }, [\n    emptyValue,\n    required,\n    errorMessages,\n    startProcess,\n    persistErrorState,\n    clearErrorState,\n  ])\n\n  useUpdateEffect(() => {\n    if (!schema) {\n      return\n    }\n    schemaValidatorRef.current = ajv.compile(schema)\n    validateValue()\n  }, [schema, validateValue])\n\n  useUpdateEffect(() => {\n    // Error or removed error for this field from the surrounding data context (by path)\n    valueRef.current = externalValue\n    validateValue()\n    forceUpdate()\n  }, [externalValue, validateValue])\n\n  useEffect(() => {\n    const error = prepareError(dataContextError)\n    if (errorChanged(error, contextErrorRef.current)) {\n      contextErrorRef.current = error\n      forceUpdate()\n    }\n  }, [dataContextError, prepareError])\n\n  useEffect(() => {\n    if (dataContext.showAllErrors) {\n      // If showError on a surrounding data context was changed and set to true, it is because the user clicked next, submit or\n      // something else that should lead to showing the user all errors.\n      showError()\n      forceUpdate()\n    }\n  }, [dataContext.showAllErrors, showError])\n\n  const setHasFocus = useCallback(\n    (hasFocus: boolean, valueOverride?: Value) => {\n      if (hasFocus) {\n        // Field was put in focus (like when clicking in a text field or opening a dropdown menu)\n        hasFocusRef.current = true\n        onFocus?.(valueOverride ?? valueRef.current)\n      } else {\n        // Field was removed from focus (like when tabbing out of a text field or closing a dropdown menu)\n        hasFocusRef.current = false\n        onBlur?.(valueOverride ?? valueRef.current)\n\n        if (!changedRef.current && !validateUnchanged) {\n          // Avoid showing errors when blurring without having changed the value, so tabbing through several\n          // fields does not make errors pop up all over the place\n          return\n        }\n\n        // External blur validators makes it possible to validate values but not on every character change in case of\n        // expensive validation calling external services etc.\n        if (typeof onBlurValidator === 'function') {\n          // Since the validator can return either a synchronous result or an asynchronous\n          Promise.resolve(\n            onBlurValidator(valueOverride ?? valueRef.current)\n          ).then(persistErrorState)\n        }\n\n        // Since the user left the field, show error (if any)\n        showError()\n        forceUpdate()\n      }\n    },\n    [\n      validateUnchanged,\n      onFocus,\n      onBlur,\n      onBlurValidator,\n      persistErrorState,\n      showError,\n      forceUpdate,\n    ]\n  )\n\n  const handleFocus = useCallback(() => setHasFocus(true), [setHasFocus])\n  const handleBlur = useCallback(() => setHasFocus(false), [setHasFocus])\n\n  const updateValue = useCallback(\n    (newValue: Value) => {\n      if (newValue === valueRef.current) {\n        // Avoid triggering a change if the value was not actually changed. This may be caused by rendering components\n        // calling onChange even if the actual value did not change.\n        return\n      }\n\n      valueRef.current = newValue\n\n      if (\n        continuousValidation ||\n        (continuousValidation !== false && !hasFocusRef.current)\n      ) {\n        // When there is a change to the value without there having been any focus callback beforehand, it is likely\n        // to believe that the blur callback will not be called either, which would trigger the display of the error.\n        // The error is therefore displayed immediately (unless instructed not to with continuousValidation set to false).\n        showError()\n      } else {\n        // When changing the value, hide errors to avoid annoying the user before they are finished filling in that value\n        hideError()\n      }\n\n      // Always validate the value immediately when it is changed\n      validateValue()\n\n      if (path) {\n        dataContextHandlePathChange?.(path, newValue)\n      }\n\n      forceUpdate()\n    },\n    [\n      continuousValidation,\n      dataContextHandlePathChange,\n      hideError,\n      path,\n      showError,\n      validateValue,\n    ]\n  )\n\n  const handleChange = useCallback(\n    (\n      argFromInput: Value,\n      additionalArgs: AdditionalEventArgs = undefined\n    ) => {\n      const newValue = fromInput(argFromInput)\n\n      if (newValue === valueRef.current) {\n        // Avoid triggering a change if the value was not actually changed. This may be caused by rendering components\n        // calling onChange even if the actual value did not change.\n        return\n      }\n\n      updateValue(newValue)\n\n      changedRef.current = true\n      onChange?.apply(\n        this,\n        typeof additionalArgs !== 'undefined'\n          ? [newValue, additionalArgs]\n          : [newValue]\n      )\n\n      if (elementPath) {\n        const iterateValuePath = `/${iterateElementIndex}${\n          elementPath && elementPath !== '/' ? elementPath : ''\n        }`\n        handleIterateElementChange?.(iterateValuePath, newValue)\n      }\n    },\n    [\n      elementPath,\n      fromInput,\n      handleIterateElementChange,\n      iterateElementIndex,\n      onChange,\n      updateValue,\n    ]\n  )\n\n  useMountEffect(() => {\n    dataContext?.handleMountField(identifier)\n    validateValue()\n\n    if (showErrorInitially) {\n      showError()\n    }\n\n    return () => {\n      // Unmount procedure\n      dataContext?.handleUnMountField(identifier)\n    }\n  })\n\n  return {\n    ...props,\n    id,\n    name: props.name || props.path?.replace('/', '') || id,\n    value: toInput(valueRef.current),\n    error:\n      !inFieldBlock && showErrorRef.current\n        ? errorProp ?? localErrorRef.current ?? contextErrorRef.current\n        : undefined,\n    autoComplete:\n      props.autoComplete ??\n      (dataContext.autoComplete === true ? 'on' : 'off'),\n    setHasFocus,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    forceUpdate,\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"useDataValue.js","names":["_react","require","_jsonPointer","_interopRequireDefault","_utils","_ajv","_interopRequireWildcard","_types","_DataContext","_FieldBlockContext","_IterateElementContext","_componentHelper","_useMountEffect","_useUpdateEffect","_useProcessManager","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ownKeys","object","enumerableOnly","keys","getOwnPropertySymbols","symbols","filter","sym","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","useDataValue","props","_this","_ref3","_props$autoComplete","_props$path","path","itemPath","emptyValue","required","error","errorProp","errorMessages","onFocus","onBlur","onChange","onBlurValidator","validator","schema","validateInitially","validateUnchanged","continuousValidation","toInput","fromInput","toEvent","fromExternal","validateRequired","_ref","FormError","validationRule","forceUpdate","useReducer","startProcess","useProcessManager","id","useMemo","_props$id","makeUniqueId","dataContext","useContext","Context","fieldBlockContext","FieldBlockContext","iterateElementContext","IterateElementContext","transformers","useRef","handlePathChange","dataContextHandlePathChange","updateDataValue","dataContextUpdateDataValue","setValueWithError","dataContextSetValueWithError","errors","dataContextErrors","dataContextError","inFieldBlock","Boolean","setError","setFieldBlockError","setShowError","setShowFieldBlockError","inIterate","index","iterateElementIndex","iterateElementValue","handleChange","handleIterateElementChange","substring","Error","identifier","externalValue","current","capitalize","toCapitalized","pointer","data","valueRef","changedRef","hasFocusRef","showErrorInitially","localErrorRef","contextErrorRef","showErrorRef","errorMessagesRef","useEffect","validatorRef","schemaValidatorRef","ajv","compile","showError","useCallback","hideError","prepareError","_errorMessagesRef$cur","_error$messageValues","message","messageWithValues","entries","messageValues","reduce","_ref2","replace","persistErrorState","errorArg","errorChanged","clearErrorState","validateValue","isProcessActive","requiredError","isChanged","ajvErrorsToOneFormError","_validatorRef$current","useUpdateEffect","showAllErrors","hasValue","handleError","setHasFocus","hasFocus","valueOverride","Promise","resolve","then","updateValue","newValue","argFromInput","additionalArgs","iterateValuePath","handleFocus","handleBlur","trim","test","useMountEffect","handleMountField","handleUnMountField","autoComplete","name","hasError"],"sources":["../../../../../src/extensions/forms/hooks/useDataValue.ts"],"sourcesContent":["import {\n  useRef,\n  useEffect,\n  useContext,\n  useCallback,\n  useMemo,\n  useReducer,\n} from 'react'\nimport pointer from 'json-pointer'\nimport { ValidateFunction } from 'ajv'\nimport { errorChanged } from '../utils'\nimport ajv, { ajvErrorsToOneFormError } from '../utils/ajv'\nimport { FormError, FieldProps, AdditionalEventArgs } from '../types'\nimport { Context, ContextState } from '../DataContext'\nimport FieldBlockContext from '../FieldBlock/FieldBlockContext'\nimport IterateElementContext from '../Iterate/IterateElementContext'\nimport {\n  makeUniqueId,\n  toCapitalized,\n} from '../../../shared/component-helper'\nimport useMountEffect from './useMountEffect'\nimport useUpdateEffect from './useUpdateEffect'\nimport useProcessManager from './useProcessManager'\n\ninterface ReturnAdditional<Value> {\n  id: string\n  value: Value\n  error: Error | FormError | undefined\n  hasError: boolean\n  dataContext: ContextState\n  setHasFocus: (hasFocus: boolean, valueOverride?: unknown) => void\n  handleFocus: () => void\n  handleBlur: () => void\n  handleChange: FieldProps<unknown>['onChange']\n  updateValue: (value: Value) => void\n  forceUpdate: () => void\n}\n\nexport default function useDataValue<\n  Value = unknown,\n  Props extends FieldProps<Value> = FieldProps<Value>,\n>(props: Props): Props & ReturnAdditional<Value> {\n  const {\n    path,\n    itemPath,\n    emptyValue,\n    required,\n    error: errorProp,\n    errorMessages,\n    onFocus,\n    onBlur,\n    onChange,\n    onBlurValidator,\n    validator,\n    schema,\n    validateInitially,\n    validateUnchanged,\n    continuousValidation,\n    toInput = (value: Value) => value,\n    fromInput = (value: Value) => value,\n    toEvent = (value: Value) => value,\n    fromExternal = (value: Value) => value,\n    validateRequired = (value: Value, { emptyValue, required }) => {\n      const res =\n        required &&\n        (value === emptyValue ||\n          (typeof emptyValue === 'undefined' && value === ''))\n          ? new FormError('The value is required', {\n              validationRule: 'required',\n            })\n          : undefined\n      return res\n    },\n  } = props\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  const { startProcess } = useProcessManager()\n  const id = useMemo(() => props.id ?? makeUniqueId(), [props.id])\n  const dataContext = useContext(Context)\n  const fieldBlockContext = useContext(FieldBlockContext)\n  const iterateElementContext = useContext(IterateElementContext)\n\n  const transformers = useRef({\n    toInput,\n    fromInput,\n    toEvent,\n    fromExternal,\n    validateRequired,\n  })\n\n  const {\n    handlePathChange: dataContextHandlePathChange,\n    updateDataValue: dataContextUpdateDataValue,\n    setValueWithError: dataContextSetValueWithError,\n    errors: dataContextErrors,\n  } = dataContext ?? {}\n  const dataContextError = path ? dataContextErrors?.[path] : undefined\n  const inFieldBlock = Boolean(fieldBlockContext)\n  const {\n    setError: setFieldBlockError,\n    setShowError: setShowFieldBlockError,\n  } = fieldBlockContext ?? {}\n  const inIterate = Boolean(iterateElementContext)\n  const {\n    index: iterateElementIndex,\n    value: iterateElementValue,\n    handleChange: handleIterateElementChange,\n  } = iterateElementContext ?? {}\n\n  if (path && path.substring(0, 1) !== '/') {\n    throw new Error(\n      'Invalid path. Data value path JSON Pointers must be from root (starting with a /).'\n    )\n  }\n  if (itemPath && itemPath.substring(0, 1) !== '/') {\n    throw new Error(\n      'Invalid itemPath. Item pathJSON Pointers must be from root of iterate element (starting with a /).'\n    )\n  }\n  if (itemPath && !iterateElementContext) {\n    throw new Error(\n      'itemPath cannot be used when not inside an iterate element context. Wrap the component in an Iterate.Loop.'\n    )\n  }\n\n  const identifier = useMemo(() => {\n    // Identifier is used is registries of multiple fields, like in the DataContext keeping track of errors\n    return path ?? id\n  }, [path, id])\n\n  const externalValue = useMemo(() => {\n    if (props.value !== undefined) {\n      let value = transformers.current.fromExternal(props.value)\n\n      if (props.capitalize) {\n        value = toCapitalized(String(value || '')) as Value\n      }\n\n      // Value-prop sent directly to the field has highest priority, overriding any surrounding source\n      return value\n    }\n\n    if (inIterate && itemPath) {\n      // This field is inside an iterate, and has a pointer from the base of the element being iterated\n      if (itemPath === '/') {\n        return iterateElementValue\n      }\n\n      return pointer.has(iterateElementValue, itemPath)\n        ? pointer.get(iterateElementValue, itemPath)\n        : undefined\n    }\n\n    if (dataContext.data && path) {\n      // There is a surrounding data context and a path for where in the source to find the data\n      if (path === '/') {\n        return dataContext.data\n      }\n\n      return pointer.has(dataContext.data, path)\n        ? pointer.get(dataContext.data, path)\n        : undefined\n    }\n    return undefined\n  }, [\n    props.value,\n    props.capitalize,\n    inIterate,\n    itemPath,\n    dataContext.data,\n    path,\n    iterateElementValue,\n  ])\n\n  // Many variables are kept in refs to avoid triggering unnecessary update loops because updates using\n  // useEffect depend on them (like the external `value`)\n\n  // Hold an internal copy of the input value in case the input component is used uncontrolled,\n  // and to handle errors in Eufemia on components that does not take updated callback functions into account.\n  const valueRef = useRef<Value>(externalValue)\n  const changedRef = useRef<boolean>(false)\n  const hasFocusRef = useRef<boolean>(false)\n\n  // Error handling\n  // - Should errors received through validation be shown initially. Assume that providing a direct prop to\n  // the component means it is supposed to be shown initially.\n  const showErrorInitially = validateInitially || errorProp\n  // - Local errors are errors based on validation instructions received by\n  const localErrorRef = useRef<Error | FormError | undefined>()\n  // - Context errors are from outer contexts, like validation for this field as part of the whole data set\n  const contextErrorRef = useRef<Error | FormError | undefined>(\n    dataContextError\n  )\n\n  const showErrorRef = useRef<boolean>(Boolean(showErrorInitially))\n  const errorMessagesRef = useRef(errorMessages)\n  useEffect(() => {\n    errorMessagesRef.current = errorMessages\n  }, [errorMessages])\n  const validatorRef = useRef(validator)\n  useEffect(() => {\n    validatorRef.current = validator\n  }, [validator])\n\n  const schemaValidatorRef = useRef<ValidateFunction>(\n    schema ? ajv.compile(schema) : undefined\n  )\n\n  const showError = useCallback(() => {\n    showErrorRef.current = true\n    setShowFieldBlockError?.(path ?? id, true)\n  }, [path, id, setShowFieldBlockError])\n\n  const hideError = useCallback(() => {\n    showErrorRef.current = false\n    setShowFieldBlockError?.(path ?? id, false)\n  }, [path, id, setShowFieldBlockError])\n\n  /**\n   * Prepare error from validation logic with correct error messages based on props\n   */\n  const prepareError = useCallback(\n    (error: Error | FormError | undefined): FormError | undefined => {\n      if (error === undefined) {\n        return\n      }\n\n      if (error instanceof FormError) {\n        const message =\n          (typeof error.validationRule === 'string' &&\n            errorMessagesRef.current?.[error.validationRule]) ||\n          error.message\n\n        const messageWithValues = Object.entries(\n          error.messageValues ?? {}\n        ).reduce((message, [key, value]) => {\n          return message.replace(`{${key}}`, value)\n        }, message)\n\n        return new FormError(messageWithValues)\n      }\n\n      return error\n    },\n    []\n  )\n\n  /**\n   * Based on validation, update error state, locally and relevant surrounding contexts\n   */\n  const persistErrorState = useCallback(\n    (errorArg: FormError | undefined) => {\n      const error = prepareError(errorArg)\n\n      if (!errorChanged(error, localErrorRef.current)) {\n        // In case different triggers lead to validation with no changes in the result (like still no error, or the same error),\n        // avoid unnecessary re-renders by letting the old error object stay in the state and skip re-rendering.\n        return\n      }\n\n      localErrorRef.current = error\n\n      // Tell the data context about the error, so it can stop the user from submitting the form until the error has been fixed\n      dataContextSetValueWithError?.(identifier, Boolean(error))\n\n      setFieldBlockError?.(path ?? id, error)\n      forceUpdate()\n    },\n    [\n      path,\n      identifier,\n      id,\n      prepareError,\n      dataContextSetValueWithError,\n      setFieldBlockError,\n      forceUpdate,\n    ]\n  )\n\n  const clearErrorState = useCallback(\n    () => persistErrorState(undefined),\n    [persistErrorState]\n  )\n\n  /**\n   * Validate the current state value by provided validator instructions\n   */\n  const validateValue = useCallback(async () => {\n    const isProcessActive = startProcess()\n\n    try {\n      // Validate required\n      const requiredError = transformers.current.validateRequired(\n        valueRef.current,\n        {\n          emptyValue,\n          required,\n          isChanged: changedRef.current,\n        }\n      )\n      if (requiredError instanceof Error) {\n        throw requiredError\n      }\n\n      // Validate by provided JSON Schema for this value\n      if (\n        schemaValidatorRef.current &&\n        valueRef.current !== undefined &&\n        !schemaValidatorRef.current(valueRef.current)\n      ) {\n        const error = ajvErrorsToOneFormError(\n          schemaValidatorRef.current.errors\n        )\n        throw error\n      }\n\n      // Validate by provided derivative validator\n      if (validatorRef.current) {\n        const res = await validatorRef.current?.(\n          valueRef.current,\n          errorMessagesRef.current\n        )\n        if (res instanceof Error) {\n          throw res\n        }\n      }\n\n      if (isProcessActive()) {\n        clearErrorState()\n      }\n    } catch (error: unknown) {\n      if (isProcessActive()) {\n        persistErrorState(error as Error)\n      }\n    }\n  }, [\n    startProcess,\n    emptyValue,\n    required,\n    clearErrorState,\n    persistErrorState,\n  ])\n\n  useUpdateEffect(() => {\n    if (!schema) {\n      schemaValidatorRef.current = undefined\n      return\n    }\n    schemaValidatorRef.current = ajv.compile(schema)\n    validateValue()\n  }, [schema, validateValue])\n\n  useUpdateEffect(() => {\n    // Error or removed error for this field from the surrounding data context (by path)\n    valueRef.current = externalValue\n    validateValue()\n    forceUpdate()\n  }, [externalValue, validateValue])\n\n  useEffect(() => {\n    const error = prepareError(dataContextError)\n    if (errorChanged(error, contextErrorRef.current)) {\n      contextErrorRef.current = error\n      forceUpdate()\n    }\n  }, [dataContextError, prepareError])\n\n  useEffect(() => {\n    if (dataContext.showAllErrors) {\n      // If showError on a surrounding data context was changed and set to true, it is because the user clicked next, submit or\n      // something else that should lead to showing the user all errors.\n      showError()\n      forceUpdate()\n    }\n  }, [dataContext.showAllErrors, showError])\n\n  useEffect(() => {\n    if (path && props.value) {\n      const hasValue = pointer.has(dataContext.data, path)\n      const value = hasValue\n        ? pointer.get(dataContext.data, path)\n        : undefined\n      if (\n        !hasValue ||\n        (props.value !== value && valueRef.current !== value)\n      ) {\n        // Update the data context when a pointer not exists,\n        // but was given initially.\n        dataContextUpdateDataValue?.(path, props.value)\n      }\n    }\n  }, [dataContext.data, dataContextUpdateDataValue, path, props.value])\n\n  const handleError = useCallback(() => {\n    if (\n      continuousValidation ||\n      (continuousValidation !== false && !hasFocusRef.current)\n    ) {\n      // When there is a change to the value without there having been any focus callback beforehand, it is likely\n      // to believe that the blur callback will not be called either, which would trigger the display of the error.\n      // The error is therefore displayed immediately (unless instructed not to with continuousValidation set to false).\n      showError()\n    } else {\n      // When changing the value, hide errors to avoid annoying the user before they are finished filling in that value\n      hideError()\n    }\n  }, [continuousValidation, hideError, showError])\n\n  const setHasFocus = useCallback(\n    (hasFocus: boolean, valueOverride?: Value) => {\n      if (hasFocus) {\n        // Field was put in focus (like when clicking in a text field or opening a dropdown menu)\n        hasFocusRef.current = true\n        onFocus?.(\n          transformers.current.toEvent(valueOverride ?? valueRef.current)\n        )\n      } else {\n        // Field was removed from focus (like when tabbing out of a text field or closing a dropdown menu)\n        hasFocusRef.current = false\n        onBlur?.(\n          transformers.current.toEvent(valueOverride ?? valueRef.current)\n        )\n\n        if (!changedRef.current && !validateUnchanged) {\n          // Avoid showing errors when blurring without having changed the value, so tabbing through several\n          // fields does not make errors pop up all over the place\n          return\n        }\n\n        // External blur validators makes it possible to validate values but not on every character change in case of\n        // expensive validation calling external services etc.\n        if (typeof onBlurValidator === 'function') {\n          // Since the validator can return either a synchronous result or an asynchronous\n          Promise.resolve(\n            onBlurValidator(\n              transformers.current.toEvent(\n                valueOverride ?? valueRef.current\n              )\n            )\n          ).then(persistErrorState)\n        }\n\n        // Since the user left the field, show error (if any)\n        showError()\n        forceUpdate()\n      }\n    },\n    [\n      onBlur,\n      onBlurValidator,\n      onFocus,\n      persistErrorState,\n      showError,\n      validateUnchanged,\n    ]\n  )\n\n  const updateValue = useCallback(\n    (newValue: Value) => {\n      if (newValue === valueRef.current) {\n        // Avoid triggering a change if the value was not actually changed. This may be caused by rendering components\n        // calling onChange even if the actual value did not change.\n        return\n      }\n\n      valueRef.current = newValue\n\n      // Always validate the value immediately when it is changed\n      validateValue()\n\n      handleError()\n\n      if (path) {\n        dataContextHandlePathChange?.(path, newValue)\n      }\n\n      forceUpdate()\n    },\n    [dataContextHandlePathChange, handleError, path, validateValue]\n  )\n\n  const handleChange = useCallback(\n    (\n      argFromInput: Value,\n      additionalArgs: AdditionalEventArgs = undefined\n    ) => {\n      let newValue = transformers.current.fromInput(argFromInput)\n\n      if (newValue === valueRef.current) {\n        // Avoid triggering a change if the value was not actually changed. This may be caused by rendering components\n        // calling onChange even if the actual value did not change.\n        return\n      }\n\n      if (props.capitalize) {\n        newValue = toCapitalized(String(newValue || '')) as Value\n      }\n\n      updateValue(newValue)\n\n      changedRef.current = true\n\n      const value = transformers.current.toEvent(newValue)\n      onChange?.apply(\n        this,\n        typeof additionalArgs !== 'undefined'\n          ? [value, additionalArgs]\n          : [value]\n      )\n\n      if (itemPath) {\n        const iterateValuePath = `/${iterateElementIndex}${\n          itemPath && itemPath !== '/' ? itemPath : ''\n        }`\n        handleIterateElementChange?.(iterateValuePath, newValue)\n      }\n    },\n    [\n      props.capitalize,\n      updateValue,\n      onChange,\n      itemPath,\n      iterateElementIndex,\n      handleIterateElementChange,\n    ]\n  )\n\n  const handleFocus = useCallback(() => setHasFocus(true), [setHasFocus])\n\n  const handleBlur = useCallback(() => {\n    if (props.trim && /^\\s|\\s$/.test(String(valueRef.current))) {\n      const value = String(valueRef.current).trim()\n      handleChange(value as Value)\n    }\n\n    setHasFocus(false)\n  }, [props.trim, setHasFocus, handleChange])\n\n  useMountEffect(() => {\n    dataContext?.handleMountField(identifier)\n\n    validateValue()\n\n    if (showErrorInitially) {\n      showError()\n    }\n\n    return () => {\n      // Unmount procedure\n      dataContext?.handleUnMountField(identifier)\n    }\n  })\n\n  const error = showErrorRef.current\n    ? errorProp ?? localErrorRef.current ?? contextErrorRef.current\n    : undefined\n\n  return {\n    ...props,\n    autoComplete:\n      props.autoComplete ??\n      (dataContext.autoComplete === true ? 'on' : 'off'),\n    id,\n    name: props.name || props.path?.replace('/', '') || id,\n    value: transformers.current.toInput(valueRef.current),\n    error: !inFieldBlock ? error : undefined,\n    hasError: Boolean(error),\n    isChanged: changedRef.current,\n    dataContext,\n    setHasFocus,\n    handleFocus,\n    handleBlur,\n    handleChange,\n    updateValue,\n    forceUpdate,\n  }\n}\n"],"mappings":"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"}

package/cjs/extensions/forms/style/dnb-forms.css

@@ -9,13 +9,11 @@
 .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
   display: flex;
   flex-flow: column;
-  grid-row-gap: var(--spacing-x-small);
   row-gap: var(--spacing-x-small);
 }
 .dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
   display: flex;
   flex-flow: row wrap;
-  grid-column-gap: var(--spacing-small);
   -moz-column-gap: var(--spacing-small);
        column-gap: var(--spacing-small);
 }
@@ -36,11 +34,13 @@
 .dnb-forms-field-phone-number__number {
   flex: 1;
 }
+.dnb-forms-field-phone-number .dnb-form-label {
+  max-width: 14ch;
+}
 
 .dnb-forms-field-postal-code-and-city__fields {
   display: flex;
   flex-flow: row;
-  grid-column-gap: var(--spacing-small);
   -moz-column-gap: var(--spacing-small);
        column-gap: var(--spacing-small);
 }
@@ -51,14 +51,14 @@
   flex: 1;
 }
 
-.dnb-forms-field-selection--width-large .dnb-dropdown__shell {
-  width: var(--forms-field-width--large);
+.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label {
+  align-self: center;
 }
-.dnb-forms-field-selection--width-medium .dnb-dropdown__shell {
-  width: var(--forms-field-width--medium);
+.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label, .dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label {
+  margin-bottom: 0;
 }
-.dnb-forms-field-selection--width-small .dnb-dropdown__shell {
-  width: var(--forms-field-width--small);
+.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label {
+  line-height: 2.5rem;
 }
 
 :root {
@@ -95,7 +95,7 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   grid-template-areas: "label" "contents" "status";
 }
 .dnb-forms-field-block--layout-horizontal {
-  grid-template-columns: var(--forms-field-width--medium) auto;
+  grid-template-columns: fit-content(100%) auto;
   grid-template-areas: "label contents" "status status";
 }
 .dnb-forms-field-block--width-stretch {
@@ -149,36 +149,42 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   }
 }
 
+/*
+ * Utilities
+ */
 .dnb-forms-button-row {
   display: flex;
   flex-flow: row;
-  grid-column-gap: var(--spacing-small);
   -moz-column-gap: var(--spacing-small);
        column-gap: var(--spacing-small);
 }
+@media screen and (min-width: 40em) {
+  .dnb-card + .dnb-forms-button-row:not([class*=space__left]) {
+    margin-left: var(--spacing-medium);
+  }
+}
 
+/*
+ * Utilities
+ */
 .dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]) {
   margin: 0;
 }
-.dnb-form-main-heading[\:has\(\%2B\%20.dnb-flex-stack\%20\%3E\%20.dnb-card\,\%20\%2B\%20.dnb-card\)]:not([class*=space__left]) {
-  margin-left: var(--spacing-medium);
-}
-.dnb-form-main-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__left]) {
-  margin-left: var(--spacing-medium);
-}
-.dnb-form-main-heading[\:has\(\%2B\%20.dnb-flex-stack\%20\%3E\%20.dnb-card\,\%20\%2B\%20.dnb-card\)]:not([class*=space__bottom]) {
-  margin-bottom: var(--spacing-small);
+@media screen and (min-width: 40em) {
+  .dnb-form-main-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__left]) {
+    margin-left: var(--spacing-medium);
+  }
 }
 .dnb-form-main-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__bottom]) {
   margin-bottom: var(--spacing-small);
 }
 
+/*
+ * Utilities
+ */
 .dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]) {
   margin: 0;
 }
-.dnb-form-sub-heading[\:has\(\%2B\%20.dnb-flex-stack\%20\%3E\%20.dnb-card\,\%20\%2B\%20.dnb-card\)]:not([class*=space__bottom]) {
-  margin-bottom: var(--spacing-small);
-}
 .dnb-form-sub-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__bottom]) {
   margin-bottom: var(--spacing-small);
 }
@@ -189,34 +195,31 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
 .dnb-forms-steps-layout {
   display: flex;
   flex-flow: row wrap;
-  grid-column-gap: var(--spacing-medium);
   -moz-column-gap: var(--spacing-medium);
        column-gap: var(--spacing-medium);
 }
-@media (max-width: 60em) {
-  .dnb-forms-steps-layout {
-    flex-direction: column;
-    justify-content: stretch;
-    align-items: stretch;
-  }
-}
 .dnb-forms-steps-layout__sidebar {
   flex: 0;
-  min-width: 21rem;
-}
-.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar {
-  max-width: 21rem;
-}
-.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar .dnb-step-indicator__item {
-  min-width: 336px;
 }
 .dnb-forms-steps-layout__contents {
-  flex: 1;
-  min-width: 25rem;
+  flex: 1 0 25rem;
 }
 .dnb-forms-steps-layout__contents .dnb-card {
   --border-color: var(--color-pistachio);
 }
+@media screen and (max-width: 60em) {
+  .dnb-forms-steps-layout {
+    flex-direction: column;
+    justify-content: stretch;
+    align-items: stretch;
+  }
+  .dnb-forms-steps-layout__contents {
+    flex-basis: auto;
+  }
+}
+.dnb-forms-steps-layout .dnb-step-indicator__sidebar {
+  margin-right: 0;
+}
 
 .dnb-forms-value-block {
   display: block;