@dnb/eufemia 10.52.0 → 10.53.0

package/cjs/extensions/forms/hooks/useTranslation.d.ts

@@ -1,3 +1,5 @@
+import { TranslationObjectToFlat } from '../../../shared/Context';
+import { FormatMessage } from '../../../shared/useTranslation';
 import { DeepPartial } from '../../../shared/types';
 import formsLocales from '../constants/locales';
 export type FormsTranslationDefaultLocales = typeof formsLocales;
@@ -5,6 +7,7 @@ export type FormsTranslationLocale = keyof FormsTranslationDefaultLocales;
 export type FormsTranslationKeys = keyof FormsTranslationDefaultLocales[FormsTranslationLocale];
 export type FormsTranslationValues = FormsTranslationDefaultLocales[FormsTranslationLocale];
 export type FormsTranslation = DeepPartial<FormsTranslationDefaultLocales[FormsTranslationLocale]>;
+export type FormsTranslationFlat = TranslationObjectToFlat<FormsTranslation>;
 type CustomLocales = Partial<Record<FormsTranslationLocale, FormsTranslation>>;
-export default function useTranslation<T = FormsTranslation>(messages?: FormsTranslation | CustomLocales | Record<FormsTranslationLocale, T>): T;
+export default function useTranslation<T = FormsTranslation>(messages?: FormsTranslation | CustomLocales | Record<FormsTranslationLocale, T>): T & FormatMessage;
 export {};

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

@@ -17,13 +17,16 @@ function useTranslation(messages) {
     locale,
     translation: globalTranslation
   } = (0, _react.useContext)(_Context.default);
+  const {
+    assignUtils
+  } = (0, _useTranslation.useAdditionalUtils)();
   return (0, _react.useMemo)(() => {
     const translation = (0, _componentHelper.extendDeep)({}, _locales.default[locale] || _locales.default[_defaults.LOCALE], globalTranslation);
-    return (0, _useTranslation.combineWithExternalTranslations)({
+    return assignUtils((0, _useTranslation.combineWithExternalTranslations)({
       translation,
       messages,
       locale
-    });
-  }, [globalTranslation, locale, messages]);
+    }));
+  }, [assignUtils, globalTranslation, locale, messages]);
 }
 //# sourceMappingURL=useTranslation.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"useTranslation.js","names":["_react","require","_Context","_interopRequireDefault","_useTranslation","_componentHelper","_defaults","_locales","obj","__esModule","default","useTranslation","messages","locale","translation","globalTranslation","useContext","SharedContext","useMemo","extendDeep","formsLocales","LOCALE","combineWithExternalTranslations"],"sources":["../../../../../src/extensions/forms/hooks/useTranslation.tsx"],"sourcesContent":["import { useMemo, useContext } from 'react'\nimport SharedContext from '../../../shared/Context'\nimport { combineWithExternalTranslations } from '../../../shared/useTranslation'\nimport { extendDeep } from '../../../shared/component-helper'\nimport { DeepPartial } from '../../../shared/types'\nimport { LOCALE } from '../../../shared/defaults'\nimport formsLocales from '../constants/locales'\n\nexport type FormsTranslationDefaultLocales = typeof formsLocales\nexport type FormsTranslationLocale = keyof FormsTranslationDefaultLocales\nexport type FormsTranslationKeys =\n  keyof FormsTranslationDefaultLocales[FormsTranslationLocale]\nexport type FormsTranslationValues =\n  FormsTranslationDefaultLocales[FormsTranslationLocale]\nexport type FormsTranslation = DeepPartial<\n  FormsTranslationDefaultLocales[FormsTranslationLocale]\n>\n\ntype CustomLocales = Partial<\n  Record<FormsTranslationLocale, FormsTranslation>\n>\n\nexport default function useTranslation<T = FormsTranslation>(\n  messages?:\n    | FormsTranslation\n    | CustomLocales\n    | Record<FormsTranslationLocale, T>\n) {\n  const { locale, translation: globalTranslation } =\n    useContext(SharedContext)\n\n  return useMemo(() => {\n    const translation = extendDeep(\n      {},\n      formsLocales[locale] || formsLocales[LOCALE],\n      globalTranslation\n    )\n\n    return combineWithExternalTranslations({\n      translation,\n      messages,\n      locale,\n    }) as T\n  }, [globalTranslation, locale, messages])\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AACA,IAAAI,gBAAA,GAAAJ,OAAA;AAEA,IAAAK,SAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAJ,sBAAA,CAAAF,OAAA;AAA+C,SAAAE,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAgBhC,SAASG,cAAcA,CACpCC,QAGqC,EACrC;EACA,MAAM;IAAEC,MAAM;IAAEC,WAAW,EAAEC;EAAkB,CAAC,GAC9C,IAAAC,iBAAU,EAACC,gBAAa,CAAC;EAE3B,OAAO,IAAAC,cAAO,EAAC,MAAM;IACnB,MAAMJ,WAAW,GAAG,IAAAK,2BAAU,EAC5B,CAAC,CAAC,EACFC,gBAAY,CAACP,MAAM,CAAC,IAAIO,gBAAY,CAACC,gBAAM,CAAC,EAC5CN,iBACF,CAAC;IAED,OAAO,IAAAO,+CAA+B,EAAC;MACrCR,WAAW;MACXF,QAAQ;MACRC;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACE,iBAAiB,EAAEF,MAAM,EAAED,QAAQ,CAAC,CAAC;AAC3C"}
