@dnb/eufemia 10.16.0 → 10.17.0

package/extensions/forms/hooks/useDataValue.js

@@ -11,10 +11,10 @@ import { FormError } from '../types';
 import { Context } from '../DataContext';
 import FieldBlockContext from '../FieldBlock/FieldBlockContext';
 import IterateElementContext from '../Iterate/IterateElementContext';
-import { makeUniqueId, toCapitalized } from '../../../shared/component-helper';
 import useMountEffect from './useMountEffect';
 import useUpdateEffect from './useUpdateEffect';
 import useProcessManager from './useProcessManager';
+import useId from './useId';
 export default function useDataValue(props) {
   var _this = this,
     _ref3,
@@ -39,15 +39,15 @@ export default function useDataValue(props) {
     toInput = value => value,
     fromInput = value => value,
     toEvent = value => value,
+    transformValue = value => value,
     fromExternal = value => value,
     validateRequired = (value, _ref) => {
       let {
         emptyValue,
-        required
+        required,
+        error
       } = _ref;
-      const res = required && (value === emptyValue || typeof emptyValue === 'undefined' && value === '') ? new FormError('The value is required', {
-        validationRule: 'required'
-      }) : undefined;
+      const res = required && (value === emptyValue || typeof emptyValue === 'undefined' && value === '') ? error : undefined;
       return res;
     }
   } = props;
@@ -55,10 +55,7 @@ export default function useDataValue(props) {
   const {
     startProcess
   } = useProcessManager();
-  const id = useMemo(() => {
-    var _props$id;
-    return (_props$id = props.id) !== null && _props$id !== void 0 ? _props$id : makeUniqueId();
-  }, [props.id]);
+  const id = useId(props.id);
   const dataContext = useContext(Context);
   const fieldBlockContext = useContext(FieldBlockContext);
   const iterateElementContext = useContext(IterateElementContext);
@@ -67,6 +64,7 @@ export default function useDataValue(props) {
     fromInput,
     toEvent,
     fromExternal,
+    transformValue,
     validateRequired
   });
   const {
@@ -101,11 +99,7 @@ export default function useDataValue(props) {
   }, [path, id]);
   const externalValue = useMemo(() => {
     if (props.value !== undefined) {
-      let value = transformers.current.fromExternal(props.value);
-      if (props.capitalize) {
-        value = toCapitalized(String(value || ''));
-      }
-      return value;
+      return transformers.current.fromExternal(props.value);
     }
     if (inIterate && itemPath) {
       if (itemPath === '/') {
@@ -177,7 +171,10 @@ export default function useDataValue(props) {
       const requiredError = transformers.current.validateRequired(valueRef.current, {
         emptyValue,
         required,
-        isChanged: changedRef.current
+        isChanged: changedRef.current,
+        error: new FormError('The value is required', {
+          validationRule: 'required'
+        })
       });
       if (requiredError instanceof Error) {
         throw requiredError;
@@ -247,15 +244,18 @@ export default function useDataValue(props) {
   const setHasFocus = useCallback((hasFocus, valueOverride) => {
     if (hasFocus) {
       hasFocusRef.current = true;
-      onFocus === null || onFocus === void 0 ? void 0 : onFocus(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current));
+      const value = transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current, 'onFocus');
+      onFocus === null || onFocus === void 0 ? void 0 : onFocus(value);
     } else {
       hasFocusRef.current = false;
-      onBlur === null || onBlur === void 0 ? void 0 : onBlur(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current));
+      const value = transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current, 'onBlur');
+      onBlur === null || onBlur === void 0 ? void 0 : onBlur(value);
       if (!changedRef.current && !validateUnchanged) {
         return;
       }
       if (typeof onBlurValidator === 'function') {
-        Promise.resolve(onBlurValidator(transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current))).then(persistErrorState);
+        const value = transformers.current.toEvent(valueOverride !== null && valueOverride !== void 0 ? valueOverride : valueRef.current, 'onBlurValidator');
+        Promise.resolve(onBlurValidator(value)).then(persistErrorState);
       }
       showError();
       forceUpdate();
@@ -275,30 +275,23 @@ export default function useDataValue(props) {
   }, [dataContextHandlePathChange, handleError, path, validateValue]);
   const handleChange = useCallback(function (argFromInput) {
     let additionalArgs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+    const currentValue = valueRef.current;
     let newValue = transformers.current.fromInput(argFromInput);
-    if (newValue === valueRef.current) {
+    if (newValue === currentValue) {
       return;
     }
-    if (props.capitalize) {
-      newValue = toCapitalized(String(newValue || ''));
-    }
+    newValue = transformers.current.transformValue(newValue, currentValue);
     updateValue(newValue);
     changedRef.current = true;
-    const value = transformers.current.toEvent(newValue);
+    const value = transformers.current.toEvent(newValue, 'onChange');
     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);
     }
-  }, [props.capitalize, updateValue, onChange, itemPath, iterateElementIndex, handleIterateElementChange]);
+  }, [updateValue, onChange, itemPath, iterateElementIndex, handleIterateElementChange]);
   const handleFocus = useCallback(() => setHasFocus(true), [setHasFocus]);
-  const handleBlur = useCallback(() => {
-    if (props.trim && /^\s|\s$/.test(String(valueRef.current))) {
-      const value = String(valueRef.current).trim();
-      handleChange(value);
-    }
-    setHasFocus(false);
-  }, [props.trim, setHasFocus, handleChange]);
+  const handleBlur = useCallback(() => setHasFocus(false), [setHasFocus]);
   useMountEffect(() => {
     dataContext === null || dataContext === void 0 ? void 0 : dataContext.handleMountField(identifier);
     validateValue();

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

@@ -1 +1 @@
-{"version":3,"file":"useDataValue.js","names":["useRef","useEffect","useContext","useCallback","useMemo","useReducer","pointer","errorChanged","ajv","ajvErrorsToOneFormError","FormError","Context","FieldBlockContext","IterateElementContext","makeUniqueId","toCapitalized","useMountEffect","useUpdateEffect","useProcessManager","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","value","fromInput","toEvent","fromExternal","validateRequired","_ref","res","validationRule","undefined","forceUpdate","startProcess","id","_props$id","dataContext","fieldBlockContext","iterateElementContext","transformers","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","String","has","get","data","valueRef","changedRef","hasFocusRef","showErrorInitially","localErrorRef","contextErrorRef","showErrorRef","errorMessagesRef","validatorRef","schemaValidatorRef","compile","showError","hideError","prepareError","_errorMessagesRef$cur","_error$messageValues","message","messageWithValues","Object","entries","messageValues","reduce","_ref2","key","replace","persistErrorState","errorArg","clearErrorState","validateValue","isProcessActive","requiredError","isChanged","_validatorRef$current","call","showAllErrors","hasValue","handleError","setHasFocus","hasFocus","valueOverride","Promise","resolve","then","updateValue","newValue","argFromInput","additionalArgs","arguments","length","apply","iterateValuePath","handleFocus","handleBlur","trim","test","handleMountField","handleUnMountField","_objectSpread","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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"}
+{"version":3,"file":"useDataValue.js","names":["useRef","useEffect","useContext","useCallback","useMemo","useReducer","pointer","errorChanged","ajv","ajvErrorsToOneFormError","FormError","Context","FieldBlockContext","IterateElementContext","useMountEffect","useUpdateEffect","useProcessManager","useId","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","value","fromInput","toEvent","transformValue","fromExternal","validateRequired","_ref","res","undefined","forceUpdate","startProcess","id","dataContext","fieldBlockContext","iterateElementContext","transformers","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","has","get","data","capitalize","valueRef","changedRef","hasFocusRef","showErrorInitially","localErrorRef","contextErrorRef","showErrorRef","errorMessagesRef","validatorRef","schemaValidatorRef","compile","showError","hideError","prepareError","_errorMessagesRef$cur","_error$messageValues","message","validationRule","messageWithValues","Object","entries","messageValues","reduce","_ref2","key","replace","persistErrorState","errorArg","clearErrorState","validateValue","isProcessActive","requiredError","isChanged","_validatorRef$current","call","showAllErrors","hasValue","handleError","setHasFocus","hasFocus","valueOverride","Promise","resolve","then","updateValue","newValue","argFromInput","additionalArgs","arguments","length","currentValue","apply","iterateValuePath","handleFocus","handleBlur","handleMountField","handleUnMountField","_objectSpread","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 useMountEffect from './useMountEffect'\nimport useUpdateEffect from './useUpdateEffect'\nimport useProcessManager from './useProcessManager'\nimport useId from './useId'\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    transformValue = (value: Value) => value,\n    fromExternal = (value: Value) => value,\n    validateRequired = (value: Value, { emptyValue, required, error }) => {\n      const res =\n        required &&\n        (value === emptyValue ||\n          (typeof emptyValue === 'undefined' && value === ''))\n          ? error\n          : undefined\n      return res\n    },\n  } = props\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  const { startProcess } = useProcessManager()\n  const id = useId(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    transformValue,\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      // Value-prop sent directly to the field has highest priority, overriding any surrounding source\n      return transformers.current.fromExternal(props.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          error: new FormError('The value is required', {\n            validationRule: 'required',\n          }),\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        const value = transformers.current.toEvent(\n          valueOverride ?? valueRef.current,\n          'onFocus'\n        )\n        onFocus?.(value)\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        const value = transformers.current.toEvent(\n          valueOverride ?? valueRef.current,\n          'onBlur'\n        )\n        onBlur?.(value)\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          const value = transformers.current.toEvent(\n            valueOverride ?? valueRef.current,\n            'onBlurValidator'\n          )\n          Promise.resolve(onBlurValidator(value)).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      const currentValue = valueRef.current\n      let newValue = transformers.current.fromInput(argFromInput)\n\n      if (newValue === currentValue) {\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      newValue = transformers.current.transformValue(\n        newValue,\n        currentValue\n      )\n\n      updateValue(newValue)\n\n      changedRef.current = true\n\n      const value = transformers.current.toEvent(newValue, 'onChange')\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      updateValue,\n      onChange,\n      itemPath,\n      iterateElementIndex,\n      handleIterateElementChange,\n    ]\n  )\n\n  const handleFocus = useCallback(() => setHasFocus(true), [setHasFocus])\n\n  const handleBlur = useCallback(() => setHasFocus(false), [setHasFocus])\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/extensions/forms/hooks/useId.d.ts

@@ -0,0 +1 @@
+export default function useId(customId?: string): string;

package/extensions/forms/hooks/useId.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { makeUniqueId } from '../../../shared/component-helper';
+export default function useId(customId) {
+  var _React$useId;
+  const id = React === null || React === void 0 ? void 0 : (_React$useId = React.useId) === null || _React$useId === void 0 ? void 0 : _React$useId.call(React);
+  return React.useMemo(() => {
+    var _ref;
+    return (_ref = customId !== null && customId !== void 0 ? customId : id) !== null && _ref !== void 0 ? _ref : makeUniqueId();
+  }, [customId, id]);
+}
+//# sourceMappingURL=useId.js.map

package/extensions/forms/hooks/useId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useId.js","names":["React","makeUniqueId","useId","customId","_React$useId","id","call","useMemo","_ref"],"sources":["../../../../../src/extensions/forms/hooks/useId.ts"],"sourcesContent":["import React from 'react'\nimport { makeUniqueId } from '../../../shared/component-helper'\n\nexport default function useId(customId?: string) {\n  const id = React?.useId?.()\n  return React.useMemo(\n    () => customId ?? id ?? makeUniqueId(),\n    [customId, id]\n  )\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,QAAQ,kCAAkC;AAE/D,eAAe,SAASC,KAAKA,CAACC,QAAiB,EAAE;EAAA,IAAAC,YAAA;EAC/C,MAAMC,EAAE,GAAGL,KAAK,aAALA,KAAK,wBAAAI,YAAA,GAALJ,KAAK,CAAEE,KAAK,cAAAE,YAAA,uBAAZA,YAAA,CAAAE,IAAA,CAAAN,KAAe,CAAC;EAC3B,OAAOA,KAAK,CAACO,OAAO,CAClB;IAAA,IAAAC,IAAA;IAAA,QAAAA,IAAA,GAAML,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIE,EAAE,cAAAG,IAAA,cAAAA,IAAA,GAAIP,YAAY,CAAC,CAAC;EAAA,GACtC,CAACE,QAAQ,EAAEE,EAAE,CACf,CAAC;AACH"}

package/extensions/forms/index.d.ts

@@ -8,5 +8,10 @@ export * as DataContext from './DataContext';
 export * as Iterate from './Iterate';
 export { default as FieldBlock } from './FieldBlock';
 export { default as ValueBlock } from './ValueBlock';
-export { default as Visibility } from './Visibility';
 export { default as StepsLayout, StepsContext } from './StepsLayout';
+/**
+ * Deprecated and will be removed in v11
+ *
+ * @deprecated use import { Field } from 'Form'	instead
+ */
+export declare function Visibility(): void;

package/extensions/forms/index.js

@@ -13,6 +13,8 @@ import * as _Iterate from './Iterate';
 export { _Iterate as Iterate };
 export { default as FieldBlock } from './FieldBlock';
 export { default as ValueBlock } from './ValueBlock';
-export { default as Visibility } from './Visibility';
 export { default as StepsLayout, StepsContext } from './StepsLayout';
+export function Visibility() {
+  console.error('Please import Visibility from "Form.Visibility"');
+}
 //# sourceMappingURL=index.js.map

package/extensions/forms/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_Field","Field","_Value","Value","_Form","Form","_DataContext","DataContext","_Iterate","Iterate","default","FieldBlock","ValueBlock","Visibility","StepsLayout","StepsContext"],"sources":["../../../../src/extensions/forms/index.ts"],"sourcesContent":["export * from './types'\nexport * from './utils'\nexport * from './hooks'\nexport * as Field from './Field'\nexport * as Value from './Value'\nexport * as Form from './Form'\nexport * as DataContext from './DataContext'\nexport * as Iterate from './Iterate'\nexport { default as FieldBlock } from './FieldBlock'\nexport { default as ValueBlock } from './ValueBlock'\nexport { default as Visibility } from './Visibility'\nexport { default as StepsLayout, StepsContext } from './StepsLayout'\n"],"mappings":"AAAA,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,SAAS;AAAA,YAAAA,MAAA,MACA,SAAS;AAAA,SAAAA,MAAA,IAApBC,KAAK;AAAA,YAAAC,MAAA,MACM,SAAS;AAAA,SAAAA,MAAA,IAApBC,KAAK;AAAA,YAAAC,KAAA,MACK,QAAQ;AAAA,SAAAA,KAAA,IAAlBC,IAAI;AAAA,YAAAC,YAAA,MACa,eAAe;AAAA,SAAAA,YAAA,IAAhCC,WAAW;AAAA,YAAAC,QAAA,MACE,WAAW;AAAA,SAAAA,QAAA,IAAxBC,OAAO;AACnB,SAASC,OAAO,IAAIC,UAAU,QAAQ,cAAc;AACpD,SAASD,OAAO,IAAIE,UAAU,QAAQ,cAAc;AACpD,SAASF,OAAO,IAAIG,UAAU,QAAQ,cAAc;AACpD,SAASH,OAAO,IAAII,WAAW,EAAEC,YAAY,QAAQ,eAAe"}
+{"version":3,"file":"index.js","names":["_Field","Field","_Value","Value","_Form","Form","_DataContext","DataContext","_Iterate","Iterate","default","FieldBlock","ValueBlock","StepsLayout","StepsContext","Visibility","console","error"],"sources":["../../../../src/extensions/forms/index.ts"],"sourcesContent":["export * from './types'\nexport * from './utils'\nexport * from './hooks'\nexport * as Field from './Field'\nexport * as Value from './Value'\nexport * as Form from './Form'\nexport * as DataContext from './DataContext'\nexport * as Iterate from './Iterate'\nexport { default as FieldBlock } from './FieldBlock'\nexport { default as ValueBlock } from './ValueBlock'\nexport { default as StepsLayout, StepsContext } from './StepsLayout'\n\n/**\n * Deprecated and will be removed in v11\n *\n * @deprecated use import { Field } from 'Form'\tinstead\n */\nexport function Visibility() {\n  console.error('Please import Visibility from \"Form.Visibility\"')\n}\n"],"mappings":"AAAA,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,SAAS;AAAA,YAAAA,MAAA,MACA,SAAS;AAAA,SAAAA,MAAA,IAApBC,KAAK;AAAA,YAAAC,MAAA,MACM,SAAS;AAAA,SAAAA,MAAA,IAApBC,KAAK;AAAA,YAAAC,KAAA,MACK,QAAQ;AAAA,SAAAA,KAAA,IAAlBC,IAAI;AAAA,YAAAC,YAAA,MACa,eAAe;AAAA,SAAAA,YAAA,IAAhCC,WAAW;AAAA,YAAAC,QAAA,MACE,WAAW;AAAA,SAAAA,QAAA,IAAxBC,OAAO;AACnB,SAASC,OAAO,IAAIC,UAAU,QAAQ,cAAc;AACpD,SAASD,OAAO,IAAIE,UAAU,QAAQ,cAAc;AACpD,SAASF,OAAO,IAAIG,WAAW,EAAEC,YAAY,QAAQ,eAAe;AAOpE,OAAO,SAASC,UAAUA,CAAA,EAAG;EAC3BC,OAAO,CAACC,KAAK,CAAC,iDAAiD,CAAC;AAClE"}

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

@@ -25,6 +25,199 @@
   justify-content: center;
 }
 
+/*
+ * Utilities
+ */
+:root {
+  --forms-field-width--small: 5rem;
+  --forms-field-width--medium: 11rem;
+  --forms-field-width--large: 21rem;
+}
+
+.dnb-forms-field-number {
+  --number-control-button-border-color: black;
+  --number-control-button-border-color--hover: darkgrey;
+  --number-control-button-border-color--focus: darkgrey;
+  --number-control-button-border-width--focus: 0.125rem;
+  --number-control-button-background-color--hover: grey;
+  --number-control-button-color--hover: black;
+  --number-control-button-background-color--active: black;
+  --number-control-button-color--active: lightgrey;
+  --number-control-button--error: red;
+  --number-control-button--error-contrast: white;
+  --number-control-button-width--small: 2rem;
+  --number-control-button-width--medium: 2.5rem;
+  --number-control-button-width--large: 3rem;
+  --forms-field-block--number-control-buttons-width--small: calc(
+    var(--number-control-button-width--small) * 2
+  );
+  --forms-field-block--number-control-buttons-width--medium: calc(
+    var(--number-control-button-width--medium) * 2
+  );
+  --forms-field-block--number-control-buttons-width--large: calc(
+    var(--number-control-button-width--large) * 2
+  );
+}
+.dnb-forms-field-number__contents {
+  display: flex;
+  align-items: center;
+}
+.dnb-forms-field-number__contents--has-controls {
+  border-radius: 0.25rem;
+  --border-color: var(--number-control-button-border-color);
+  --border-width: 0.0625rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]) {
+  --border-color: var(--number-control-button-border-color);
+  --border-width: 0.125rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within {
+  --border-color: var(--number-control-button-border-color--focus);
+  --border-width: var(--number-control-button-border-width--focus);
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-forms-field-number__contents--has-controls .dnb-input__shell {
+  border-radius: 0;
+  box-shadow: none;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]) {
+  box-shadow: none;
+}
+.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell {
+  outline: initial;
+  box-shadow: none;
+}
+html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell {
+  box-shadow: none;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled],
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]),
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]) {
+  background-color: var(--number-control-button-background-color--hover);
+  color: var(--number-control-button-color--hover);
+}
+.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled], html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],
+.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled] {
+  cursor: not-allowed;
+}
+.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]), html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),
+.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]) {
+  background-color: var(--number-control-button-background-color--active);
+  color: var(--number-control-button-color--active);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error {
+  --border-color: var(--number-control-button--error);
+  --border-width: 0.125rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]) {
+  --border-color: var(--number-control-button--error);
+  --border-width: 0.125rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell {
+  box-shadow: none;
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before,
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after {
+  color: var(--number-control-button--error);
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled],
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]),
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]) {
+  background-color: var(--number-control-button--error-contrast);
+  color: var(--number-control-button--error);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled], html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled] {
+  cursor: not-allowed;
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]), html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]) {
+  background-color: var(--number-control-button--error);
+  color: var(--number-control-button--error-contrast);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled],
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled] {
+  color: var(--number-control-button--error-contrast);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled {
+  --border-color: var(--color-black-55);
+  --border-width: 0.0625rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]) {
+  --border-color: var(--color-black-55);
+  --border-width: 0.0625rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell {
+  box-shadow: none;
+}
+.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled {
+  --border-color: var(--color-black-55);
+  --border-width: 0.0625rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled],
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled] {
+  background-color: var(--color-black-3);
+  color: var(--color-black-20);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small {
+  width: calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small));
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before,
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after {
+  width: var(--number-control-button-width--small);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium {
+  width: calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium));
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before,
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after {
+  width: var(--number-control-button-width--medium);
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large {
+  width: calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large));
+}
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before,
+.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after {
+  width: var(--number-control-button-width--large);
+}
+
 .dnb-forms-field-phone-number__country-code {
   width: calc(var(--forms-field-width--medium) - 2rem);
 }
@@ -90,6 +283,15 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
 .dnb-forms-field-block__grid {
   display: grid;
 }
+@media screen and (max-width: 40em) {
+  .dnb-forms-field-block__grid {
+    flex-wrap: wrap;
+  }
+  .dnb-forms-field-block__grid > .dnb-form-label {
+    margin-bottom: 0.5rem;
+    margin-top: 0.5rem;
+  }
+}
 .dnb-forms-field-block--layout-vertical {
   grid-template-columns: auto;
   grid-template-areas: "label" "contents" "status";

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

@@ -1 +1 @@
-.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.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{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__label-description,.dnb-forms-field-block__label-secondary{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@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)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{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{align-items:stretch;flex-direction:column;justify-content: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;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}
+.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{align-items:center;display:flex}.dnb-forms-field-number__contents--has-controls{--border-color:var(--number-control-button-border-color);--border-width:0.0625rem;border-color:transparent;border-radius:.25rem;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls:hover:not([disabled]){--border-color:var(--number-control-button-border-color);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls:focus-within{--border-color:var(--number-control-button-border-color--focus);--border-width:var(--number-control-button-border-width--focus);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls .dnb-input__shell{border-radius:0;box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-input__shell:hover:not([disabled]){box-shadow:none}.dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none;outline:initial}html[data-whatinput=""] .dnb-forms-field-number__contents--has-controls .dnb-input:not([data-input-state=disabled]):not(:active)[data-input-state=focus] .dnb-input__shell{box-shadow:none}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error{--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error:hover:not([disabled]){--border-color:var(--number-control-button--error);--border-width:0.125rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-input__status--error:not([data-input-state=disabled]):not(:hover):not(:active) .dnb-input__shell{box-shadow:none}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--has-error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled:hover:not([disabled]){--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-input[data-input-state=disabled] .dnb-input__shell{box-shadow:none}.dnb-input[data-input-state=disabled] .dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled{--border-color:var(--color-black-55);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-forms-field-number__contents--is-disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.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{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__label-description,.dnb-forms-field-block__label-secondary{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:40em){.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}@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)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-steps-layout__sidebar{flex:0}.dnb-forms-steps-layout__contents{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{align-items:stretch;flex-direction:column;justify-content: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;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}