+{"version":3,"file":"useTranslation.js","names":["_react","require","_Context","_interopRequireDefault","_useTranslation","_componentHelper","_defaults","_locales","obj","__esModule","default","useTranslation","messages","locale","translation","globalTranslation","useContext","SharedContext","assignUtils","useAdditionalUtils","useMemo","extendDeep","formsLocales","LOCALE","combineWithExternalTranslations"],"sources":["../../../../../src/extensions/forms/hooks/useTranslation.tsx"],"sourcesContent":["import { useMemo, useContext } from 'react'\nimport SharedContext, {\n  TranslationObjectToFlat,\n} from '../../../shared/Context'\nimport {\n  combineWithExternalTranslations,\n  FormatMessage,\n  useAdditionalUtils,\n} from '../../../shared/useTranslation'\nimport { extendDeep } from '../../../shared/component-helper'\nimport { DeepPartial } from '../../../shared/types'\nimport { LOCALE } from '../../../shared/defaults'\nimport formsLocales from '../constants/locales'\n\nexport type FormsTranslationDefaultLocales = typeof formsLocales\nexport type FormsTranslationLocale = keyof FormsTranslationDefaultLocales\nexport type FormsTranslationKeys =\n  keyof FormsTranslationDefaultLocales[FormsTranslationLocale]\nexport type FormsTranslationValues =\n  FormsTranslationDefaultLocales[FormsTranslationLocale]\nexport type FormsTranslation = DeepPartial<\n  FormsTranslationDefaultLocales[FormsTranslationLocale]\n>\nexport type FormsTranslationFlat =\n  TranslationObjectToFlat<FormsTranslation>\n\ntype CustomLocales = Partial<\n  Record<FormsTranslationLocale, FormsTranslation>\n>\n\nexport default function useTranslation<T = FormsTranslation>(\n  messages?:\n    | FormsTranslation\n    | CustomLocales\n    | Record<FormsTranslationLocale, T>\n) {\n  const { locale, translation: globalTranslation } =\n    useContext(SharedContext)\n  const { assignUtils } = useAdditionalUtils()\n\n  return useMemo(() => {\n    const translation = extendDeep(\n      {},\n      formsLocales[locale] || formsLocales[LOCALE],\n      globalTranslation\n    )\n\n    return assignUtils(\n      combineWithExternalTranslations({\n        translation,\n        messages,\n        locale,\n      })\n    ) as T & FormatMessage\n  }, [assignUtils, globalTranslation, locale, messages])\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,eAAA,GAAAH,OAAA;AAKA,IAAAI,gBAAA,GAAAJ,OAAA;AAEA,IAAAK,SAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAJ,sBAAA,CAAAF,OAAA;AAA+C,SAAAE,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAkBhC,SAASG,cAAcA,CACpCC,QAGqC,EACrC;EACA,MAAM;IAAEC,MAAM;IAAEC,WAAW,EAAEC;EAAkB,CAAC,GAC9C,IAAAC,iBAAU,EAACC,gBAAa,CAAC;EAC3B,MAAM;IAAEC;EAAY,CAAC,GAAG,IAAAC,kCAAkB,EAAC,CAAC;EAE5C,OAAO,IAAAC,cAAO,EAAC,MAAM;IACnB,MAAMN,WAAW,GAAG,IAAAO,2BAAU,EAC5B,CAAC,CAAC,EACFC,gBAAY,CAACT,MAAM,CAAC,IAAIS,gBAAY,CAACC,gBAAM,CAAC,EAC5CR,iBACF,CAAC;IAED,OAAOG,WAAW,CAChB,IAAAM,+CAA+B,EAAC;MAC9BV,WAAW;MACXF,QAAQ;MACRC;IACF,CAAC,CACH,CAAC;EACH,CAAC,EAAE,CAACK,WAAW,EAAEH,iBAAiB,EAAEF,MAAM,EAAED,QAAQ,CAAC,CAAC;AACxD"}

package/cjs/extensions/forms/hooks/useValueProps.d.ts

@@ -1,3 +1,3 @@
 import { ValueProps } from '../types';
 export type Props<Value> = ValueProps<Value>;
-export default function useValueProps<Value = unknown, Props extends ValueProps<Value> = ValueProps<Value>>(localeProps: Props): Props & ValueProps<Value>;
+export default function useValueProps<Value = unknown, Props extends ValueProps<Value> = ValueProps<Value>>(localProps: Props): Props & ValueProps<Value>;

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

@@ -20,13 +20,13 @@ function _toPrimitive(input, hint) { if (typeof input !== "object" || input ===
 const transformLabelParameters = {
   convertJsxToString: _componentHelper.convertJsxToString
 };
-function useValueProps(localeProps) {
+function useValueProps(localProps) {
   var _useExternalValue, _props$label, _fieldPropsRef$curren, _fieldPropsRef$curren2;
   const [, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
   const {
     extend
   } = (0, _react.useContext)(_ValueProviderContext.default);
-  const props = extend(localeProps);
+  const props = extend(localProps);
   const {
     path: pathProp,
     value: valueProp,

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

@@ -1 +1 @@
-{"version":3,"file":"useValueProps.js","names":["_react","require","_componentHelper","_useExternalValue2","_interopRequireDefault","_usePath","_Context","_ValueProviderContext","obj","__esModule","default","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","transformLabelParameters","convertJsxToString","useValueProps","localeProps","_useExternalValue","_props$label","_fieldPropsRef$curren","_fieldPropsRef$curren2","forceUpdate","useReducer","extend","useContext","ValueProviderContext","props","path","pathProp","valueProp","itemPath","defaultValue","inheritVisibility","inheritLabel","transformLabel","label","transformIn","toInput","fromExternal","transformers","useRef","usePath","externalValue","useExternalValue","fieldPropsRef","mountedFieldsRef","setValueProps","setFieldEventListener","DataContext","useEffect","requestAnimationFrame","shouldBeVisible","useCallback","_mountedFieldsRef$cur","item","current","isVisible","isPreMounted","wasStepChange"],"sources":["../../../../../src/extensions/forms/hooks/useValueProps.ts"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport { Path, ValueProps } from '../types'\nimport { convertJsxToString } from '../../../shared/component-helper'\nimport useExternalValue from './useExternalValue'\nimport usePath from './usePath'\nimport DataContext from '../DataContext/Context'\nimport ValueProviderContext from '../Value/Provider/ValueProviderContext'\n\nexport type Props<Value> = ValueProps<Value>\n\nconst transformLabelParameters = {\n  convertJsxToString,\n} as unknown as Parameters<Props<unknown>['transformLabel']>[1]\n\nexport default function useValueProps<\n  Value = unknown,\n  Props extends ValueProps<Value> = ValueProps<Value>,\n>(localeProps: Props): Props & ValueProps<Value> {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const { extend } = useContext(ValueProviderContext)\n  const props = extend(localeProps)\n\n  const {\n    path: pathProp,\n    value: valueProp,\n    itemPath,\n    defaultValue,\n    inheritVisibility,\n    inheritLabel,\n    transformLabel = (label: Props['label']) => label,\n    transformIn = (value: Value) => value,\n    toInput = (value: Value) => value,\n    fromExternal = (value: Value) => value,\n  } = props\n\n  const transformers = useRef({\n    transformIn,\n    toInput,\n    fromExternal,\n  })\n\n  const { path } = usePath({ path: pathProp, itemPath })\n\n  const externalValue =\n    useExternalValue<Value>({\n      path,\n      itemPath,\n      value: valueProp,\n      transformers,\n    }) ?? defaultValue\n\n  const {\n    fieldPropsRef,\n    mountedFieldsRef,\n    setValueProps,\n    setFieldEventListener,\n  } = useContext(DataContext) || {}\n  setValueProps?.(path, props)\n\n  useEffect(() => {\n    if (inheritLabel || inheritVisibility) {\n      setFieldEventListener?.(path, 'onMount', () => {\n        // This is needed to make values, rendered before the field, to get the correct visibility state\n        requestAnimationFrame(forceUpdate)\n      })\n    }\n  }, [setFieldEventListener, path, inheritVisibility, inheritLabel])\n\n  const shouldBeVisible = useCallback(\n    (path: Path): boolean => {\n      const item = mountedFieldsRef?.current?.[path]\n\n      if (!item || !inheritVisibility) {\n        return true\n      }\n\n      return (\n        item.isVisible !== false &&\n        (item.isPreMounted !== false || item.wasStepChange === true)\n      )\n    },\n    [inheritVisibility, mountedFieldsRef]\n  )\n\n  const value = shouldBeVisible(path)\n    ? transformIn(toInput(externalValue))\n    : undefined\n\n  const label = transformLabel(\n    props.label ??\n      (inheritLabel ? fieldPropsRef?.current?.[path]?.label : undefined),\n    transformLabelParameters\n  )\n\n  return { ...props, label, value }\n}\n"],"mappings":"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"}
+{"version":3,"file":"useValueProps.js","names":["_react","require","_componentHelper","_useExternalValue2","_interopRequireDefault","_usePath","_Context","_ValueProviderContext","obj","__esModule","default","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","transformLabelParameters","convertJsxToString","useValueProps","localProps","_useExternalValue","_props$label","_fieldPropsRef$curren","_fieldPropsRef$curren2","forceUpdate","useReducer","extend","useContext","ValueProviderContext","props","path","pathProp","valueProp","itemPath","defaultValue","inheritVisibility","inheritLabel","transformLabel","label","transformIn","toInput","fromExternal","transformers","useRef","usePath","externalValue","useExternalValue","fieldPropsRef","mountedFieldsRef","setValueProps","setFieldEventListener","DataContext","useEffect","requestAnimationFrame","shouldBeVisible","useCallback","_mountedFieldsRef$cur","item","current","isVisible","isPreMounted","wasStepChange"],"sources":["../../../../../src/extensions/forms/hooks/useValueProps.ts"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport { Path, ValueProps } from '../types'\nimport { convertJsxToString } from '../../../shared/component-helper'\nimport useExternalValue from './useExternalValue'\nimport usePath from './usePath'\nimport DataContext from '../DataContext/Context'\nimport ValueProviderContext from '../Value/Provider/ValueProviderContext'\n\nexport type Props<Value> = ValueProps<Value>\n\nconst transformLabelParameters = {\n  convertJsxToString,\n} as unknown as Parameters<Props<unknown>['transformLabel']>[1]\n\nexport default function useValueProps<\n  Value = unknown,\n  Props extends ValueProps<Value> = ValueProps<Value>,\n>(localProps: Props): Props & ValueProps<Value> {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const { extend } = useContext(ValueProviderContext)\n  const props = extend(localProps)\n\n  const {\n    path: pathProp,\n    value: valueProp,\n    itemPath,\n    defaultValue,\n    inheritVisibility,\n    inheritLabel,\n    transformLabel = (label: Props['label']) => label,\n    transformIn = (value: Value) => value,\n    toInput = (value: Value) => value,\n    fromExternal = (value: Value) => value,\n  } = props\n\n  const transformers = useRef({\n    transformIn,\n    toInput,\n    fromExternal,\n  })\n\n  const { path } = usePath({ path: pathProp, itemPath })\n\n  const externalValue =\n    useExternalValue<Value>({\n      path,\n      itemPath,\n      value: valueProp,\n      transformers,\n    }) ?? defaultValue\n\n  const {\n    fieldPropsRef,\n    mountedFieldsRef,\n    setValueProps,\n    setFieldEventListener,\n  } = useContext(DataContext) || {}\n  setValueProps?.(path, props)\n\n  useEffect(() => {\n    if (inheritLabel || inheritVisibility) {\n      setFieldEventListener?.(path, 'onMount', () => {\n        // This is needed to make values, rendered before the field, to get the correct visibility state\n        requestAnimationFrame(forceUpdate)\n      })\n    }\n  }, [setFieldEventListener, path, inheritVisibility, inheritLabel])\n\n  const shouldBeVisible = useCallback(\n    (path: Path): boolean => {\n      const item = mountedFieldsRef?.current?.[path]\n\n      if (!item || !inheritVisibility) {\n        return true\n      }\n\n      return (\n        item.isVisible !== false &&\n        (item.isPreMounted !== false || item.wasStepChange === true)\n      )\n    },\n    [inheritVisibility, mountedFieldsRef]\n  )\n\n  const value = shouldBeVisible(path)\n    ? transformIn(toInput(externalValue))\n    : undefined\n\n  const label = transformLabel(\n    props.label ??\n      (inheritLabel ? fieldPropsRef?.current?.[path]?.label : undefined),\n    transformLabelParameters\n  )\n\n  return { ...props, label, value }\n}\n"],"mappings":"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"}

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

@@ -285,6 +285,9 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   flex-grow: 1;
 }
 @media screen and (min-width: 25.00625em) {
+  .dnb-forms-field-block--width-custom {
+    width: calc(var(--dnb-forms-field-block-width));
+  }
   .dnb-forms-field-block--width-small {
     width: var(--forms-field-width--small);
   }
@@ -324,6 +327,9 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   width: 100%;
 }
 @media screen and (min-width: 25.00625em) {
+  .dnb-forms-field-block__contents--width-custom {
+    width: calc(var(--dnb-forms-field-block-content-width));
+  }
   .dnb-forms-field-block__contents--width-small {
     width: var(--forms-field-width--small);
   }

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

@@ -1 +1 @@
-@charset "UTF-8";.dnb-forms-field-array-selection{--row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--row-gap)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-block__label{align-items:flex-start}.dnb-forms-field-array-selection--variant-checkbox.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--variant-button.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-block__label{line-height:2.5rem}.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;row-gap:var(--row-gap)}@media screen and (min-width:40.00625em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.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{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }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-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--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-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--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-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--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-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-input__border{flex-grow:1}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.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__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}.dnb-forms-field-selection .dnb-forms-field-block__contents{display:flex}.dnb-forms-field-selection .dnb-radio-group .dnb-height-animation,.dnb-forms-field-selection .dnb-radio-group>.dnb-flex-container,.dnb-forms-field-selection .dnb-toggle-button-group .dnb-height-animation,.dnb-forms-field-selection .dnb-toggle-button-group>.dnb-flex-container{flex-grow:1;width:100%}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}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--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .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:25.00625em){.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__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25.00625em){.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-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25.00625em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}.dnb-forms-field-block__contents__composition--horizontal[class*=align-center]{align-items:center}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40.00625em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40.00625em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-section-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-section-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-section-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-section-block__inner{flex:1;margin-bottom:var(--space);outline:none;padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-section-block--variant-basic .dnb-forms-section-block__inner,.dnb-forms-section-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-section-block--variant-outline .dnb-forms-section-block__inner[class*=dnb-flex-container--spacing]{box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-section-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-section-block--no-animation .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-forms-section-block.dnb-height-animation--is-visible .dnb-forms-section-block__inner{transform:translateY(-.5rem)}.dnb-forms-section-block.dnb-height-animation--parallax .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(>.dnb-forms-section-block){margin-top:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal) .dnb-dt,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal)>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25.00625em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-none{--column-gap:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25.00625em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__indicator{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40.00625em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60.00625em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}
+@charset "UTF-8";.dnb-forms-field-array-selection{--row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--row-gap)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-block__label{align-items:flex-start}.dnb-forms-field-array-selection--variant-checkbox.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--variant-button.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-block__label{line-height:2.5rem}.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;row-gap:var(--row-gap)}@media screen and (min-width:40.00625em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.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{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }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-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--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-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--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-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--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-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-stretch .dnb-input__border{flex-grow:1}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.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__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}.dnb-forms-field-selection .dnb-forms-field-block__contents{display:flex}.dnb-forms-field-selection .dnb-radio-group .dnb-height-animation,.dnb-forms-field-selection .dnb-radio-group>.dnb-flex-container,.dnb-forms-field-selection .dnb-toggle-button-group .dnb-height-animation,.dnb-forms-field-selection .dnb-toggle-button-group>.dnb-flex-container{flex-grow:1;width:100%}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}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--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .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:25.00625em){.dnb-forms-field-block--width-custom{width:calc(var(--dnb-forms-field-block-width))}.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__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25.00625em){.dnb-forms-field-block__contents--width-custom{width:calc(var(--dnb-forms-field-block-content-width))}.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-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25.00625em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}.dnb-forms-field-block__contents__composition--horizontal[class*=align-center]{align-items:center}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40.00625em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40.00625em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-section-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-section-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-section-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-section-block__inner{flex:1;margin-bottom:var(--space);outline:none;padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-section-block--variant-basic .dnb-forms-section-block__inner,.dnb-forms-section-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-section-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-section-block--variant-outline .dnb-forms-section-block__inner[class*=dnb-flex-container--spacing]{box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-section-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-section-block--no-animation .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-forms-section-block.dnb-height-animation--is-visible .dnb-forms-section-block__inner{transform:translateY(-.5rem)}.dnb-forms-section-block.dnb-height-animation--parallax .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(>.dnb-forms-section-block){margin-top:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal) .dnb-dt,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal)>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25.00625em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-none{--column-gap:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25.00625em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__indicator{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40.00625em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60.00625em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}

package/cjs/extensions/forms/types.d.ts

@@ -127,7 +127,8 @@ export type FieldBlockProps = {
 /**
  * The width of a field block
  */
-export type FieldBlockWidth = false | 'small' | 'medium' | 'large' | 'stretch';
+export type CustomWidth = `${number}rem`;
+export type FieldBlockWidth = false | 'small' | 'medium' | 'large' | 'stretch' | CustomWidth;
 export interface UseFieldProps<Value = unknown, EmptyValue = undefined | unknown, ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages> extends DataValueReadWriteComponentProps<Value, EmptyValue>, AriaAttributes {
     /**
      * ID added to the actual field component, and linked to the label via for-attribute

package/cjs/extensions/forms/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["FormError","Error","constructor","message","options","_defineProperty","key","exports","dataValueReadProps","pickDataValueReadProps","props","Object","fromEntries","entries","filter","_ref","includes","omitDataValueReadProps","_ref2","dataValueWriteProps","pickDataValueWriteProps","_ref3","omitDataValueWriteProps","_ref4","pickDataValueReadWriteProps","_ref5","omitDataValueReadWriteProps","_ref6"],"sources":["../../../../src/extensions/forms/types.ts"],"sourcesContent":["import type { SpacingProps } from '../../components/space/types'\nimport type { JSONSchema4, JSONSchema6, JSONSchema7 } from 'json-schema'\nimport type { JSONSchemaType } from 'ajv/dist/2020'\nimport { JsonObject } from './utils/json-pointer'\nimport { AriaAttributes } from 'react'\nimport { FilterData, VisibleDataOptions } from './DataContext'\n\nexport type * from 'json-schema'\nexport type JSONSchema = JSONSchema7\nexport type AllJSONSchemaVersionsBasis<DataType> =\n  | JSONSchema4\n  | JSONSchema6\n  | JSONSchema7\n  | JSONSchemaType<DataType>\nexport type AllJSONSchemaVersions<DataType = unknown> =\n  | AllJSONSchemaVersionsBasis<DataType>\n\n  // In order to support \"schema = { ... } as const\"\n  | (Omit<AllJSONSchemaVersionsBasis<DataType>, 'required'> & {\n      required?: readonly string[]\n    })\nexport { JSONSchemaType }\n\ntype ValidationRule = 'type' | 'pattern' | 'required' | string\ntype MessageValues = Record<string, string>\nexport type ValidatorReturnSync<Value> =\n  | Error\n  | undefined\n  | void\n  | Array<Validator<Value>>\n\nexport type ValidatorReturnAsync<Value> =\n  | ValidatorReturnSync<Value>\n  | Promise<ValidatorReturnSync<Value>>\nexport type Validator<Value, ErrorMessages = DefaultErrorMessages> = (\n  value: Value,\n  additionalArgs?: ValidatorAdditionalArgs<Value, ErrorMessages>\n) => ValidatorReturnAsync<Value>\nexport type ValidatorAdditionalArgs<\n  Value,\n  ErrorMessages = DefaultErrorMessages,\n> = {\n  /**\n   * Returns the error messages from the { errorMessages } object.\n   */\n  errorMessages: ErrorMessages\n\n  /**\n   * Connects the validator to another field.\n   * This allows you to rerun the validator function once the value of the connected field changes.\n   */\n  connectWithPath: (path: Path) => { getValue: () => Value }\n\n  /**\n   * Returns the validators from the { exportValidators } object.\n   */\n  validators: Record<string, Validator<Value>>\n} & {\n  /** @deprecated use the error messages from the { errorMessages } object instead. */\n  pattern: string\n  /** @deprecated use the error messages from the { errorMessages } object instead. */\n  required: string\n}\n\ninterface IFormErrorOptions {\n  validationRule?: ValidationRule\n  messageValues?: MessageValues\n}\n\n/**\n * Standard error object for Eufemia Forms, extending the built-in error with additional information for data handling\n */\nexport class FormError extends Error {\n  /**\n   * What validation rule did the error occur based on? (i.e: minLength, required or maximum)\n   */\n  validationRule?: ValidationRule\n\n  /**\n   * Replacement values relevant for this error.\n   * @example { minLength: 3 } to be able to replace values in a message like \"Minimum {minLength} characters\"\n   */\n  messageValues?: MessageValues\n\n  constructor(message: string, options?: IFormErrorOptions) {\n    super(message)\n\n    if (options) {\n      for (const key in options) {\n        this[key] = options[key]\n      }\n    }\n  }\n}\n\n/**\n * Accept any key, so custom message keys can be used\n */\nexport type CustomErrorMessages = Record<string, string>\n\n/**\n * Accept any key, so custom message keys can be used\n * including the path to the field the message is for\n */\nexport type CustomErrorMessagesWithPaths =\n  | CustomErrorMessages\n  | {\n      // eslint-disable-next-line no-unused-vars\n      [K in `/${string}`]?: CustomErrorMessages\n    }\n\nexport interface DefaultErrorMessages {\n  required?: string\n  pattern?: string\n}\n\nexport interface DataValueReadProps<Value = unknown> {\n  /** JSON Pointer for where the data for this field is located in the source dataset */\n  path?: Path\n  /** JSON Pointer for where the data for this field is located in the source iterate loop element */\n  itemPath?: Path\n  /** Source data value for the field. Will take precedence over the path value given in the data context */\n  value?: Value\n  /** Default source data value for the field. Will not take precedence over the path value given in the data context */\n  defaultValue?: Value\n}\n\nconst dataValueReadProps = ['path', 'itemPath', 'value']\n\nexport function pickDataValueReadProps<Props extends DataValueReadProps>(\n  props: Props\n): DataValueReadProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(([key]) =>\n      dataValueReadProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueReadProps<Props extends DataValueReadProps>(\n  props: Props\n): Omit<DataValueReadProps, keyof DataValueReadProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) => !dataValueReadProps.includes(key)\n    )\n  )\n}\n\ntype EventArgs<\n  Value,\n  ExtraValue extends AdditionalEventArgs,\n> = ExtraValue extends undefined\n  ? [value: Value]\n  : [value: Value, additionalArgs?: ExtraValue]\n\nexport interface DataValueWriteProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ExtraValue extends AdditionalEventArgs = undefined,\n> {\n  emptyValue?: EmptyValue\n  onFocus?: (...args: EventArgs<Value | EmptyValue, ExtraValue>) => void\n  onBlur?: (...args: EventArgs<Value | EmptyValue, ExtraValue>) => void\n  onChange?: (\n    ...args: EventArgs<Value | EmptyValue, ExtraValue>\n  ) => OnChangeReturnType\n}\n\nconst dataValueWriteProps = ['emptyValue', 'onFocus', 'onBlur', 'onChange']\n\nexport function pickDataValueWriteProps<Props extends DataValueWriteProps>(\n  props: Props\n): DataValueWriteProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(([key]) =>\n      dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueWriteProps<Props extends DataValueWriteProps>(\n  props: Props\n): Omit<DataValueWriteProps, keyof DataValueWriteProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) => !dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport type DataValueReadWriteProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n> = DataValueReadProps<Value> & DataValueWriteProps<Value, EmptyValue>\n\nexport function pickDataValueReadWriteProps<\n  Props extends DataValueReadWriteProps,\n>(props: Props): DataValueReadWriteProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) =>\n        dataValueReadProps.includes(key) ||\n        dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueReadWriteProps<\n  Props extends DataValueReadWriteProps,\n>(\n  props: Props\n): Omit<DataValueReadWriteProps, keyof DataValueReadWriteProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) =>\n        !dataValueReadProps.includes(key) &&\n        !dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport type ComponentProps = SpacingProps & {\n  className?: string\n}\n\nexport type AdditionalEventArgs = Record<string, unknown>\n\nexport type DataValueReadComponentProps<Value = unknown> = ComponentProps &\n  DataValueReadProps<Value>\n\nexport type DataValueReadWriteComponentProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n> = ComponentProps &\n  DataValueReadProps<Value> &\n  DataValueWriteProps<Value, EmptyValue>\n\nexport type FieldBlockProps = {\n  /**\n   * The layout of the field block\n   */\n  layout?: 'horizontal' | 'vertical'\n  /**\n   * Main label text for the field\n   */\n  label?: React.ReactNode\n  /**\n   * Will append an additional text to the label, like \"(optional)\" or \"(recommended)\"\n   */\n  labelSuffix?: React.ReactNode\n  /**\n   * A more discreet text displayed beside the label\n   */\n  labelDescription?: React.ReactNode\n  /**\n   * Text showing in place of the value if no value is given\n   */\n  placeholder?: React.ReactNode\n}\n\n/**\n * The width of a field block\n */\nexport type FieldBlockWidth =\n  | false\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'stretch'\n\nexport interface UseFieldProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> extends DataValueReadWriteComponentProps<Value, EmptyValue>,\n    AriaAttributes {\n  // - HTML Element Attributes\n  /**\n   * ID added to the actual field component, and linked to the label via for-attribute\n   */\n  id?: Identifier\n  name?: string\n  disabled?: boolean\n  readOnly?: boolean\n  autoComplete?:\n    | HTMLInputElement['autocomplete']\n    | HTMLTextAreaElement['autocomplete']\n\n  /**\n   * NB: Undocumented for now.\n   * Forwards all possible props to the underlying component.\n   */\n  htmlAttributes?: Record<string, unknown>\n\n  /**\n   * NB: Undocumented for now.\n   * Forwards all given props in a props object.\n   */\n  props?: Record<string, unknown>\n\n  // - Used by useFieldProps and FieldBlock\n  info?: React.ReactNode\n  warning?: React.ReactNode\n  error?: Error | FormError\n\n  // - Validation\n  required?: boolean\n  schema?: AllJSONSchemaVersions<Value>\n  validator?: Validator<Value>\n  onBlurValidator?: Validator<Value>\n  exportValidators?: Record<string, Validator<Value>>\n  validateRequired?: (\n    internal: Value,\n    {\n      emptyValue,\n      required,\n      isChanged,\n      error,\n    }: {\n      emptyValue: EmptyValue\n      required: boolean\n      isChanged: boolean\n      error: FormError | undefined\n    }\n  ) => FormError | undefined\n  /**\n   * Should error messages based on validation be shown initially (from given value-prop or source data)\n   * before the user interacts with the field?\n   * @default false\n   */\n  validateInitially?: boolean\n  /**\n   * Should error messages be shown when touching (like focusing a field and blurring) without having changed\n   * the value? So the user did not introduce a new error, but it was invalid based on validation initially.\n   */\n  validateUnchanged?: boolean\n  /**\n   * Should validation be done while writing, not just when blurring the field?\n   */\n  continuousValidation?: boolean\n  /**\n   * Provide custom error messages for the field\n   */\n  errorMessages?: ErrorMessages\n\n  // - Derivatives\n\n  /**\n   * Transforms the `value` before its displayed in the field (e.g. input).\n   * Public API. Should not be used internally.\n   */\n  transformIn?: (external: unknown) => Value\n\n  /**\n   * Transforms the value before it gets forwarded to the form data object or returned as the onChange value parameter.\n   * Public API. Should not be used internally.\n   */\n  transformOut?: (internal: Value, additionalArgs?: unknown) => unknown\n\n  /**\n   * Transforms the value given by `handleChange` after `fromInput` and before `updateValue` and `toEvent`. The second parameter returns the current value.\n   */\n  transformValue?: (value: Value, currentValue?: Value) => Value\n\n  /**\n   * Transform additionalArgs or generate it based on `value`.\n   */\n  provideAdditionalArgs?: (\n    value: Value,\n    additionalArgs?: AdditionalEventArgs\n  ) => AdditionalEventArgs\n\n  /**\n   * Transforms the value before it gets returned as the `value`.\n   */\n  toInput?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the internal value before it gets returned by even callbacks such as `onChange`, `onFocus` and `onBlur`. The second parameter returns the event type: `onChange`, `onFocus`, `onBlur` or `onBlurValidator`.\n   */\n  toEvent?: (\n    internal: Value,\n    type: 'onChange' | 'onFocus' | 'onBlur' | 'onBlurValidator'\n  ) => Value\n\n  /**\n   * Transforms the value given by `handleChange` before it is used in the further process flow. Use it to destruct the value from the original event object.\n   */\n  fromInput?: (external: Value | unknown) => Value\n\n  /**\n   * Transforms the given props `value` before any other step gets entered.\n   */\n  fromExternal?: (external: Value) => Value\n\n  /**\n   * For internal use only.\n   */\n  valueType?: string | number | boolean | Array<string | number | boolean>\n}\n\nexport type FieldProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = UseFieldProps<Value, EmptyValue, ErrorMessages> & FieldBlockProps\n\nexport type FieldPropsGeneric<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = Omit<\n  FieldProps<Value, EmptyValue, ErrorMessages>,\n  keyof DataValueWriteProps\n> &\n  DataValueWriteProps<Value, EmptyValue, AdditionalEventArgs>\n\nexport type FieldPropsWithExtraValue<\n  Value = unknown,\n  ExtraValue extends AdditionalEventArgs = AdditionalEventArgs,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = Omit<\n  FieldProps<Value, EmptyValue, ErrorMessages>,\n  keyof DataValueWriteProps\n> &\n  DataValueWriteProps<Value, EmptyValue, ExtraValue>\n\nexport interface FieldHelpProps {\n  help?: {\n    title?: string\n    content?: React.ReactNode\n  }\n}\n\nexport interface ValueProps<Value = unknown>\n  extends DataValueReadComponentProps<Value> {\n  /**\n   * Field label to show above the data value.\n   */\n  label?: React.ReactNode\n\n  /**\n   * Use `true` to inherit the label from a visible (rendered) field with the same path.\n   */\n  inheritLabel?: boolean\n\n  /**\n   * Use `true` to inherit the visibility from a field with the same path.\n   */\n  inheritVisibility?: boolean\n\n  /**\n   * Shows the value even if it is empty.\n   */\n  showEmpty?: boolean\n\n  /**\n   * Text showing in place of the value if no value is given.\n   */\n  placeholder?: React.ReactNode\n\n  /**\n   * For showing the value inline (not as a block element)\n   */\n  inline?: boolean\n\n  /** The max-width of a value block. Defaults to large */\n  maxWidth?: 'small' | 'medium' | 'large' | 'auto'\n\n  /**\n   * Transforms the label before it gets displayed. Receives the label as the first parameter. The second parameter is a object containing the `convertJsxToString` function.\n   */\n  transformLabel?: (\n    label: React.ReactNode,\n    convertJsxToString: (label: React.ReactNode) => string\n  ) => React.ReactNode\n\n  /**\n   * Transforms the `value` before its displayed in the field (e.g. input).\n   * Public API. Should not be used internally.\n   */\n  transformIn?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the value before it gets returned as the `value`.\n   */\n  toInput?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the given props `value` before any other step gets entered.\n   */\n  fromExternal?: (external: Value) => Value\n}\n\nexport type Path = string\nexport type Identifier = string\n\nexport type SubmitState =\n  | 'pending' // Used for async operations\n  | 'complete' // Used to hide the submit indicator\n  | 'success' // Used for fields\n  | 'error' // Used when error is shown\n  | 'abort' // Used to abort the state regardless (step change)\n\n/**\n * Provide a error that shows in the FormStatus of a field.\n */\ntype EventStateObjectError = Error\n/**\n * Provide a warning that shows in the FormStatus of a field.\n */\ntype EventStateObjectWarning = React.ReactNode\n/**\n * Provide an info that shows in the FormStatus of a field.\n */\ntype EventStateObjectInfo = React.ReactNode\n\n/**\n * Provide a status that will enforce the form to stay in pending state\n */\ntype EventStateObjectStatus = 'pending'\n\n/**\n * Provide a success state that will show an indicator on the related field label\n */\ntype EventStateObjectSuccess = 'saved'\n\n/**\n * Provide an error or status messages that shows in the FormStatus of a field\n */\nexport type EventStateObjectOr = {\n  error?: EventStateObjectError\n  warning?: EventStateObjectWarning\n  info?: EventStateObjectInfo\n  pending?: EventStateObjectStatus\n  customStatus?: unknown\n}\n\nexport type EventStateObjectEitherOr =\n  | { error: EventStateObjectError }\n  | { warning: EventStateObjectWarning }\n  | { info: EventStateObjectInfo }\n  | { status: EventStateObjectStatus }\n  | { customStatus: unknown }\n\nexport type EventStateObject = EventStateObjectOr &\n  EventStateObjectEitherOr\n\n/**\n * Provide 'saved' to indicate the data has been saved successfully. Can not be combined with `error`.\n */\nexport type EventStateObjectWithSuccess = EventStateObjectOr & {\n  success?: EventStateObjectSuccess\n} & (EventStateObjectEitherOr | { success: EventStateObjectSuccess })\n\n/**\n * Provide an error or status messages that shows in the FormStatus of a field\n */\nexport type EventReturnWithStateObject = Error | EventStateObject\n\nexport type EventReturnWithStateObjectAndSuccess =\n  | Error\n  | EventStateObjectWithSuccess\n\nexport type OnSubmitParams = {\n  /** Will remove data entries of fields that are not visible */\n  reduceToVisibleFields: (\n    data: JsonObject,\n    options?: VisibleDataOptions\n  ) => Partial<JsonObject>\n\n  /** Will filter data based on the given \"filterDataHandler\" method */\n  filterData: (filterDataHandler: FilterData) => Partial<JsonObject>\n\n  /** Will remove browser-side stored autocomplete data  */\n  resetForm: () => void\n\n  /** Will empty the whole internal data set of the form  */\n  clearData: () => void\n}\n\nexport type OnSubmitReturn =\n  | EventReturnWithStateObject\n  | void\n  | Promise<EventReturnWithStateObject | void>\nexport type OnSubmit<Data = JsonObject> = (\n  data: Data,\n  {\n    reduceToVisibleFields,\n    filterData,\n    resetForm,\n    clearData,\n  }: OnSubmitParams\n) => OnSubmitReturn\n\nexport type OnCommit<Data = JsonObject> = (\n  data: Data,\n  {\n    clearData,\n    preventCommit,\n  }: {\n    clearData: () => void\n    preventCommit?: () => void\n  }\n) =>\n  | EventReturnWithStateObject\n  | void\n  | Promise<EventReturnWithStateObject | void>\n\nexport type OnChange<Data = JsonObject> = (\n  data: Data,\n  additionalArgs: Pick<OnSubmitParams, 'filterData'>\n) => OnChangeReturnType\n\ntype OnChangeReturnType =\n  | EventReturnWithStateObjectAndSuccess\n  | void\n  | Promise<EventReturnWithStateObjectAndSuccess | void>\n"],"mappings":"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"}
+{"version":3,"file":"types.js","names":["FormError","Error","constructor","message","options","_defineProperty","key","exports","dataValueReadProps","pickDataValueReadProps","props","Object","fromEntries","entries","filter","_ref","includes","omitDataValueReadProps","_ref2","dataValueWriteProps","pickDataValueWriteProps","_ref3","omitDataValueWriteProps","_ref4","pickDataValueReadWriteProps","_ref5","omitDataValueReadWriteProps","_ref6"],"sources":["../../../../src/extensions/forms/types.ts"],"sourcesContent":["import type { SpacingProps } from '../../components/space/types'\nimport type { JSONSchema4, JSONSchema6, JSONSchema7 } from 'json-schema'\nimport type { JSONSchemaType } from 'ajv/dist/2020'\nimport { JsonObject } from './utils/json-pointer'\nimport { AriaAttributes } from 'react'\nimport { FilterData, VisibleDataOptions } from './DataContext'\n\nexport type * from 'json-schema'\nexport type JSONSchema = JSONSchema7\nexport type AllJSONSchemaVersionsBasis<DataType> =\n  | JSONSchema4\n  | JSONSchema6\n  | JSONSchema7\n  | JSONSchemaType<DataType>\nexport type AllJSONSchemaVersions<DataType = unknown> =\n  | AllJSONSchemaVersionsBasis<DataType>\n\n  // In order to support \"schema = { ... } as const\"\n  | (Omit<AllJSONSchemaVersionsBasis<DataType>, 'required'> & {\n      required?: readonly string[]\n    })\nexport { JSONSchemaType }\n\ntype ValidationRule = 'type' | 'pattern' | 'required' | string\ntype MessageValues = Record<string, string>\nexport type ValidatorReturnSync<Value> =\n  | Error\n  | undefined\n  | void\n  | Array<Validator<Value>>\n\nexport type ValidatorReturnAsync<Value> =\n  | ValidatorReturnSync<Value>\n  | Promise<ValidatorReturnSync<Value>>\nexport type Validator<Value, ErrorMessages = DefaultErrorMessages> = (\n  value: Value,\n  additionalArgs?: ValidatorAdditionalArgs<Value, ErrorMessages>\n) => ValidatorReturnAsync<Value>\nexport type ValidatorAdditionalArgs<\n  Value,\n  ErrorMessages = DefaultErrorMessages,\n> = {\n  /**\n   * Returns the error messages from the { errorMessages } object.\n   */\n  errorMessages: ErrorMessages\n\n  /**\n   * Connects the validator to another field.\n   * This allows you to rerun the validator function once the value of the connected field changes.\n   */\n  connectWithPath: (path: Path) => { getValue: () => Value }\n\n  /**\n   * Returns the validators from the { exportValidators } object.\n   */\n  validators: Record<string, Validator<Value>>\n} & {\n  /** @deprecated use the error messages from the { errorMessages } object instead. */\n  pattern: string\n  /** @deprecated use the error messages from the { errorMessages } object instead. */\n  required: string\n}\n\ninterface IFormErrorOptions {\n  validationRule?: ValidationRule\n  messageValues?: MessageValues\n}\n\n/**\n * Standard error object for Eufemia Forms, extending the built-in error with additional information for data handling\n */\nexport class FormError extends Error {\n  /**\n   * What validation rule did the error occur based on? (i.e: minLength, required or maximum)\n   */\n  validationRule?: ValidationRule\n\n  /**\n   * Replacement values relevant for this error.\n   * @example { minLength: 3 } to be able to replace values in a message like \"Minimum {minLength} characters\"\n   */\n  messageValues?: MessageValues\n\n  constructor(message: string, options?: IFormErrorOptions) {\n    super(message)\n\n    if (options) {\n      for (const key in options) {\n        this[key] = options[key]\n      }\n    }\n  }\n}\n\n/**\n * Accept any key, so custom message keys can be used\n */\nexport type CustomErrorMessages = Record<string, string>\n\n/**\n * Accept any key, so custom message keys can be used\n * including the path to the field the message is for\n */\nexport type CustomErrorMessagesWithPaths =\n  | CustomErrorMessages\n  | {\n      // eslint-disable-next-line no-unused-vars\n      [K in `/${string}`]?: CustomErrorMessages\n    }\n\nexport interface DefaultErrorMessages {\n  required?: string\n  pattern?: string\n}\n\nexport interface DataValueReadProps<Value = unknown> {\n  /** JSON Pointer for where the data for this field is located in the source dataset */\n  path?: Path\n  /** JSON Pointer for where the data for this field is located in the source iterate loop element */\n  itemPath?: Path\n  /** Source data value for the field. Will take precedence over the path value given in the data context */\n  value?: Value\n  /** Default source data value for the field. Will not take precedence over the path value given in the data context */\n  defaultValue?: Value\n}\n\nconst dataValueReadProps = ['path', 'itemPath', 'value']\n\nexport function pickDataValueReadProps<Props extends DataValueReadProps>(\n  props: Props\n): DataValueReadProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(([key]) =>\n      dataValueReadProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueReadProps<Props extends DataValueReadProps>(\n  props: Props\n): Omit<DataValueReadProps, keyof DataValueReadProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) => !dataValueReadProps.includes(key)\n    )\n  )\n}\n\ntype EventArgs<\n  Value,\n  ExtraValue extends AdditionalEventArgs,\n> = ExtraValue extends undefined\n  ? [value: Value]\n  : [value: Value, additionalArgs?: ExtraValue]\n\nexport interface DataValueWriteProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ExtraValue extends AdditionalEventArgs = undefined,\n> {\n  emptyValue?: EmptyValue\n  onFocus?: (...args: EventArgs<Value | EmptyValue, ExtraValue>) => void\n  onBlur?: (...args: EventArgs<Value | EmptyValue, ExtraValue>) => void\n  onChange?: (\n    ...args: EventArgs<Value | EmptyValue, ExtraValue>\n  ) => OnChangeReturnType\n}\n\nconst dataValueWriteProps = ['emptyValue', 'onFocus', 'onBlur', 'onChange']\n\nexport function pickDataValueWriteProps<Props extends DataValueWriteProps>(\n  props: Props\n): DataValueWriteProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(([key]) =>\n      dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueWriteProps<Props extends DataValueWriteProps>(\n  props: Props\n): Omit<DataValueWriteProps, keyof DataValueWriteProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) => !dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport type DataValueReadWriteProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n> = DataValueReadProps<Value> & DataValueWriteProps<Value, EmptyValue>\n\nexport function pickDataValueReadWriteProps<\n  Props extends DataValueReadWriteProps,\n>(props: Props): DataValueReadWriteProps {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) =>\n        dataValueReadProps.includes(key) ||\n        dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport function omitDataValueReadWriteProps<\n  Props extends DataValueReadWriteProps,\n>(\n  props: Props\n): Omit<DataValueReadWriteProps, keyof DataValueReadWriteProps> {\n  return Object.fromEntries(\n    Object.entries(props ?? {}).filter(\n      ([key]) =>\n        !dataValueReadProps.includes(key) &&\n        !dataValueWriteProps.includes(key)\n    )\n  )\n}\n\nexport type ComponentProps = SpacingProps & {\n  className?: string\n}\n\nexport type AdditionalEventArgs = Record<string, unknown>\n\nexport type DataValueReadComponentProps<Value = unknown> = ComponentProps &\n  DataValueReadProps<Value>\n\nexport type DataValueReadWriteComponentProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n> = ComponentProps &\n  DataValueReadProps<Value> &\n  DataValueWriteProps<Value, EmptyValue>\n\nexport type FieldBlockProps = {\n  /**\n   * The layout of the field block\n   */\n  layout?: 'horizontal' | 'vertical'\n  /**\n   * Main label text for the field\n   */\n  label?: React.ReactNode\n  /**\n   * Will append an additional text to the label, like \"(optional)\" or \"(recommended)\"\n   */\n  labelSuffix?: React.ReactNode\n  /**\n   * A more discreet text displayed beside the label\n   */\n  labelDescription?: React.ReactNode\n  /**\n   * Text showing in place of the value if no value is given\n   */\n  placeholder?: React.ReactNode\n}\n\n/**\n * The width of a field block\n */\nexport type CustomWidth = `${number}rem`\nexport type FieldBlockWidth =\n  | false\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'stretch'\n  | CustomWidth\n\nexport interface UseFieldProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> extends DataValueReadWriteComponentProps<Value, EmptyValue>,\n    AriaAttributes {\n  // - HTML Element Attributes\n  /**\n   * ID added to the actual field component, and linked to the label via for-attribute\n   */\n  id?: Identifier\n  name?: string\n  disabled?: boolean\n  readOnly?: boolean\n  autoComplete?:\n    | HTMLInputElement['autocomplete']\n    | HTMLTextAreaElement['autocomplete']\n\n  /**\n   * NB: Undocumented for now.\n   * Forwards all possible props to the underlying component.\n   */\n  htmlAttributes?: Record<string, unknown>\n\n  /**\n   * NB: Undocumented for now.\n   * Forwards all given props in a props object.\n   */\n  props?: Record<string, unknown>\n\n  // - Used by useFieldProps and FieldBlock\n  info?: React.ReactNode\n  warning?: React.ReactNode\n  error?: Error | FormError\n\n  // - Validation\n  required?: boolean\n  schema?: AllJSONSchemaVersions<Value>\n  validator?: Validator<Value>\n  onBlurValidator?: Validator<Value>\n  exportValidators?: Record<string, Validator<Value>>\n  validateRequired?: (\n    internal: Value,\n    {\n      emptyValue,\n      required,\n      isChanged,\n      error,\n    }: {\n      emptyValue: EmptyValue\n      required: boolean\n      isChanged: boolean\n      error: FormError | undefined\n    }\n  ) => FormError | undefined\n  /**\n   * Should error messages based on validation be shown initially (from given value-prop or source data)\n   * before the user interacts with the field?\n   * @default false\n   */\n  validateInitially?: boolean\n  /**\n   * Should error messages be shown when touching (like focusing a field and blurring) without having changed\n   * the value? So the user did not introduce a new error, but it was invalid based on validation initially.\n   */\n  validateUnchanged?: boolean\n  /**\n   * Should validation be done while writing, not just when blurring the field?\n   */\n  continuousValidation?: boolean\n  /**\n   * Provide custom error messages for the field\n   */\n  errorMessages?: ErrorMessages\n\n  // - Derivatives\n\n  /**\n   * Transforms the `value` before its displayed in the field (e.g. input).\n   * Public API. Should not be used internally.\n   */\n  transformIn?: (external: unknown) => Value\n\n  /**\n   * Transforms the value before it gets forwarded to the form data object or returned as the onChange value parameter.\n   * Public API. Should not be used internally.\n   */\n  transformOut?: (internal: Value, additionalArgs?: unknown) => unknown\n\n  /**\n   * Transforms the value given by `handleChange` after `fromInput` and before `updateValue` and `toEvent`. The second parameter returns the current value.\n   */\n  transformValue?: (value: Value, currentValue?: Value) => Value\n\n  /**\n   * Transform additionalArgs or generate it based on `value`.\n   */\n  provideAdditionalArgs?: (\n    value: Value,\n    additionalArgs?: AdditionalEventArgs\n  ) => AdditionalEventArgs\n\n  /**\n   * Transforms the value before it gets returned as the `value`.\n   */\n  toInput?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the internal value before it gets returned by even callbacks such as `onChange`, `onFocus` and `onBlur`. The second parameter returns the event type: `onChange`, `onFocus`, `onBlur` or `onBlurValidator`.\n   */\n  toEvent?: (\n    internal: Value,\n    type: 'onChange' | 'onFocus' | 'onBlur' | 'onBlurValidator'\n  ) => Value\n\n  /**\n   * Transforms the value given by `handleChange` before it is used in the further process flow. Use it to destruct the value from the original event object.\n   */\n  fromInput?: (external: Value | unknown) => Value\n\n  /**\n   * Transforms the given props `value` before any other step gets entered.\n   */\n  fromExternal?: (external: Value) => Value\n\n  /**\n   * For internal use only.\n   */\n  valueType?: string | number | boolean | Array<string | number | boolean>\n}\n\nexport type FieldProps<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = UseFieldProps<Value, EmptyValue, ErrorMessages> & FieldBlockProps\n\nexport type FieldPropsGeneric<\n  Value = unknown,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = Omit<\n  FieldProps<Value, EmptyValue, ErrorMessages>,\n  keyof DataValueWriteProps\n> &\n  DataValueWriteProps<Value, EmptyValue, AdditionalEventArgs>\n\nexport type FieldPropsWithExtraValue<\n  Value = unknown,\n  ExtraValue extends AdditionalEventArgs = AdditionalEventArgs,\n  EmptyValue = undefined | unknown,\n  ErrorMessages extends DefaultErrorMessages = DefaultErrorMessages,\n> = Omit<\n  FieldProps<Value, EmptyValue, ErrorMessages>,\n  keyof DataValueWriteProps\n> &\n  DataValueWriteProps<Value, EmptyValue, ExtraValue>\n\nexport interface FieldHelpProps {\n  help?: {\n    title?: string\n    content?: React.ReactNode\n  }\n}\n\nexport interface ValueProps<Value = unknown>\n  extends DataValueReadComponentProps<Value> {\n  /**\n   * Field label to show above the data value.\n   */\n  label?: React.ReactNode\n\n  /**\n   * Use `true` to inherit the label from a visible (rendered) field with the same path.\n   */\n  inheritLabel?: boolean\n\n  /**\n   * Use `true` to inherit the visibility from a field with the same path.\n   */\n  inheritVisibility?: boolean\n\n  /**\n   * Shows the value even if it is empty.\n   */\n  showEmpty?: boolean\n\n  /**\n   * Text showing in place of the value if no value is given.\n   */\n  placeholder?: React.ReactNode\n\n  /**\n   * For showing the value inline (not as a block element)\n   */\n  inline?: boolean\n\n  /** The max-width of a value block. Defaults to large */\n  maxWidth?: 'small' | 'medium' | 'large' | 'auto'\n\n  /**\n   * Transforms the label before it gets displayed. Receives the label as the first parameter. The second parameter is a object containing the `convertJsxToString` function.\n   */\n  transformLabel?: (\n    label: React.ReactNode,\n    convertJsxToString: (label: React.ReactNode) => string\n  ) => React.ReactNode\n\n  /**\n   * Transforms the `value` before its displayed in the field (e.g. input).\n   * Public API. Should not be used internally.\n   */\n  transformIn?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the value before it gets returned as the `value`.\n   */\n  toInput?: (external: Value | unknown) => Value | unknown\n\n  /**\n   * Transforms the given props `value` before any other step gets entered.\n   */\n  fromExternal?: (external: Value) => Value\n}\n\nexport type Path = string\nexport type Identifier = string\n\nexport type SubmitState =\n  | 'pending' // Used for async operations\n  | 'complete' // Used to hide the submit indicator\n  | 'success' // Used for fields\n  | 'error' // Used when error is shown\n  | 'abort' // Used to abort the state regardless (step change)\n\n/**\n * Provide a error that shows in the FormStatus of a field.\n */\ntype EventStateObjectError = Error\n/**\n * Provide a warning that shows in the FormStatus of a field.\n */\ntype EventStateObjectWarning = React.ReactNode\n/**\n * Provide an info that shows in the FormStatus of a field.\n */\ntype EventStateObjectInfo = React.ReactNode\n\n/**\n * Provide a status that will enforce the form to stay in pending state\n */\ntype EventStateObjectStatus = 'pending'\n\n/**\n * Provide a success state that will show an indicator on the related field label\n */\ntype EventStateObjectSuccess = 'saved'\n\n/**\n * Provide an error or status messages that shows in the FormStatus of a field\n */\nexport type EventStateObjectOr = {\n  error?: EventStateObjectError\n  warning?: EventStateObjectWarning\n  info?: EventStateObjectInfo\n  pending?: EventStateObjectStatus\n  customStatus?: unknown\n}\n\nexport type EventStateObjectEitherOr =\n  | { error: EventStateObjectError }\n  | { warning: EventStateObjectWarning }\n  | { info: EventStateObjectInfo }\n  | { status: EventStateObjectStatus }\n  | { customStatus: unknown }\n\nexport type EventStateObject = EventStateObjectOr &\n  EventStateObjectEitherOr\n\n/**\n * Provide 'saved' to indicate the data has been saved successfully. Can not be combined with `error`.\n */\nexport type EventStateObjectWithSuccess = EventStateObjectOr & {\n  success?: EventStateObjectSuccess\n} & (EventStateObjectEitherOr | { success: EventStateObjectSuccess })\n\n/**\n * Provide an error or status messages that shows in the FormStatus of a field\n */\nexport type EventReturnWithStateObject = Error | EventStateObject\n\nexport type EventReturnWithStateObjectAndSuccess =\n  | Error\n  | EventStateObjectWithSuccess\n\nexport type OnSubmitParams = {\n  /** Will remove data entries of fields that are not visible */\n  reduceToVisibleFields: (\n    data: JsonObject,\n    options?: VisibleDataOptions\n  ) => Partial<JsonObject>\n\n  /** Will filter data based on the given \"filterDataHandler\" method */\n  filterData: (filterDataHandler: FilterData) => Partial<JsonObject>\n\n  /** Will remove browser-side stored autocomplete data  */\n  resetForm: () => void\n\n  /** Will empty the whole internal data set of the form  */\n  clearData: () => void\n}\n\nexport type OnSubmitReturn =\n  | EventReturnWithStateObject\n  | void\n  | Promise<EventReturnWithStateObject | void>\nexport type OnSubmit<Data = JsonObject> = (\n  data: Data,\n  {\n    reduceToVisibleFields,\n    filterData,\n    resetForm,\n    clearData,\n  }: OnSubmitParams\n) => OnSubmitReturn\n\nexport type OnCommit<Data = JsonObject> = (\n  data: Data,\n  {\n    clearData,\n    preventCommit,\n  }: {\n    clearData: () => void\n    preventCommit?: () => void\n  }\n) =>\n  | EventReturnWithStateObject\n  | void\n  | Promise<EventReturnWithStateObject | void>\n\nexport type OnChange<Data = JsonObject> = (\n  data: Data,\n  additionalArgs: Pick<OnSubmitParams, 'filterData'>\n) => OnChangeReturnType\n\ntype OnChangeReturnType =\n  | EventReturnWithStateObjectAndSuccess\n  | void\n  | Promise<EventReturnWithStateObjectAndSuccess | void>\n"],"mappings":"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"}

package/cjs/shared/Context.d.ts

@@ -155,12 +155,9 @@ export type GetTranslationProps = Partial<{
 export type Locale = TranslationLocale | 'en-US';
 export type AnyLocale = string;
 export type InternalLocale = Locale | AnyLocale;
-export type ComponentTranslationsName = keyof ContextComponents | string;
-export type ComponentTranslation = string;
 export type Translations = Partial<Record<InternalLocale, Translation | TranslationFlat>> | Partial<Record<InternalLocale, FormsTranslation>>;
 export type TranslationDefaultLocales = typeof defaultLocales;
 export type TranslationLocale = keyof TranslationDefaultLocales;
-export type TranslationKeys = keyof TranslationDefaultLocales[TranslationLocale];
 export type TranslationValues = TranslationDefaultLocales[TranslationLocale];
 export type TranslationCustomLocales = Record<never, string | Record<string, string>>;
 /**
@@ -170,10 +167,13 @@ export type Translation = DeepPartial<TranslationValues>;
 /**
  * E.g. "HelpButton.title"
  */
-export type TranslationFlat = Record<ComponentTranslationsName, TranslationKeys | ComponentTranslation>;
+export type TranslationFlat = Partial<Record<TranslationObjectToFlat<TranslationValues>, string>>;
 export type TranslationFlatToObject<T> = T extends Record<string, unknown> ? {
     [K in keyof T as K extends `${infer First}.${infer Rest}` ? First : K]: K extends `${infer First}.${infer Rest}` ? TranslationFlatToObject<Record<Rest, T[K]>> : T[K];
 } : T;
+export type TranslationObjectToFlat<T, Prefix extends string = ''> = {
+    [K in keyof T]: T[K] extends Record<string, unknown> ? TranslationObjectToFlat<T[K], `${Prefix}${K & string}.`> : `${Prefix}${K & string}`;
+}[keyof T];
 export declare function prepareContext<Props>(props?: ContextProps): Props & ContextProps;
 declare const Context: import("react").Context<ContextProps>;
 export default Context;

package/cjs/shared/Context.js.map

@@ -1 +1 @@
-{"version":3,"file":"Context.js","names":["_react","require","_defaults","_locales","_interopRequireDefault","_componentHelper","_jsonPointer","obj","__esModule","default","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","prepareContext","_props","props","__context__","assign","translations","locales","extendDeep","defaultLocales","localeWithFallback","handleLocaleFallbacks","locale","LOCALE","destructFlatTranslation","translation","context","updateTranslation","newTranslations","getTranslation","localProps","lang","tr","split","Context","createContext","currency","CURRENCY","currency_display","CURRENCY_DISPLAY","_default","exports","hasFlatTr","destructed","k","includes","pointer","set","replace"],"sources":["../../../src/shared/Context.tsx"],"sourcesContent":["/**\n * Web Context Context\n *\n */\n\nimport { createContext } from 'react'\nimport { LOCALE, CURRENCY, CURRENCY_DISPLAY } from './defaults'\nimport defaultLocales from './locales'\nimport { extendDeep } from './component-helper'\nimport pointer from '../extensions/forms/utils/json-pointer'\n\n// All TypeScript based Eufemia elements\nimport type { ScrollViewProps } from '../fragments/scroll-view/ScrollView'\n\n// All TypeScript based Eufemia components\nimport type { AnchorProps } from '../components/Anchor'\nimport type { ButtonProps } from '../components/button/Button'\nimport type { AvatarProps } from '../components/avatar/Avatar'\nimport type { AvatarGroupProps } from '../components/avatar/AvatarGroup'\nimport type { BadgeProps } from '../components/badge/Badge'\nimport type { BreadcrumbProps } from '../components/breadcrumb/Breadcrumb'\nimport type { BreadcrumbItemProps } from '../components/breadcrumb/BreadcrumbItem'\nimport type { CheckboxProps } from '../components/Checkbox'\nimport type { InfoCardProps } from '../components/info-card/InfoCard'\nimport type { SliderProps } from '../components/slider/Slider'\nimport type { TagProps } from '../components/tag/Tag'\nimport type { TagGroupProps } from '../components/tag/TagGroup'\nimport type { TimelineProps } from '../components/timeline/Timeline'\nimport type { TimelineItemProps } from '../components/timeline/TimelineItem'\nimport type { VisuallyHiddenProps } from '../components/visually-hidden/VisuallyHidden'\nimport type { DrawerProps } from '../components/drawer/types'\nimport type { DialogProps } from '../components/dialog/types'\nimport type { TooltipProps } from '../components/tooltip/types'\nimport type { SectionProps } from '../components/section/Section'\nimport type { FormRowProps } from '../components/form-row/FormRowHelpers'\nimport type { UploadProps } from '../components/upload/types'\nimport type { SkeletonProps, SkeletonShow } from '../components/Skeleton'\nimport type { HelpButtonProps } from '../components/HelpButton'\nimport type { TableProps } from '../components/Table'\nimport type { GlobalErrorProps } from '../components/GlobalError'\nimport type { ModalProps } from '../components/modal/types'\nimport type { AccordionProps } from '../components/Accordion'\nimport type { StepIndicatorProps } from '../components/StepIndicator'\nimport type { FormLabelProps } from '../components/FormLabel'\nimport type { InputProps } from '../components/Input'\nimport type { NumberFormatCurrency } from '../components/NumberFormat'\nimport type { ProgressIndicatorProps } from '../components/progress-indicator/types'\nimport type { FormStatusProps } from '../components/FormStatus'\nimport type { LogoProps } from '../components/Logo'\nimport type { IconProps } from '../components/Icon'\nimport type { IconPrimaryProps } from '../components/IconPrimary'\nimport { SwitchProps } from '../components/Switch'\n\nimport type { FormElementProps } from './helpers/filterValidProps'\nimport type { ThemeProps } from './Theme'\nimport type { FormsTranslation } from '../extensions/forms/hooks/useTranslation'\nimport type { DeepPartial } from './types'\n\nexport type ContextComponents = {\n  Button?: Partial<ButtonProps>\n  Anchor?: Partial<AnchorProps>\n  Avatar?: Partial<AvatarProps>\n  AvatarGroup?: Partial<AvatarGroupProps>\n  Badge?: Partial<BadgeProps>\n  Breadcrumb?: Partial<BreadcrumbProps>\n  BreadcrumbItem?: Partial<BreadcrumbItemProps>\n  Checkbox?: Partial<CheckboxProps>\n  InfoCard?: Partial<InfoCardProps>\n  Slider?: Partial<SliderProps>\n  Tag?: Partial<TagProps>\n  TagGroup?: Partial<TagGroupProps>\n  Timeline?: Partial<TimelineProps>\n  TimelineItem?: Partial<TimelineItemProps>\n  VisuallyHidden?: Partial<VisuallyHiddenProps>\n  Drawer?: Partial<DrawerProps>\n  Dialog?: Partial<DialogProps>\n  Tooltip?: Partial<TooltipProps>\n  Section?: Partial<SectionProps>\n  ScrollView?: Partial<ScrollViewProps>\n  Upload?: Partial<UploadProps>\n  Skeleton?: Partial<SkeletonProps>\n  HelpButton?: Partial<HelpButtonProps>\n  Table?: Partial<TableProps>\n  GlobalError?: Partial<GlobalErrorProps>\n  Modal?: Partial<ModalProps>\n  Accordion?: Partial<AccordionProps>\n  StepIndicator?: Partial<StepIndicatorProps>\n  FormLabel?: Partial<FormLabelProps>\n  Input?: Partial<InputProps>\n  ProgressIndicator?: Partial<ProgressIndicatorProps>\n  FormStatus?: Partial<FormStatusProps>\n  Logo?: Partial<LogoProps>\n  Icon?: Partial<IconProps>\n  IconPrimary?: Partial<IconPrimaryProps>\n\n  Switch?: Partial<SwitchProps>\n  // -- TODO: Not converted yet --\n  NumberFormat?: Record<string, unknown>\n  Pagination?: Record<string, unknown>\n\n  /**\n   * @deprecated – can be removed in v11\n   */\n  FormRow?: FormRowProps\n\n  // Common props\n  formElement?: FormElementProps\n}\n\nexport type ContextProps = ContextComponents & {\n  // -- All TypeScript based Eufemia components --\n\n  // -- Global properties --\n\n  /**\n   * Contains theme related properties, such as a theme name\n   */\n  theme?: ThemeProps\n\n  /**\n   * Will enable all skeletons inside this provider/context scope\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Define what breakpoints should be used by the MediaQuery component and hook\n   */\n  breakpoints?: Record<string, string>\n\n  /**\n   * Defines the locale (internal translation) used by some components\n   */\n  locale?: InternalLocale\n\n  /**\n   * Internal translations used by the components and hooks\n   */\n  translation?: Translation\n\n  /**\n   * Defines the currency used by the NumberFormat component\n   */\n  currency?: NumberFormatCurrency\n\n  /**\n   * Defines the currencyDisplay used by the NumberFormat component\n   */\n  currency_display?: string\n\n  /**\n   * Update any given provider/context properties\n   */\n  update?: (props: ContextProps) => void\n\n  /**\n   * Update any given provider/context properties, but only for the particular scope\n   */\n  updateCurrent?: (props: ContextProps) => void\n\n  /**\n   * Update the used locale from within the context\n   */\n  setLocale?: (locale: InternalLocale) => void\n\n  /**\n   * Update the used locale from within the context, but only for the particular scope\n   */\n  setCurrentLocale?: (locale: InternalLocale) => void\n\n  /**\n   * Overwrite existing internal translation strings or define new strings via the Provider\n   */\n  translations?: Translations | TranslationCustomLocales\n\n  /**\n   * @deprecated Use `translations` instead\n   */\n  locales?: Translations | TranslationCustomLocales\n\n  // -- For internal use --\n  __context__?: Record<string, unknown>\n  updateTranslation?: (\n    locale: InternalLocale,\n    translation: Translation\n  ) => void\n  getTranslation?: (props: GetTranslationProps) => Translation\n}\n\nexport type GetTranslationProps = Partial<{\n  lang?: InternalLocale | HTMLElement['lang']\n  locale?: InternalLocale\n}>\n\nexport type Locale = TranslationLocale | 'en-US'\nexport type AnyLocale = string\nexport type InternalLocale =\n  | Locale\n  // more strict type definitions than string breaks applications using React Intl.\n  | AnyLocale\nexport type ComponentTranslationsName = keyof ContextComponents | string\nexport type ComponentTranslation = string\nexport type Translations =\n  | Partial<Record<InternalLocale, Translation | TranslationFlat>>\n  | Partial<Record<InternalLocale, FormsTranslation>>\nexport type TranslationDefaultLocales = typeof defaultLocales\nexport type TranslationLocale = keyof TranslationDefaultLocales\nexport type TranslationKeys =\n  keyof TranslationDefaultLocales[TranslationLocale]\nexport type TranslationValues =\n  TranslationDefaultLocales[TranslationLocale]\nexport type TranslationCustomLocales = Record<\n  never,\n  string | Record<string, string>\n>\n\n/**\n * E.g. \"HelpButton: { title: '...' }\"\n */\nexport type Translation = DeepPartial<TranslationValues>\n\n/**\n * E.g. \"HelpButton.title\"\n */\nexport type TranslationFlat = Record<\n  ComponentTranslationsName,\n  TranslationKeys | ComponentTranslation\n>\n\nexport type TranslationFlatToObject<T> = T extends Record<string, unknown>\n  ? {\n      // eslint-disable-next-line\n      [K in keyof T as K extends `${infer First}.${infer Rest}`\n        ? First\n        : // eslint-disable-next-line\n          K]: K extends `${infer First}.${infer Rest}`\n        ? TranslationFlatToObject<Record<Rest, T[K]>>\n        : T[K]\n    }\n  : T\n\nexport function prepareContext<Props>(\n  props: ContextProps = {}\n): Props & ContextProps {\n  if (props?.__context__) {\n    props = Object.assign({}, props, props.__context__)\n    delete props.__context__\n  }\n\n  const translations: Translations =\n    props.translations || props.locales\n      ? extendDeep({}, defaultLocales, props.translations || props.locales)\n      : extendDeep({}, defaultLocales)\n\n  const localeWithFallback = handleLocaleFallbacks(\n    props.locale || LOCALE,\n    props.translations || props.locales\n  )\n\n  /**\n   * The code above adds support for strings, defined like:\n   * {\n   *    \"Modal.close_title\": \"Lukk\",\n   * }\n   */\n  for (const locale in translations) {\n    translations[locale] = destructFlatTranslation(\n      translations[locale] as TranslationFlat\n    )\n  }\n\n  const translation =\n    translations[localeWithFallback] || defaultLocales[LOCALE] || {}\n\n  const context = {\n    ...props,\n    updateTranslation: (locale, newTranslations) => {\n      context.translation =\n        newTranslations[locale] || newTranslations[LOCALE]\n      context.translations = newTranslations\n\n      if (context.locales) {\n        context.locales = context.translations\n      }\n    },\n    getTranslation: (localProps) => {\n      if (localProps) {\n        const locale = localProps.lang || localProps.locale\n        if (\n          locale &&\n          (context.translations || context.locales)[locale] &&\n          locale !== localeWithFallback\n        ) {\n          const tr = context.translations || context.locales\n          return tr[locale]\n        }\n      }\n      return context.translation || defaultLocales[LOCALE]\n    },\n\n    /**\n     * Make sure we set this after props, since we update this one!\n     */\n    locales: translations, // @deprecated – can be removed in v11\n    translations,\n    translation,\n  } as Props & ContextProps\n\n  return { ...context }\n}\n\nfunction handleLocaleFallbacks(\n  locale: InternalLocale | AnyLocale,\n  translations: Translations = {}\n) {\n  if (locale === 'en' || String(locale).split('-')[0] === 'en') {\n    return 'en-GB'\n  }\n  return translations[locale] ? locale : LOCALE\n}\n\n// If no provider is given, we use the default context from here\nconst Context = createContext<ContextProps>(\n  prepareContext({\n    locale: LOCALE,\n    currency: CURRENCY,\n    currency_display: CURRENCY_DISPLAY,\n  })\n)\n\nexport default Context\n\nexport function destructFlatTranslation(source: TranslationFlat) {\n  let hasFlatTr = false\n  const destructed = {}\n\n  for (const k in source) {\n    if (String(k).includes('.')) {\n      pointer.set(destructed, '/' + k.replace(/\\./g, '/'), source[k])\n      hasFlatTr = true\n    }\n  }\n\n  if (hasFlatTr) {\n    return extendDeep({}, source, destructed)\n  }\n\n  return source\n}\n"],"mappings":";;;;;;;;;AAKA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,gBAAA,GAAAJ,OAAA;AACA,IAAAK,YAAA,GAAAF,sBAAA,CAAAH,OAAA;AAA4D,SAAAG,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,QAAAC,MAAA,EAAAC,cAAA,QAAAC,IAAA,GAAAC,MAAA,CAAAD,IAAA,CAAAF,MAAA,OAAAG,MAAA,CAAAC,qBAAA,QAAAC,OAAA,GAAAF,MAAA,CAAAC,qBAAA,CAAAJ,MAAA,GAAAC,cAAA,KAAAI,OAAA,GAAAA,OAAA,CAAAC,MAAA,WAAAC,GAAA,WAAAJ,MAAA,CAAAK,wBAAA,CAAAR,MAAA,EAAAO,GAAA,EAAAE,UAAA,OAAAP,IAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,IAAA,EAAAG,OAAA,YAAAH,IAAA;AAAA,SAAAU,cAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,WAAAF,SAAA,CAAAD,CAAA,IAAAC,SAAA,CAAAD,CAAA,QAAAA,CAAA,OAAAf,OAAA,CAAAI,MAAA,CAAAc,MAAA,OAAAC,OAAA,WAAAC,GAAA,IAAAC,eAAA,CAAAP,MAAA,EAAAM,GAAA,EAAAF,MAAA,CAAAE,GAAA,SAAAhB,MAAA,CAAAkB,yBAAA,GAAAlB,MAAA,CAAAmB,gBAAA,CAAAT,MAAA,EAAAV,MAAA,CAAAkB,yBAAA,CAAAJ,MAAA,KAAAlB,OAAA,CAAAI,MAAA,CAAAc,MAAA,GAAAC,OAAA,WAAAC,GAAA,IAAAhB,MAAA,CAAAoB,cAAA,CAAAV,MAAA,EAAAM,GAAA,EAAAhB,MAAA,CAAAK,wBAAA,CAAAS,MAAA,EAAAE,GAAA,iBAAAN,MAAA;AAAA,SAAAO,gBAAAxB,GAAA,EAAAuB,GAAA,EAAAK,KAAA,IAAAL,GAAA,GAAAM,cAAA,CAAAN,GAAA,OAAAA,GAAA,IAAAvB,GAAA,IAAAO,MAAA,CAAAoB,cAAA,CAAA3B,GAAA,EAAAuB,GAAA,IAAAK,KAAA,EAAAA,KAAA,EAAAf,UAAA,QAAAiB,YAAA,QAAAC,QAAA,oBAAA/B,GAAA,CAAAuB,GAAA,IAAAK,KAAA,WAAA5B,GAAA;AAAA,SAAA6B,eAAAG,GAAA,QAAAT,GAAA,GAAAU,YAAA,CAAAD,GAAA,2BAAAT,GAAA,gBAAAA,GAAA,GAAAW,MAAA,CAAAX,GAAA;AAAA,SAAAU,aAAAE,KAAA,EAAAC,IAAA,eAAAD,KAAA,iBAAAA,KAAA,kBAAAA,KAAA,MAAAE,IAAA,GAAAF,KAAA,CAAAG,MAAA,CAAAC,WAAA,OAAAF,IAAA,KAAAG,SAAA,QAAAC,GAAA,GAAAJ,IAAA,CAAAK,IAAA,CAAAP,KAAA,EAAAC,IAAA,2BAAAK,GAAA,sBAAAA,GAAA,YAAAE,SAAA,4DAAAP,IAAA,gBAAAF,MAAA,GAAAU,MAAA,EAAAT,KAAA;AAuOrD,SAASU,cAAcA,CAAA,EAEN;EAAA,IAAAC,MAAA;EAAA,IADtBC,KAAmB,GAAA5B,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAqB,SAAA,GAAArB,SAAA,MAAG,CAAC,CAAC;EAExB,KAAA2B,MAAA,GAAIC,KAAK,cAAAD,MAAA,eAALA,MAAA,CAAOE,WAAW,EAAE;IACtBD,KAAK,GAAGxC,MAAM,CAAC0C,MAAM,CAAC,CAAC,CAAC,EAAEF,KAAK,EAAEA,KAAK,CAACC,WAAW,CAAC;IACnD,OAAOD,KAAK,CAACC,WAAW;EAC1B;EAEA,MAAME,YAA0B,GAC9BH,KAAK,CAACG,YAAY,IAAIH,KAAK,CAACI,OAAO,GAC/B,IAAAC,2BAAU,EAAC,CAAC,CAAC,EAAEC,gBAAc,EAAEN,KAAK,CAACG,YAAY,IAAIH,KAAK,CAACI,OAAO,CAAC,GACnE,IAAAC,2BAAU,EAAC,CAAC,CAAC,EAAEC,gBAAc,CAAC;EAEpC,MAAMC,kBAAkB,GAAGC,qBAAqB,CAC9CR,KAAK,CAACS,MAAM,IAAIC,gBAAM,EACtBV,KAAK,CAACG,YAAY,IAAIH,KAAK,CAACI,OAC9B,CAAC;EAQD,KAAK,MAAMK,MAAM,IAAIN,YAAY,EAAE;IACjCA,YAAY,CAACM,MAAM,CAAC,GAAGE,uBAAuB,CAC5CR,YAAY,CAACM,MAAM,CACrB,CAAC;EACH;EAEA,MAAMG,WAAW,GACfT,YAAY,CAACI,kBAAkB,CAAC,IAAID,gBAAc,CAACI,gBAAM,CAAC,IAAI,CAAC,CAAC;EAElE,MAAMG,OAAO,GAAA5C,aAAA,CAAAA,aAAA,KACR+B,KAAK;IACRc,iBAAiB,EAAEA,CAACL,MAAM,EAAEM,eAAe,KAAK;MAC9CF,OAAO,CAACD,WAAW,GACjBG,eAAe,CAACN,MAAM,CAAC,IAAIM,eAAe,CAACL,gBAAM,CAAC;MACpDG,OAAO,CAACV,YAAY,GAAGY,eAAe;MAEtC,IAAIF,OAAO,CAACT,OAAO,EAAE;QACnBS,OAAO,CAACT,OAAO,GAAGS,OAAO,CAACV,YAAY;MACxC;IACF,CAAC;IACDa,cAAc,EAAGC,UAAU,IAAK;MAC9B,IAAIA,UAAU,EAAE;QACd,MAAMR,MAAM,GAAGQ,UAAU,CAACC,IAAI,IAAID,UAAU,CAACR,MAAM;QACnD,IACEA,MAAM,IACN,CAACI,OAAO,CAACV,YAAY,IAAIU,OAAO,CAACT,OAAO,EAAEK,MAAM,CAAC,IACjDA,MAAM,KAAKF,kBAAkB,EAC7B;UACA,MAAMY,EAAE,GAAGN,OAAO,CAACV,YAAY,IAAIU,OAAO,CAACT,OAAO;UAClD,OAAOe,EAAE,CAACV,MAAM,CAAC;QACnB;MACF;MACA,OAAOI,OAAO,CAACD,WAAW,IAAIN,gBAAc,CAACI,gBAAM,CAAC;IACtD,CAAC;IAKDN,OAAO,EAAED,YAAY;IACrBA,YAAY;IACZS;EAAW,EACY;EAEzB,OAAA3C,aAAA,KAAY4C,OAAO;AACrB;AAEA,SAASL,qBAAqBA,CAC5BC,MAAkC,EAElC;EAAA,IADAN,YAA0B,GAAA/B,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAqB,SAAA,GAAArB,SAAA,MAAG,CAAC,CAAC;EAE/B,IAAIqC,MAAM,KAAK,IAAI,IAAItB,MAAM,CAACsB,MAAM,CAAC,CAACW,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,EAAE;IAC5D,OAAO,OAAO;EAChB;EACA,OAAOjB,YAAY,CAACM,MAAM,CAAC,GAAGA,MAAM,GAAGC,gBAAM;AAC/C;AAGA,MAAMW,OAAO,GAAG,IAAAC,oBAAa,EAC3BxB,cAAc,CAAC;EACbW,MAAM,EAAEC,gBAAM;EACda,QAAQ,EAAEC,kBAAQ;EAClBC,gBAAgB,EAAEC;AACpB,CAAC,CACH,CAAC;AAAA,IAAAC,QAAA,GAEcN,OAAO;AAAAO,OAAA,CAAAzE,OAAA,GAAAwE,QAAA;AAEf,SAAShB,uBAAuBA,CAACrC,MAAuB,EAAE;EAC/D,IAAIuD,SAAS,GAAG,KAAK;EACrB,MAAMC,UAAU,GAAG,CAAC,CAAC;EAErB,KAAK,MAAMC,CAAC,IAAIzD,MAAM,EAAE;IACtB,IAAIa,MAAM,CAAC4C,CAAC,CAAC,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;MAC3BC,oBAAO,CAACC,GAAG,CAACJ,UAAU,EAAE,GAAG,GAAGC,CAAC,CAACI,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE7D,MAAM,CAACyD,CAAC,CAAC,CAAC;MAC/DF,SAAS,GAAG,IAAI;IAClB;EACF;EAEA,IAAIA,SAAS,EAAE;IACb,OAAO,IAAAxB,2BAAU,EAAC,CAAC,CAAC,EAAE/B,MAAM,EAAEwD,UAAU,CAAC;EAC3C;EAEA,OAAOxD,MAAM;AACf"}
+{"version":3,"file":"Context.js","names":["_react","require","_defaults","_locales","_interopRequireDefault","_componentHelper","_jsonPointer","obj","__esModule","default","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","target","i","arguments","length","source","forEach","key","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","value","_toPropertyKey","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","call","TypeError","Number","prepareContext","_props","props","__context__","assign","translations","locales","extendDeep","defaultLocales","localeWithFallback","handleLocaleFallbacks","locale","LOCALE","destructFlatTranslation","translation","context","updateTranslation","newTranslations","getTranslation","localProps","lang","tr","split","Context","createContext","currency","CURRENCY","currency_display","CURRENCY_DISPLAY","_default","exports","hasFlatTr","destructed","k","includes","pointer","set","replace"],"sources":["../../../src/shared/Context.tsx"],"sourcesContent":["/**\n * Web Context Context\n *\n */\n\nimport { createContext } from 'react'\nimport { LOCALE, CURRENCY, CURRENCY_DISPLAY } from './defaults'\nimport defaultLocales from './locales'\nimport { extendDeep } from './component-helper'\nimport pointer from '../extensions/forms/utils/json-pointer'\n\n// All TypeScript based Eufemia elements\nimport type { ScrollViewProps } from '../fragments/scroll-view/ScrollView'\n\n// All TypeScript based Eufemia components\nimport type { AnchorProps } from '../components/Anchor'\nimport type { ButtonProps } from '../components/button/Button'\nimport type { AvatarProps } from '../components/avatar/Avatar'\nimport type { AvatarGroupProps } from '../components/avatar/AvatarGroup'\nimport type { BadgeProps } from '../components/badge/Badge'\nimport type { BreadcrumbProps } from '../components/breadcrumb/Breadcrumb'\nimport type { BreadcrumbItemProps } from '../components/breadcrumb/BreadcrumbItem'\nimport type { CheckboxProps } from '../components/Checkbox'\nimport type { InfoCardProps } from '../components/info-card/InfoCard'\nimport type { SliderProps } from '../components/slider/Slider'\nimport type { TagProps } from '../components/tag/Tag'\nimport type { TagGroupProps } from '../components/tag/TagGroup'\nimport type { TimelineProps } from '../components/timeline/Timeline'\nimport type { TimelineItemProps } from '../components/timeline/TimelineItem'\nimport type { VisuallyHiddenProps } from '../components/visually-hidden/VisuallyHidden'\nimport type { DrawerProps } from '../components/drawer/types'\nimport type { DialogProps } from '../components/dialog/types'\nimport type { TooltipProps } from '../components/tooltip/types'\nimport type { SectionProps } from '../components/section/Section'\nimport type { FormRowProps } from '../components/form-row/FormRowHelpers'\nimport type { UploadProps } from '../components/upload/types'\nimport type { SkeletonProps, SkeletonShow } from '../components/Skeleton'\nimport type { HelpButtonProps } from '../components/HelpButton'\nimport type { TableProps } from '../components/Table'\nimport type { GlobalErrorProps } from '../components/GlobalError'\nimport type { ModalProps } from '../components/modal/types'\nimport type { AccordionProps } from '../components/Accordion'\nimport type { StepIndicatorProps } from '../components/StepIndicator'\nimport type { FormLabelProps } from '../components/FormLabel'\nimport type { InputProps } from '../components/Input'\nimport type { NumberFormatCurrency } from '../components/NumberFormat'\nimport type { ProgressIndicatorProps } from '../components/progress-indicator/types'\nimport type { FormStatusProps } from '../components/FormStatus'\nimport type { LogoProps } from '../components/Logo'\nimport type { IconProps } from '../components/Icon'\nimport type { IconPrimaryProps } from '../components/IconPrimary'\nimport { SwitchProps } from '../components/Switch'\n\nimport type { FormElementProps } from './helpers/filterValidProps'\nimport type { ThemeProps } from './Theme'\nimport type { FormsTranslation } from '../extensions/forms/hooks/useTranslation'\nimport type { DeepPartial } from './types'\n\nexport type ContextComponents = {\n  Button?: Partial<ButtonProps>\n  Anchor?: Partial<AnchorProps>\n  Avatar?: Partial<AvatarProps>\n  AvatarGroup?: Partial<AvatarGroupProps>\n  Badge?: Partial<BadgeProps>\n  Breadcrumb?: Partial<BreadcrumbProps>\n  BreadcrumbItem?: Partial<BreadcrumbItemProps>\n  Checkbox?: Partial<CheckboxProps>\n  InfoCard?: Partial<InfoCardProps>\n  Slider?: Partial<SliderProps>\n  Tag?: Partial<TagProps>\n  TagGroup?: Partial<TagGroupProps>\n  Timeline?: Partial<TimelineProps>\n  TimelineItem?: Partial<TimelineItemProps>\n  VisuallyHidden?: Partial<VisuallyHiddenProps>\n  Drawer?: Partial<DrawerProps>\n  Dialog?: Partial<DialogProps>\n  Tooltip?: Partial<TooltipProps>\n  Section?: Partial<SectionProps>\n  ScrollView?: Partial<ScrollViewProps>\n  Upload?: Partial<UploadProps>\n  Skeleton?: Partial<SkeletonProps>\n  HelpButton?: Partial<HelpButtonProps>\n  Table?: Partial<TableProps>\n  GlobalError?: Partial<GlobalErrorProps>\n  Modal?: Partial<ModalProps>\n  Accordion?: Partial<AccordionProps>\n  StepIndicator?: Partial<StepIndicatorProps>\n  FormLabel?: Partial<FormLabelProps>\n  Input?: Partial<InputProps>\n  ProgressIndicator?: Partial<ProgressIndicatorProps>\n  FormStatus?: Partial<FormStatusProps>\n  Logo?: Partial<LogoProps>\n  Icon?: Partial<IconProps>\n  IconPrimary?: Partial<IconPrimaryProps>\n\n  Switch?: Partial<SwitchProps>\n  // -- TODO: Not converted yet --\n  NumberFormat?: Record<string, unknown>\n  Pagination?: Record<string, unknown>\n\n  /**\n   * @deprecated – can be removed in v11\n   */\n  FormRow?: FormRowProps\n\n  // Common props\n  formElement?: FormElementProps\n}\n\nexport type ContextProps = ContextComponents & {\n  // -- All TypeScript based Eufemia components --\n\n  // -- Global properties --\n\n  /**\n   * Contains theme related properties, such as a theme name\n   */\n  theme?: ThemeProps\n\n  /**\n   * Will enable all skeletons inside this provider/context scope\n   */\n  skeleton?: SkeletonShow\n\n  /**\n   * Define what breakpoints should be used by the MediaQuery component and hook\n   */\n  breakpoints?: Record<string, string>\n\n  /**\n   * Defines the locale (internal translation) used by some components\n   */\n  locale?: InternalLocale\n\n  /**\n   * Internal translations used by the components and hooks\n   */\n  translation?: Translation\n\n  /**\n   * Defines the currency used by the NumberFormat component\n   */\n  currency?: NumberFormatCurrency\n\n  /**\n   * Defines the currencyDisplay used by the NumberFormat component\n   */\n  currency_display?: string\n\n  /**\n   * Update any given provider/context properties\n   */\n  update?: (props: ContextProps) => void\n\n  /**\n   * Update any given provider/context properties, but only for the particular scope\n   */\n  updateCurrent?: (props: ContextProps) => void\n\n  /**\n   * Update the used locale from within the context\n   */\n  setLocale?: (locale: InternalLocale) => void\n\n  /**\n   * Update the used locale from within the context, but only for the particular scope\n   */\n  setCurrentLocale?: (locale: InternalLocale) => void\n\n  /**\n   * Overwrite existing internal translation strings or define new strings via the Provider\n   */\n  translations?: Translations | TranslationCustomLocales\n\n  /**\n   * @deprecated Use `translations` instead\n   */\n  locales?: Translations | TranslationCustomLocales\n\n  // -- For internal use --\n  __context__?: Record<string, unknown>\n  updateTranslation?: (\n    locale: InternalLocale,\n    translation: Translation\n  ) => void\n  getTranslation?: (props: GetTranslationProps) => Translation\n}\n\nexport type GetTranslationProps = Partial<{\n  lang?: InternalLocale | HTMLElement['lang']\n  locale?: InternalLocale\n}>\n\nexport type Locale = TranslationLocale | 'en-US'\nexport type AnyLocale = string\nexport type InternalLocale =\n  | Locale\n  // more strict type definitions than string breaks applications using React Intl.\n  | AnyLocale\nexport type Translations =\n  | Partial<Record<InternalLocale, Translation | TranslationFlat>>\n  | Partial<Record<InternalLocale, FormsTranslation>>\nexport type TranslationDefaultLocales = typeof defaultLocales\nexport type TranslationLocale = keyof TranslationDefaultLocales\nexport type TranslationValues =\n  TranslationDefaultLocales[TranslationLocale]\nexport type TranslationCustomLocales = Record<\n  never,\n  string | Record<string, string>\n>\n\n/**\n * E.g. \"HelpButton: { title: '...' }\"\n */\nexport type Translation = DeepPartial<TranslationValues>\n\n/**\n * E.g. \"HelpButton.title\"\n */\nexport type TranslationFlat = Partial<\n  Record<TranslationObjectToFlat<TranslationValues>, string>\n>\n\nexport type TranslationFlatToObject<T> = T extends Record<string, unknown>\n  ? {\n      // eslint-disable-next-line\n      [K in keyof T as K extends `${infer First}.${infer Rest}`\n        ? First\n        : // eslint-disable-next-line\n          K]: K extends `${infer First}.${infer Rest}`\n        ? TranslationFlatToObject<Record<Rest, T[K]>>\n        : T[K]\n    }\n  : T\n\nexport type TranslationObjectToFlat<T, Prefix extends string = ''> = {\n  [K in keyof T]: T[K] extends Record<string, unknown>\n    ? TranslationObjectToFlat<T[K], `${Prefix}${K & string}.`>\n    : `${Prefix}${K & string}`\n}[keyof T]\n\nexport function prepareContext<Props>(\n  props: ContextProps = {}\n): Props & ContextProps {\n  if (props?.__context__) {\n    props = Object.assign({}, props, props.__context__)\n    delete props.__context__\n  }\n\n  const translations: Translations =\n    props.translations || props.locales\n      ? extendDeep({}, defaultLocales, props.translations || props.locales)\n      : extendDeep({}, defaultLocales)\n\n  const localeWithFallback = handleLocaleFallbacks(\n    props.locale || LOCALE,\n    props.translations || props.locales\n  )\n\n  /**\n   * The code above adds support for strings, defined like:\n   * {\n   *    \"Modal.close_title\": \"Lukk\",\n   * }\n   */\n  for (const locale in translations) {\n    translations[locale] = destructFlatTranslation(\n      translations[locale] as TranslationFlat\n    )\n  }\n\n  const translation =\n    translations[localeWithFallback] || defaultLocales[LOCALE] || {}\n\n  const context = {\n    ...props,\n    updateTranslation: (locale, newTranslations) => {\n      context.translation =\n        newTranslations[locale] || newTranslations[LOCALE]\n      context.translations = newTranslations\n\n      if (context.locales) {\n        context.locales = context.translations\n      }\n    },\n    getTranslation: (localProps) => {\n      if (localProps) {\n        const locale = localProps.lang || localProps.locale\n        if (\n          locale &&\n          (context.translations || context.locales)[locale] &&\n          locale !== localeWithFallback\n        ) {\n          const tr = context.translations || context.locales\n          return tr[locale]\n        }\n      }\n      return context.translation || defaultLocales[LOCALE]\n    },\n\n    /**\n     * Make sure we set this after props, since we update this one!\n     */\n    locales: translations, // @deprecated – can be removed in v11\n    translations,\n    translation,\n  } as Props & ContextProps\n\n  return { ...context }\n}\n\nfunction handleLocaleFallbacks(\n  locale: InternalLocale | AnyLocale,\n  translations: Translations = {}\n) {\n  if (locale === 'en' || String(locale).split('-')[0] === 'en') {\n    return 'en-GB'\n  }\n  return translations[locale] ? locale : LOCALE\n}\n\n// If no provider is given, we use the default context from here\nconst Context = createContext<ContextProps>(\n  prepareContext({\n    locale: LOCALE,\n    currency: CURRENCY,\n    currency_display: CURRENCY_DISPLAY,\n  })\n)\n\nexport default Context\n\nexport function destructFlatTranslation(source: TranslationFlat) {\n  let hasFlatTr = false\n  const destructed = {}\n\n  for (const k in source) {\n    if (String(k).includes('.')) {\n      pointer.set(destructed, '/' + k.replace(/\\./g, '/'), source[k])\n      hasFlatTr = true\n    }\n  }\n\n  if (hasFlatTr) {\n    return extendDeep({}, source, destructed)\n  }\n\n  return source\n}\n"],"mappings":"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"}

package/cjs/shared/Eufemia.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "10.52.0";
+export declare const version = "10.53.0";
 export declare function init(): void;

package/cjs/shared/Eufemia.js

@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.init = init;
 exports.version = void 0;
-const version = '10.52.0';
+const version = '10.53.0';
 exports.version = version;
 function init() {
   if (typeof window !== 'undefined') {
     class Eufemia {
       get version() {
-        return '10.52.0';
+        return '10.53.0';
       }
     }
     window.Eufemia = new Eufemia();

package/cjs/shared/Eufemia.js.map

@@ -1 +1 @@
-{"version":3,"file":"Eufemia.js","names":["version","exports","init","window","Eufemia"],"sources":["../../../src/shared/Eufemia.ts"],"sourcesContent":["export const version = '10.52.0'\n\nexport function init() {\n  if (typeof window !== 'undefined') {\n    class Eufemia {\n      get version() {\n        return '10.52.0'\n      }\n    }\n\n    window.Eufemia = new Eufemia()\n  }\n}\n"],"mappings":";;;;;;;AAAO,MAAMA,OAAO,GAAG,SAAS;AAAAC,OAAA,CAAAD,OAAA,GAAAA,OAAA;AAEzB,SAASE,IAAIA,CAAA,EAAG;EACrB,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;IACjC,MAAMC,OAAO,CAAC;MACZ,IAAIJ,OAAOA,CAAA,EAAG;QACZ,OAAO,SAAS;MAClB;IACF;IAEAG,MAAM,CAACC,OAAO,GAAG,IAAIA,OAAO,CAAC,CAAC;EAChC;AACF"}
+{"version":3,"file":"Eufemia.js","names":["version","exports","init","window","Eufemia"],"sources":["../../../src/shared/Eufemia.ts"],"sourcesContent":["export const version = '10.53.0'\n\nexport function init() {\n  if (typeof window !== 'undefined') {\n    class Eufemia {\n      get version() {\n        return '10.53.0'\n      }\n    }\n\n    window.Eufemia = new Eufemia()\n  }\n}\n"],"mappings":";;;;;;;AAAO,MAAMA,OAAO,GAAG,SAAS;AAAAC,OAAA,CAAAD,OAAA,GAAAA,OAAA;AAEzB,SAASE,IAAIA,CAAA,EAAG;EACrB,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;IACjC,MAAMC,OAAO,CAAC;MACZ,IAAIJ,OAAOA,CAAA,EAAG;QACZ,OAAO,SAAS;MAClB;IACF;IAEAG,MAAM,CAACC,OAAO,GAAG,IAAIA,OAAO,CAAC,CAAC;EAChC;AACF"}

package/cjs/shared/defaults.d.ts

@@ -5,3 +5,4 @@
 export declare const LOCALE = "nb-NO";
 export declare const CURRENCY = "NOK";
 export declare const CURRENCY_DISPLAY = "code";
+export declare const COUNTRY = "NO";

package/cjs/shared/defaults.js

@@ -3,11 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LOCALE = exports.CURRENCY_DISPLAY = exports.CURRENCY = void 0;
+exports.LOCALE = exports.CURRENCY_DISPLAY = exports.CURRENCY = exports.COUNTRY = void 0;
 const LOCALE = 'nb-NO';
 exports.LOCALE = LOCALE;
 const CURRENCY = 'NOK';
 exports.CURRENCY = CURRENCY;
 const CURRENCY_DISPLAY = 'code';
 exports.CURRENCY_DISPLAY = CURRENCY_DISPLAY;
+const COUNTRY = 'NO';
+exports.COUNTRY = COUNTRY;
 //# sourceMappingURL=defaults.js.map

package/cjs/shared/defaults.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.js","names":["LOCALE","exports","CURRENCY","CURRENCY_DISPLAY"],"sources":["../../../src/shared/defaults.ts"],"sourcesContent":["/**\n * DNB Eufemia Defaults\n *\n */\n\nexport const LOCALE = 'nb-NO'\nexport const CURRENCY = 'NOK'\nexport const CURRENCY_DISPLAY = 'code' // code, name, symbol, narrowSymbol\n"],"mappings":";;;;;;AAKO,MAAMA,MAAM,GAAG,OAAO;AAAAC,OAAA,CAAAD,MAAA,GAAAA,MAAA;AACtB,MAAME,QAAQ,GAAG,KAAK;AAAAD,OAAA,CAAAC,QAAA,GAAAA,QAAA;AACtB,MAAMC,gBAAgB,GAAG,MAAM;AAAAF,OAAA,CAAAE,gBAAA,GAAAA,gBAAA"}
+{"version":3,"file":"defaults.js","names":["LOCALE","exports","CURRENCY","CURRENCY_DISPLAY","COUNTRY"],"sources":["../../../src/shared/defaults.ts"],"sourcesContent":["/**\n * DNB Eufemia Defaults\n *\n */\n\nexport const LOCALE = 'nb-NO'\nexport const CURRENCY = 'NOK'\nexport const CURRENCY_DISPLAY = 'code' // code, name, symbol, narrowSymbol\nexport const COUNTRY = 'NO' // ISO 3166-1 alpha-2\n"],"mappings":";;;;;;AAKO,MAAMA,MAAM,GAAG,OAAO;AAAAC,OAAA,CAAAD,MAAA,GAAAA,MAAA;AACtB,MAAME,QAAQ,GAAG,KAAK;AAAAD,OAAA,CAAAC,QAAA,GAAAA,QAAA;AACtB,MAAMC,gBAAgB,GAAG,MAAM;AAAAF,OAAA,CAAAE,gBAAA,GAAAA,gBAAA;AAC/B,MAAMC,OAAO,GAAG,IAAI;AAAAH,OAAA,CAAAG,OAAA,GAAAA,OAAA"}

package/cjs/shared/useTranslation.d.ts

@@ -1,16 +1,23 @@
+import React from 'react';
 import { Translation, TranslationLocale, TranslationCustomLocales, InternalLocale } from './Context';
 export type TranslationId = string;
 export type TranslationIdAsFunction<T = TranslationCustomLocales> = (messages: T & Translation) => string;
 export type TranslationArguments = Record<TranslationId, unknown>;
 export type UseTranslationMessages<T = Translation> = TranslationId | Translation | TranslationCustomLocales | Record<TranslationLocale, T>;
 export default function useTranslation<T = Translation>(messages?: UseTranslationMessages<T>, args?: TranslationArguments): any;
-export type combineWithExternalTranslationsArgs = {
+export type CombineWithExternalTranslationsArgs = {
     translation: Translation;
     messages?: TranslationCustomLocales;
     locale?: InternalLocale;
 };
-export type combineWithExternalTranslationsReturn = Translation & TranslationCustomLocales & {
+export type FormatMessage = {
     formatMessage: typeof formatMessage;
+    renderMessage: typeof renderMessage;
 };
-export declare function combineWithExternalTranslations({ translation, messages, locale, }: combineWithExternalTranslationsArgs): combineWithExternalTranslationsReturn;
-export declare function formatMessage(id: TranslationId | TranslationIdAsFunction, args: TranslationArguments, messages: TranslationCustomLocales): any;
+export type CombineWithExternalTranslationsReturn = Translation & TranslationCustomLocales & FormatMessage;
+export declare function useAdditionalUtils(): {
+    assignUtils: (translations: CombineWithExternalTranslationsReturn) => CombineWithExternalTranslationsReturn;
+};
+export declare function combineWithExternalTranslations({ translation, messages, locale, }: CombineWithExternalTranslationsArgs): CombineWithExternalTranslationsReturn;
+export declare function formatMessage(id: TranslationId | TranslationIdAsFunction, args?: TranslationArguments, messages?: TranslationCustomLocales): any;
+export declare function renderMessage(text: string | Array<React.ReactNode>): string | React.ReactNode;