@dnb/eufemia 10.14.0 → 10.15.0

package/es/elements/hr/style/dnb-hr.scss

@@ -11,40 +11,26 @@
 
   &--fullscreen::after {
     left: -100vw;
-    width: 200vw;
+    box-shadow: 100vw 0 0 0 currentcolor;
+    border-radius: 0;
   }
 
-  &--light::after {
-    border-radius: 0.25px;
+  --thickness: calc(var(--hr-thickness, 1px) + var(--modifier, 0px));
 
-    /* 
-    * 60% and 65% for best result on low res screens, like on Chromebook (Acer)
-    * Else the line will disappear!
-    */
-    background-image: linear-gradient(
-      to bottom,
-      currentcolor 60%,
-      transparent 65%
-    );
-    background-size: 100% 1px;
-    background-color: transparent;
-  }
-
-  &--medium::after {
-    height: 2px;
-    border-radius: 0.75px;
+  &--light {
+    --hr-thickness: 0.4px;
 
-    /* Revert the hairline halv */
-    background-image: linear-gradient(
-      to bottom,
-      currentcolor 51%,
-      transparent 51%
-    );
-    background-size: 100% 3px;
-    background-color: transparent;
+    // Modify the thickness, because the screenshot does not pick up the line when its under 1px.
+    // This may change in a later Playwright/Firefox version.
+    html[data-visual-test] & {
+      --modifier: 0.7px;
+    }
+  }
+  &--medium {
+    --hr-thickness: 1.5px;
   }
-}
 
-.dnb-spacing .dnb-hr {
-  @include ui-spacing.defaultSpacing();
+  .dnb-spacing & {
+    @include ui-spacing.defaultSpacing();
+  }
 }

package/es/elements/hr/style/hr-mixins.scss

@@ -3,9 +3,10 @@
 @mixin hrStyle() {
   position: relative;
   padding: 0;
+  width: 100%; // when nested in a flex container, we need this.
   height: 0;
 
-  display: flex;
+  display: flow-root; // avoid margin collapsing on Safari
 
   &:not([class*='dnb-space']) {
     margin: 0;
@@ -16,17 +17,14 @@
   &::after {
     content: '';
     position: absolute;
+    inset: 0;
     z-index: 1;
-    left: 0;
-    right: 0;
-    top: 0;
 
-    width: 100%;
-    height: 1px;
+    height: var(--thickness);
 
     color: inherit;
     background-color: currentcolor;
-    border-radius: 0.5px;
+    border-radius: calc(var(--thickness) / 2);
   }
 }
 

package/es/extensions/forms/DataContext/Context.d.ts

@@ -16,7 +16,7 @@ export interface ContextState {
     mountedFieldPaths: string[];
     handleMountField: (path: string) => void;
     handleUnMountField: (path: string) => void;
-    setPathWithError: (path: string, hasError: boolean) => void;
+    setValueWithError: (identifier: string, hasError: boolean) => void;
     hasErrors: () => boolean;
     _isInsideFormElement?: boolean;
 }

package/es/extensions/forms/DataContext/Context.js

@@ -9,7 +9,7 @@ export const defaultContextState = {
   handleMountField: () => null,
   handleUnMountField: () => null,
   hasErrors: () => false,
-  setPathWithError: () => null,
+  setValueWithError: () => null,
   _isInsideFormElement: false
 };
 const Context = React.createContext(defaultContextState);

package/es/extensions/forms/DataContext/Context.js.map

@@ -1 +1 @@
-{"version":3,"file":"Context.js","names":["React","defaultContextState","data","undefined","handlePathChange","handleSubmit","showAllErrors","setShowAllErrors","mountedFieldPaths","handleMountField","handleUnMountField","hasErrors","setPathWithError","_isInsideFormElement","Context","createContext"],"sources":["../../../../../src/extensions/forms/DataContext/Context.ts"],"sourcesContent":["import React from 'react'\n\ntype HandleSubmitProps = {\n  formElement?: HTMLFormElement\n}\n\nexport interface ContextState {\n  /** The dataset for the form / form steps */\n  data: any\n  /** Should the form validate data before submitting? */\n  errors?: Record<string, Error>\n  /** Will set autoComplete=\"on\" on each nested Field.String and Field.Number */\n  autoComplete?: boolean\n  handlePathChange: (path: string, value: any) => void\n  handleSubmit: (props?: HandleSubmitProps) => any\n  // Error status\n  showAllErrors: boolean\n  setShowAllErrors: (showAllErrors: boolean) => void\n  // Mounted fields - Components telling the provider what fields is on screen at any time\n  mountedFieldPaths: string[]\n  handleMountField: (path: string) => void\n  handleUnMountField: (path: string) => void\n  setPathWithError: (path: string, hasError: boolean) => void\n  hasErrors: () => boolean\n  _isInsideFormElement?: boolean\n}\n\nexport const defaultContextState: ContextState = {\n  data: undefined,\n  handlePathChange: () => null,\n  handleSubmit: () => null,\n  showAllErrors: false,\n  setShowAllErrors: () => null,\n  mountedFieldPaths: [],\n  handleMountField: () => null,\n  handleUnMountField: () => null,\n  hasErrors: () => false,\n  setPathWithError: () => null,\n  _isInsideFormElement: false,\n}\n\nconst Context = React.createContext<ContextState>(defaultContextState)\n\nexport default Context\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AA2BzB,OAAO,MAAMC,mBAAiC,GAAG;EAC/CC,IAAI,EAAEC,SAAS;EACfC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,aAAa,EAAE,KAAK;EACpBC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,iBAAiB,EAAE,EAAE;EACrBC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,kBAAkB,EAAEA,CAAA,KAAM,IAAI;EAC9BC,SAAS,EAAEA,CAAA,KAAM,KAAK;EACtBC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,oBAAoB,EAAE;AACxB,CAAC;AAED,MAAMC,OAAO,GAAGd,KAAK,CAACe,aAAa,CAAed,mBAAmB,CAAC;AAEtE,eAAea,OAAO"}
+{"version":3,"file":"Context.js","names":["React","defaultContextState","data","undefined","handlePathChange","handleSubmit","showAllErrors","setShowAllErrors","mountedFieldPaths","handleMountField","handleUnMountField","hasErrors","setValueWithError","_isInsideFormElement","Context","createContext"],"sources":["../../../../../src/extensions/forms/DataContext/Context.ts"],"sourcesContent":["import React from 'react'\n\ntype HandleSubmitProps = {\n  formElement?: HTMLFormElement\n}\n\nexport interface ContextState {\n  /** The dataset for the form / form steps */\n  data: any\n  /** Should the form validate data before submitting? */\n  errors?: Record<string, Error>\n  /** Will set autoComplete=\"on\" on each nested Field.String and Field.Number */\n  autoComplete?: boolean\n  handlePathChange: (path: string, value: any) => void\n  handleSubmit: (props?: HandleSubmitProps) => any\n  // Error status\n  showAllErrors: boolean\n  setShowAllErrors: (showAllErrors: boolean) => void\n  // Mounted fields - Components telling the provider what fields is on screen at any time\n  mountedFieldPaths: string[]\n  handleMountField: (path: string) => void\n  handleUnMountField: (path: string) => void\n  setValueWithError: (identifier: string, hasError: boolean) => void\n  hasErrors: () => boolean\n  _isInsideFormElement?: boolean\n}\n\nexport const defaultContextState: ContextState = {\n  data: undefined,\n  handlePathChange: () => null,\n  handleSubmit: () => null,\n  showAllErrors: false,\n  setShowAllErrors: () => null,\n  mountedFieldPaths: [],\n  handleMountField: () => null,\n  handleUnMountField: () => null,\n  hasErrors: () => false,\n  setValueWithError: () => null,\n  _isInsideFormElement: false,\n}\n\nconst Context = React.createContext<ContextState>(defaultContextState)\n\nexport default Context\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AA2BzB,OAAO,MAAMC,mBAAiC,GAAG;EAC/CC,IAAI,EAAEC,SAAS;EACfC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,YAAY,EAAEA,CAAA,KAAM,IAAI;EACxBC,aAAa,EAAE,KAAK;EACpBC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,iBAAiB,EAAE,EAAE;EACrBC,gBAAgB,EAAEA,CAAA,KAAM,IAAI;EAC5BC,kBAAkB,EAAEA,CAAA,KAAM,IAAI;EAC9BC,SAAS,EAAEA,CAAA,KAAM,KAAK;EACtBC,iBAAiB,EAAEA,CAAA,KAAM,IAAI;EAC7BC,oBAAoB,EAAE;AACxB,CAAC;AAED,MAAMC,OAAO,GAAGd,KAAK,CAACe,aAAa,CAAed,mBAAmB,CAAC;AAEtE,eAAea,OAAO"}

package/es/extensions/forms/DataContext/Provider/Provider.js

@@ -43,7 +43,7 @@ export default function Provider(_ref) {
   const setShowAllErrors = useCallback(showAllErrors => {
     showAllErrorsRef.current = showAllErrors;
   }, []);
-  const pathsWithErrorRef = useRef([]);
+  const valuesWithErrorRef = useRef([]);
   const initialData = useMemo(() => {
     if (sessionStorageId && typeof window !== 'undefined') {
       var _window$sessionStorag;
@@ -77,10 +77,13 @@ export default function Provider(_ref) {
   }, [schema, validateData]);
   const hasErrors = useCallback(() => Boolean(mountedFieldPathsRef.current.find(mountedFieldPath => {
     var _errorsRef$current;
-    return ((_errorsRef$current = errorsRef.current) === null || _errorsRef$current === void 0 ? void 0 : _errorsRef$current[mountedFieldPath]) !== undefined || pathsWithErrorRef.current.includes(mountedFieldPath);
+    return ((_errorsRef$current = errorsRef.current) === null || _errorsRef$current === void 0 ? void 0 : _errorsRef$current[mountedFieldPath]) !== undefined || valuesWithErrorRef.current.includes(mountedFieldPath);
   })), []);
-  const setPathWithError = useCallback((path, hasError) => {
-    pathsWithErrorRef.current = hasError ? addListPath(pathsWithErrorRef.current, path) : removeListPath(pathsWithErrorRef.current, path);
+  const setValueWithError = useCallback((identifier, withError) => {
+    if (withError !== valuesWithErrorRef.current.includes(identifier)) {
+      valuesWithErrorRef.current = withError ? addListPath(valuesWithErrorRef.current, identifier) : removeListPath(valuesWithErrorRef.current, identifier);
+      forceUpdate();
+    }
   }, []);
   const handlePathChange = useCallback((path, value) => {
     var _internalDataRef$curr;
@@ -130,6 +133,7 @@ export default function Provider(_ref) {
     } else {
       showAllErrorsRef.current = true;
       onSubmitRequest === null || onSubmitRequest === void 0 ? void 0 : onSubmitRequest();
+      forceUpdate();
     }
     return internalDataRef.current;
   }, [scrollTopOnSubmit, hasErrors, onSubmit, onSubmitRequest, sessionStorageId]);
@@ -154,7 +158,7 @@ export default function Provider(_ref) {
       handleMountField,
       handleUnMountField,
       hasErrors,
-      setPathWithError
+      setValueWithError
     })
   }, children);
 }

package/es/extensions/forms/DataContext/Provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","names":["React","useEffect","useRef","useMemo","useCallback","useReducer","pointer","ajv","ajvErrorsToFormErrors","useMountEffect","useUpdateEffect","Context","structuredClone","addListPath","paths","path","includes","concat","removeListPath","filter","thisPath","isArrayJsonPointer","Provider","_ref","defaultData","data","schema","onChange","onPathChange","onSubmit","onSubmitRequest","scrollTopOnSubmit","sessionStorageId","children","rest","_objectWithoutProperties","_excluded","forceUpdate","undefined","console","error","mountedFieldPathsRef","errorsRef","showAllErrorsRef","setShowAllErrors","showAllErrors","current","pathsWithErrorRef","initialData","window","_window$sessionStorag","sessionDataJSON","sessionStorage","getItem","JSON","parse","internalDataRef","ajvSchemaValidatorRef","validateData","errors","compile","hasErrors","Boolean","find","mountedFieldPath","_errorsRef$current","setPathWithError","hasError","handlePathChange","value","_internalDataRef$curr","newData","match","set","_window$sessionStorag2","setItem","stringify","handleMountField","handleUnMountField","handleSubmit","formElement","_formElement$reset","reset","call","removeItem","_window","scrollTo","top","behavior","createElement","_objectSpread","mountedFieldPaths"],"sources":["../../../../../../src/extensions/forms/DataContext/Provider/Provider.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useRef,\n  useMemo,\n  useCallback,\n  useReducer,\n} from 'react'\nimport pointer, { JsonObject } from 'json-pointer'\nimport { JSONSchema7 } from 'json-schema'\nimport { ValidateFunction } from 'ajv'\nimport ajv, { ajvErrorsToFormErrors } from '../../utils/ajv'\nimport { FormError } from '../../types'\nimport useMountEffect from '../../hooks/useMountEffect'\nimport useUpdateEffect from '../../hooks/useUpdateEffect'\nimport Context, { ContextState } from '../Context'\n\n/**\n * Deprecated, as it is supported by all major browsers and Node.js >=v18\n * So its a question of time, when we will remove this polyfill\n */\nimport structuredClone from '@ungap/structured-clone'\n\nexport interface Props<Data extends JsonObject> {\n  /** Default source data, only used if no other source is available, and not leading to updates if changed after mount */\n  defaultData?: Partial<Data>\n  /** Dynamic source data used as both initial data, and updates internal data if changed after mount */\n  data?: Partial<Data>\n  /** JSON Schema for validating the data, like during input or after attempting submit */\n  schema?: JSONSchema7\n  /** Change handler for the whole data set */\n  onChange?: (data: Data) => void\n  /** Change handler for each value  */\n  onPathChange?: (path: string, value: any) => void\n  /** Submit called, data was valid (if validation available) */\n  onSubmit?: (data: Data) => void\n  /** Submit was requested, but data was invalid */\n  onSubmitRequest?: () => void\n  scrollTopOnSubmit?: boolean\n  /** Key for caching the data in session storage */\n  sessionStorageId?: string\n  children: React.ReactNode\n}\n\ntype PathList = string[]\n\nfunction addListPath(paths: PathList, path: string): PathList {\n  return paths.includes(path) ? paths : paths.concat(path)\n}\n\nfunction removeListPath(paths: PathList, path: string): PathList {\n  return paths.filter((thisPath) => thisPath !== path)\n}\n\nconst isArrayJsonPointer = /^\\/\\d+(\\/|$)/\n\nexport default function Provider<Data extends JsonObject>({\n  defaultData,\n  data,\n  schema,\n  onChange,\n  onPathChange,\n  onSubmit,\n  onSubmitRequest,\n  scrollTopOnSubmit,\n  sessionStorageId,\n  children,\n  ...rest\n}: Props<Data>) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  // Prop error handling\n  if (data !== undefined && sessionStorageId !== undefined) {\n    console.error(\n      'Providing both data and sessionStorageId could lead to competing data sources. To provide default data to use only before anything is changed in the interface, use defaultData.'\n    )\n  }\n\n  // State\n  const mountedFieldPathsRef = useRef<string[]>([])\n  // - Errors from provider validation (the whole data set)\n  const errorsRef = useRef<Record<string, FormError> | undefined>()\n  const showAllErrorsRef = useRef<boolean>(false)\n  const setShowAllErrors = useCallback((showAllErrors: boolean) => {\n    showAllErrorsRef.current = showAllErrors\n  }, [])\n  // - Errors reported by fields, based on their direct validation rules\n  const pathsWithErrorRef = useRef<string[]>([])\n  // - Data\n  const initialData = useMemo(() => {\n    if (sessionStorageId && typeof window !== 'undefined') {\n      const sessionDataJSON =\n        window.sessionStorage?.getItem(sessionStorageId)\n      if (sessionDataJSON) {\n        return JSON.parse(sessionDataJSON)\n      }\n    }\n    return data ?? defaultData\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- Avoid triggering code that should only run initially\n  }, [])\n  const internalDataRef = useRef<Partial<Data>>(initialData)\n  // - Validator\n  const ajvSchemaValidatorRef = useRef<ValidateFunction>()\n\n  const validateData = useCallback(() => {\n    if (!ajvSchemaValidatorRef.current) {\n      // No schema-based validator. Assume data is valid.\n      return\n    }\n\n    if (!ajvSchemaValidatorRef.current(internalDataRef.current)) {\n      // Errors found\n      const errors = ajvErrorsToFormErrors(\n        ajvSchemaValidatorRef.current.errors\n      )\n      errorsRef.current = errors\n    } else {\n      errorsRef.current = undefined\n    }\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    if (!schema) {\n      return\n    }\n    ajvSchemaValidatorRef.current = ajv.compile(schema)\n    validateData()\n  }, [schema, validateData])\n\n  // Error handling\n  const hasErrors = useCallback(\n    () =>\n      Boolean(\n        mountedFieldPathsRef.current.find(\n          (mountedFieldPath) =>\n            errorsRef.current?.[mountedFieldPath] !== undefined ||\n            pathsWithErrorRef.current.includes(mountedFieldPath)\n        )\n      ),\n    []\n  )\n\n  const setPathWithError = useCallback(\n    (path: string, hasError: boolean) => {\n      pathsWithErrorRef.current = hasError\n        ? addListPath(pathsWithErrorRef.current, path)\n        : removeListPath(pathsWithErrorRef.current, path)\n    },\n    []\n  )\n\n  const handlePathChange = useCallback(\n    (path, value) => {\n      if (!path) {\n        return\n      }\n      onPathChange?.(path, value)\n\n      // Update the data even if it contains errors. Submit/SubmitRequest will be called accordingly\n      const newData = structuredClone(\n        path === '/'\n          ? // When setting the root of the data, the whole data set should be the new value\n            value\n          : // For sub paths, use the the existing data set (or empty array/object), but modify it below (since pointer.set is not immutable)\n            internalDataRef.current ??\n              (path.match(isArrayJsonPointer) ? [] : {})\n      )\n      if (path !== '/') {\n        pointer.set(newData as Data, path, value)\n      }\n\n      onChange?.(newData as Data)\n\n      if (sessionStorageId && typeof window !== 'undefined') {\n        window.sessionStorage?.setItem(\n          sessionStorageId,\n          JSON.stringify(newData)\n        )\n      }\n\n      internalDataRef.current = newData\n\n      validateData()\n      showAllErrorsRef.current = false\n      forceUpdate()\n    },\n    [onChange, onPathChange, validateData, sessionStorageId]\n  )\n\n  // Mounted fields\n  const handleMountField = useCallback((path: string) => {\n    mountedFieldPathsRef.current = addListPath(\n      mountedFieldPathsRef.current,\n      path\n    )\n  }, [])\n\n  const handleUnMountField = useCallback((path: string) => {\n    mountedFieldPathsRef.current = removeListPath(\n      mountedFieldPathsRef.current,\n      path\n    )\n  }, [])\n\n  /**\n   * Request to submit the whole form\n   */\n  const handleSubmit = useCallback<ContextState['handleSubmit']>(\n    ({ formElement = null } = {}) => {\n      if (!hasErrors()) {\n        onSubmit?.(internalDataRef.current as Data)\n\n        formElement?.reset?.()\n\n        if (typeof window !== 'undefined') {\n          if (sessionStorageId) {\n            window.sessionStorage.removeItem(sessionStorageId)\n          }\n\n          if (scrollTopOnSubmit) {\n            window?.scrollTo({ top: 0, behavior: 'smooth' })\n          }\n        }\n      } else {\n        showAllErrorsRef.current = true\n        onSubmitRequest?.()\n      }\n      return internalDataRef.current\n    },\n    [\n      scrollTopOnSubmit,\n      hasErrors,\n      onSubmit,\n      onSubmitRequest,\n      sessionStorageId,\n    ]\n  )\n\n  useMountEffect(() => {\n    // Validate the initial data\n    validateData()\n  })\n\n  useUpdateEffect(() => {\n    // Update and validate changes to the external data set\n    internalDataRef.current = data\n    validateData()\n    forceUpdate()\n  }, [data, validateData, forceUpdate])\n\n  return (\n    <Context.Provider\n      value={{\n        data: internalDataRef.current,\n        ...rest,\n        handlePathChange,\n        handleSubmit,\n        errors: errorsRef.current,\n        showAllErrors: showAllErrorsRef.current,\n        setShowAllErrors,\n        mountedFieldPaths: mountedFieldPathsRef.current,\n        handleMountField,\n        handleUnMountField,\n        hasErrors,\n        setPathWithError,\n      }}\n    >\n      {children}\n    </Context.Provider>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Provider.js","names":["React","useEffect","useRef","useMemo","useCallback","useReducer","pointer","ajv","ajvErrorsToFormErrors","useMountEffect","useUpdateEffect","Context","structuredClone","addListPath","paths","path","includes","concat","removeListPath","filter","thisPath","isArrayJsonPointer","Provider","_ref","defaultData","data","schema","onChange","onPathChange","onSubmit","onSubmitRequest","scrollTopOnSubmit","sessionStorageId","children","rest","_objectWithoutProperties","_excluded","forceUpdate","undefined","console","error","mountedFieldPathsRef","errorsRef","showAllErrorsRef","setShowAllErrors","showAllErrors","current","valuesWithErrorRef","initialData","window","_window$sessionStorag","sessionDataJSON","sessionStorage","getItem","JSON","parse","internalDataRef","ajvSchemaValidatorRef","validateData","errors","compile","hasErrors","Boolean","find","mountedFieldPath","_errorsRef$current","setValueWithError","identifier","withError","handlePathChange","value","_internalDataRef$curr","newData","match","set","_window$sessionStorag2","setItem","stringify","handleMountField","handleUnMountField","handleSubmit","formElement","_formElement$reset","reset","call","removeItem","_window","scrollTo","top","behavior","createElement","_objectSpread","mountedFieldPaths"],"sources":["../../../../../../src/extensions/forms/DataContext/Provider/Provider.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useRef,\n  useMemo,\n  useCallback,\n  useReducer,\n} from 'react'\nimport pointer, { JsonObject } from 'json-pointer'\nimport { JSONSchema7 } from 'json-schema'\nimport { ValidateFunction } from 'ajv'\nimport ajv, { ajvErrorsToFormErrors } from '../../utils/ajv'\nimport { FormError } from '../../types'\nimport useMountEffect from '../../hooks/useMountEffect'\nimport useUpdateEffect from '../../hooks/useUpdateEffect'\nimport Context, { ContextState } from '../Context'\n\n/**\n * Deprecated, as it is supported by all major browsers and Node.js >=v18\n * So its a question of time, when we will remove this polyfill\n */\nimport structuredClone from '@ungap/structured-clone'\n\nexport interface Props<Data extends JsonObject> {\n  /** Default source data, only used if no other source is available, and not leading to updates if changed after mount */\n  defaultData?: Partial<Data>\n  /** Dynamic source data used as both initial data, and updates internal data if changed after mount */\n  data?: Partial<Data>\n  /** JSON Schema for validating the data, like during input or after attempting submit */\n  schema?: JSONSchema7\n  /** Change handler for the whole data set */\n  onChange?: (data: Data) => void\n  /** Change handler for each value  */\n  onPathChange?: (path: string, value: any) => void\n  /** Submit called, data was valid (if validation available) */\n  onSubmit?: (data: Data) => void\n  /** Submit was requested, but data was invalid */\n  onSubmitRequest?: () => void\n  scrollTopOnSubmit?: boolean\n  /** Key for caching the data in session storage */\n  sessionStorageId?: string\n  children: React.ReactNode\n}\n\ntype PathList = string[]\n\nfunction addListPath(paths: PathList, path: string): PathList {\n  return paths.includes(path) ? paths : paths.concat(path)\n}\n\nfunction removeListPath(paths: PathList, path: string): PathList {\n  return paths.filter((thisPath) => thisPath !== path)\n}\n\nconst isArrayJsonPointer = /^\\/\\d+(\\/|$)/\n\nexport default function Provider<Data extends JsonObject>({\n  defaultData,\n  data,\n  schema,\n  onChange,\n  onPathChange,\n  onSubmit,\n  onSubmitRequest,\n  scrollTopOnSubmit,\n  sessionStorageId,\n  children,\n  ...rest\n}: Props<Data>) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n  // Prop error handling\n  if (data !== undefined && sessionStorageId !== undefined) {\n    console.error(\n      'Providing both data and sessionStorageId could lead to competing data sources. To provide default data to use only before anything is changed in the interface, use defaultData.'\n    )\n  }\n\n  // State\n  const mountedFieldPathsRef = useRef<string[]>([])\n  // - Errors from provider validation (the whole data set)\n  const errorsRef = useRef<Record<string, FormError> | undefined>()\n  const showAllErrorsRef = useRef<boolean>(false)\n  const setShowAllErrors = useCallback((showAllErrors: boolean) => {\n    showAllErrorsRef.current = showAllErrors\n  }, [])\n  // - Errors reported by fields, based on their direct validation rules\n  const valuesWithErrorRef = useRef<string[]>([])\n  // - Data\n  const initialData = useMemo(() => {\n    if (sessionStorageId && typeof window !== 'undefined') {\n      const sessionDataJSON =\n        window.sessionStorage?.getItem(sessionStorageId)\n      if (sessionDataJSON) {\n        return JSON.parse(sessionDataJSON)\n      }\n    }\n    return data ?? defaultData\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- Avoid triggering code that should only run initially\n  }, [])\n  const internalDataRef = useRef<Partial<Data>>(initialData)\n  // - Validator\n  const ajvSchemaValidatorRef = useRef<ValidateFunction>()\n\n  const validateData = useCallback(() => {\n    if (!ajvSchemaValidatorRef.current) {\n      // No schema-based validator. Assume data is valid.\n      return\n    }\n\n    if (!ajvSchemaValidatorRef.current(internalDataRef.current)) {\n      // Errors found\n      const errors = ajvErrorsToFormErrors(\n        ajvSchemaValidatorRef.current.errors\n      )\n      errorsRef.current = errors\n    } else {\n      errorsRef.current = undefined\n    }\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    if (!schema) {\n      return\n    }\n    ajvSchemaValidatorRef.current = ajv.compile(schema)\n    validateData()\n  }, [schema, validateData])\n\n  // Error handling\n  const hasErrors = useCallback(\n    () =>\n      Boolean(\n        mountedFieldPathsRef.current.find(\n          (mountedFieldPath) =>\n            errorsRef.current?.[mountedFieldPath] !== undefined ||\n            valuesWithErrorRef.current.includes(mountedFieldPath)\n        )\n      ),\n    []\n  )\n\n  const setValueWithError = useCallback(\n    (identifier: string, withError: boolean) => {\n      if (withError !== valuesWithErrorRef.current.includes(identifier)) {\n        // The boolean error state for the target value was changed\n        valuesWithErrorRef.current = withError\n          ? addListPath(valuesWithErrorRef.current, identifier)\n          : removeListPath(valuesWithErrorRef.current, identifier)\n        forceUpdate()\n      }\n    },\n    []\n  )\n\n  const handlePathChange = useCallback(\n    (path, value) => {\n      if (!path) {\n        return\n      }\n      onPathChange?.(path, value)\n\n      // Update the data even if it contains errors. Submit/SubmitRequest will be called accordingly\n      const newData = structuredClone(\n        path === '/'\n          ? // When setting the root of the data, the whole data set should be the new value\n            value\n          : // For sub paths, use the the existing data set (or empty array/object), but modify it below (since pointer.set is not immutable)\n            internalDataRef.current ??\n              (path.match(isArrayJsonPointer) ? [] : {})\n      )\n      if (path !== '/') {\n        pointer.set(newData as Data, path, value)\n      }\n\n      onChange?.(newData as Data)\n\n      if (sessionStorageId && typeof window !== 'undefined') {\n        window.sessionStorage?.setItem(\n          sessionStorageId,\n          JSON.stringify(newData)\n        )\n      }\n\n      internalDataRef.current = newData\n\n      validateData()\n      showAllErrorsRef.current = false\n      forceUpdate()\n    },\n    [onChange, onPathChange, validateData, sessionStorageId]\n  )\n\n  // Mounted fields\n  const handleMountField = useCallback((path: string) => {\n    mountedFieldPathsRef.current = addListPath(\n      mountedFieldPathsRef.current,\n      path\n    )\n  }, [])\n\n  const handleUnMountField = useCallback((path: string) => {\n    mountedFieldPathsRef.current = removeListPath(\n      mountedFieldPathsRef.current,\n      path\n    )\n  }, [])\n\n  /**\n   * Request to submit the whole form\n   */\n  const handleSubmit = useCallback<ContextState['handleSubmit']>(\n    ({ formElement = null } = {}) => {\n      if (!hasErrors()) {\n        onSubmit?.(internalDataRef.current as Data)\n\n        formElement?.reset?.()\n\n        if (typeof window !== 'undefined') {\n          if (sessionStorageId) {\n            window.sessionStorage.removeItem(sessionStorageId)\n          }\n\n          if (scrollTopOnSubmit) {\n            window?.scrollTo({ top: 0, behavior: 'smooth' })\n          }\n        }\n      } else {\n        showAllErrorsRef.current = true\n        onSubmitRequest?.()\n        forceUpdate()\n      }\n      return internalDataRef.current\n    },\n    [\n      scrollTopOnSubmit,\n      hasErrors,\n      onSubmit,\n      onSubmitRequest,\n      sessionStorageId,\n    ]\n  )\n\n  useMountEffect(() => {\n    // Validate the initial data\n    validateData()\n  })\n\n  useUpdateEffect(() => {\n    // Update and validate changes to the external data set\n    internalDataRef.current = data\n    validateData()\n    forceUpdate()\n  }, [data, validateData, forceUpdate])\n\n  return (\n    <Context.Provider\n      value={{\n        data: internalDataRef.current,\n        ...rest,\n        handlePathChange,\n        handleSubmit,\n        errors: errorsRef.current,\n        showAllErrors: showAllErrorsRef.current,\n        setShowAllErrors,\n        mountedFieldPaths: mountedFieldPathsRef.current,\n        handleMountField,\n        handleUnMountField,\n        hasErrors,\n        setValueWithError,\n      }}\n    >\n      {children}\n    </Context.Provider>\n  )\n}\n"],"mappings":"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"}

package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.css

@@ -1,9 +1,3 @@
-:root {
-  --forms-field-width--small: 5rem;
-  --forms-field-width--medium: 11rem;
-  --forms-field-width--large: 21rem;
-}
-
 .dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
   display: flex;
   flex-flow: column;

package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.min.css

@@ -1 +1 @@
-:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{grid-row-gap:var(--spacing-x-small);display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{grid-column-gap:var(--spacing-small);-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}
+.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{grid-row-gap:var(--spacing-x-small);display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{grid-column-gap:var(--spacing-small);-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}

package/es/extensions/forms/Field/ArraySelection/style/dnb-array-selection.scss

@@ -1,5 +1,3 @@
-@import '../../style/field-sizes.scss';
-
 .dnb-forms-field-array-selection {
   &--options-layout-vertical &__options {
     display: flex;

package/es/extensions/forms/Field/Currency/Currency.d.ts

@@ -1,6 +1,8 @@
+import { Props as NumberProps } from '../Number';
 import type { FieldProps, FieldHelpProps } from '../../types';
 export type Props = FieldHelpProps & FieldProps<number, undefined> & {
-    currency?: string;
+    currency?: NumberProps['currency'];
+    rightAligned?: NumberProps['rightAligned'];
 };
 declare function Currency(props: Props): import("react/jsx-runtime").JSX.Element;
 declare namespace Currency {

package/es/extensions/forms/Field/Currency/Currency.js

@@ -1,15 +1,21 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
 import classnames from 'classnames';
+import { Context } from '../../../../shared';
+import { getCurrencySymbol } from '../../../../components/number-format/NumberUtils';
+import { CURRENCY } from '../../../../shared/defaults';
 import NumberComponent from '../Number';
 function Currency(props) {
   var _props$currency, _props$placeholder;
+  const context = React.useContext(Context);
   const preparedProps = _objectSpread(_objectSpread({}, props), {}, {
-    currency: (_props$currency = props.currency) !== null && _props$currency !== void 0 ? _props$currency : 'NOK',
-    placeholder: (_props$placeholder = props.placeholder) !== null && _props$placeholder !== void 0 ? _props$placeholder : 'kr'
+    currency: (_props$currency = props.currency) !== null && _props$currency !== void 0 ? _props$currency : CURRENCY,
+    placeholder: (_props$placeholder = props.placeholder) !== null && _props$placeholder !== void 0 ? _props$placeholder : getCurrencySymbol(context === null || context === void 0 ? void 0 : context.locale, props.currency)
   });
   return React.createElement(NumberComponent, _extends({}, preparedProps, {
     className: classnames('dnb-forms-field-currency', props.className)

package/es/extensions/forms/Field/Currency/Currency.js.map

@@ -1 +1 @@
-{"version":3,"file":"Currency.js","names":["React","classnames","NumberComponent","Currency","props","_props$currency","_props$placeholder","preparedProps","_objectSpread","currency","placeholder","createElement","_extends","className","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Currency/Currency.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport NumberComponent from '../Number'\nimport type { FieldProps, FieldHelpProps } from '../../types'\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined> & {\n    currency?: string\n  }\n\nfunction Currency(props: Props) {\n  const preparedProps = {\n    ...props,\n    currency: props.currency ?? 'NOK',\n    placeholder: props.placeholder ?? 'kr',\n  }\n\n  return (\n    <NumberComponent\n      {...preparedProps}\n      className={classnames('dnb-forms-field-currency', props.className)}\n    />\n  )\n}\n\nCurrency._supportsSpacingProps = true\nexport default Currency\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,eAAe,MAAM,WAAW;AAQvC,SAASC,QAAQA,CAACC,KAAY,EAAE;EAAA,IAAAC,eAAA,EAAAC,kBAAA;EAC9B,MAAMC,aAAa,GAAAC,aAAA,CAAAA,aAAA,KACdJ,KAAK;IACRK,QAAQ,GAAAJ,eAAA,GAAED,KAAK,CAACK,QAAQ,cAAAJ,eAAA,cAAAA,eAAA,GAAI,KAAK;IACjCK,WAAW,GAAAJ,kBAAA,GAAEF,KAAK,CAACM,WAAW,cAAAJ,kBAAA,cAAAA,kBAAA,GAAI;EAAI,EACvC;EAED,OACEN,KAAA,CAAAW,aAAA,CAACT,eAAe,EAAAU,QAAA,KACVL,aAAa;IACjBM,SAAS,EAAEZ,UAAU,CAAC,0BAA0B,EAAEG,KAAK,CAACS,SAAS;EAAE,EACpE,CAAC;AAEN;AAEAV,QAAQ,CAACW,qBAAqB,GAAG,IAAI;AACrC,eAAeX,QAAQ"}
+{"version":3,"file":"Currency.js","names":["React","classnames","Context","getCurrencySymbol","CURRENCY","NumberComponent","Currency","props","_props$currency","_props$placeholder","context","useContext","preparedProps","_objectSpread","currency","placeholder","locale","createElement","_extends","className","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Currency/Currency.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Context } from '../../../../shared'\nimport { getCurrencySymbol } from '../../../../components/number-format/NumberUtils'\nimport { CURRENCY } from '../../../../shared/defaults'\nimport NumberComponent, { Props as NumberProps } from '../Number'\nimport type { FieldProps, FieldHelpProps } from '../../types'\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined> & {\n    currency?: NumberProps['currency']\n    rightAligned?: NumberProps['rightAligned']\n  }\n\nfunction Currency(props: Props) {\n  const context = React.useContext(Context)\n  const preparedProps = {\n    ...props,\n    currency: props.currency ?? CURRENCY,\n    placeholder:\n      props.placeholder ??\n      getCurrencySymbol(context?.locale, props.currency),\n  }\n\n  return (\n    <NumberComponent\n      {...preparedProps}\n      className={classnames('dnb-forms-field-currency', props.className)}\n    />\n  )\n}\n\nCurrency._supportsSpacingProps = true\nexport default Currency\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,iBAAiB,QAAQ,kDAAkD;AACpF,SAASC,QAAQ,QAAQ,6BAA6B;AACtD,OAAOC,eAAe,MAAgC,WAAW;AASjE,SAASC,QAAQA,CAACC,KAAY,EAAE;EAAA,IAAAC,eAAA,EAAAC,kBAAA;EAC9B,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAACT,OAAO,CAAC;EACzC,MAAMU,aAAa,GAAAC,aAAA,CAAAA,aAAA,KACdN,KAAK;IACRO,QAAQ,GAAAN,eAAA,GAAED,KAAK,CAACO,QAAQ,cAAAN,eAAA,cAAAA,eAAA,GAAIJ,QAAQ;IACpCW,WAAW,GAAAN,kBAAA,GACTF,KAAK,CAACQ,WAAW,cAAAN,kBAAA,cAAAA,kBAAA,GACjBN,iBAAiB,CAACO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,MAAM,EAAET,KAAK,CAACO,QAAQ;EAAC,EACrD;EAED,OACEd,KAAA,CAAAiB,aAAA,CAACZ,eAAe,EAAAa,QAAA,KACVN,aAAa;IACjBO,SAAS,EAAElB,UAAU,CAAC,0BAA0B,EAAEM,KAAK,CAACY,SAAS;EAAE,EACpE,CAAC;AAEN;AAEAb,QAAQ,CAACc,qBAAqB,GAAG,IAAI;AACrC,eAAed,QAAQ"}

package/es/extensions/forms/Field/Expiry/Expiry.js

@@ -44,15 +44,15 @@ function Expiry(props) {
   const idRef = useRef(propsId || makeUniqueId()).current;
   const status = error ? 'error' : warning ? 'warn' : info ? 'info' : null;
   return React.createElement(FieldBlock, _extends({
-    className: classnames(className),
+    className: classnames('dnb-forms-field-expiry', className),
     labelSecondary: labelSecondary,
     labelDescription: labelDescription,
     info: info,
     warning: warning,
     error: error
   }, pickSpacingProps(props)), React.createElement(MultiInputMask, {
+    stretch: true,
     id: `${idRef}__input`,
-    className: "dnb-forms-field-expiry",
     label: label,
     labelDirection: layout,
     values: expiry,
@@ -68,12 +68,14 @@ function Expiry(props) {
       id: 'month',
       label: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.DatePicker['month'],
       mask: [/[0-1]/, expiry.month.charAt(0) === '0' || expiry.month.charAt(0) === '' ? /[1-9]/ : /[0-2]/],
-      placeholderCharacter: placeholders['month']
+      placeholderCharacter: placeholders['month'],
+      autoComplete: 'cc-exp-month'
     }, {
       id: 'year',
       label: sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.DatePicker['year'],
       mask: [/[0-9]/, /[0-9]/],
-      placeholderCharacter: placeholders['year']
+      placeholderCharacter: placeholders['year'],
+      autoComplete: 'cc-exp-year'
     }],
     suffix: help ? React.createElement(HelpButton, {
       title: help.title

package/es/extensions/forms/Field/Expiry/Expiry.js.map

@@ -1 +1 @@
-{"version":3,"file":"Expiry.js","names":["React","useContext","useRef","makeUniqueId","SharedContext","pickSpacingProps","useDataValue","classnames","FieldBlock","MultiInputMask","HelpButton","Expiry","props","_value$substring","_value$substring2","sharedContext","placeholders","translation","DatePicker","placeholder_characters","id","propsId","className","label","Forms","expiryLabel","error","info","warning","help","disabled","value","labelDescription","labelSecondary","layout","required","handleFocus","handleBlur","handleChange","_objectSpread","emptyValue","expiry","month","substring","year","idRef","current","status","createElement","_extends","labelDirection","values","statusState","undefined","onChange","expiryToString","onBlur","onFocus","delimiter","inputs","mask","charAt","placeholderCharacter","suffix","title","contents","Object","join","_supportsEufemiaSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Expiry/Expiry.tsx"],"sourcesContent":["import React, { useContext, useRef } from 'react'\nimport { makeUniqueId } from '../../../../shared/component-helper'\nimport SharedContext from '../../../../shared/Context'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { useDataValue } from '../../hooks'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { MultiInputMask } from '../../../../components/input-masked'\nimport type { MultiInputMaskValue } from '../../../../components/input-masked'\nimport { HelpButton } from '../../../../components'\n\ntype ExpiryValue = MultiInputMaskValue<'month' | 'year'>\n\nexport type ExpiryProps = FieldProps<string> & FieldHelpProps\n\nfunction Expiry(props: ExpiryProps) {\n  const sharedContext = useContext(SharedContext)\n  const placeholders =\n    sharedContext?.translation.DatePicker.placeholder_characters\n\n  const {\n    id: propsId,\n    className,\n    label = sharedContext?.translation.Forms.expiryLabel,\n    error,\n    info,\n    warning,\n    help,\n    disabled,\n    value = '',\n    labelDescription,\n    labelSecondary,\n    layout = 'vertical',\n    required,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue({\n    ...props,\n    emptyValue: '',\n  })\n\n  const expiry: ExpiryValue = {\n    month: value.substring(0, 2) ?? '',\n    year: value.substring(2, 4) ?? '',\n  }\n\n  const idRef = useRef(propsId || makeUniqueId()).current\n\n  const status = error ? 'error' : warning ? 'warn' : info ? 'info' : null\n\n  return (\n    <FieldBlock\n      className={classnames(className)}\n      labelSecondary={labelSecondary}\n      labelDescription={labelDescription}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <MultiInputMask\n        id={`${idRef}__input`}\n        className=\"dnb-forms-field-expiry\"\n        label={label}\n        labelDirection={layout}\n        values={expiry}\n        status={status}\n        statusState={disabled ? 'disabled' : undefined}\n        disabled={disabled}\n        required={required}\n        onChange={(expiry) => handleChange(expiryToString(expiry))}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        delimiter=\"/\"\n        inputs={[\n          {\n            id: 'month',\n            label: sharedContext?.translation.DatePicker['month'],\n            mask: [\n              /[0-1]/,\n              expiry.month.charAt(0) === '0' ||\n              expiry.month.charAt(0) === ''\n                ? /[1-9]/\n                : /[0-2]/,\n            ],\n            placeholderCharacter: placeholders['month'],\n          },\n          {\n            id: 'year',\n            label: sharedContext?.translation.DatePicker['year'],\n            mask: [/[0-9]/, /[0-9]/],\n            placeholderCharacter: placeholders['year'],\n          },\n        ]}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n\n  function expiryToString(values: ExpiryValue) {\n    return Object.values(values).join('')\n  }\n}\n\nExpiry._supportsEufemiaSpacingProps = true\nexport default Expiry\n"],"mappings":"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"}
+{"version":3,"file":"Expiry.js","names":["React","useContext","useRef","makeUniqueId","SharedContext","pickSpacingProps","useDataValue","classnames","FieldBlock","MultiInputMask","HelpButton","Expiry","props","_value$substring","_value$substring2","sharedContext","placeholders","translation","DatePicker","placeholder_characters","id","propsId","className","label","Forms","expiryLabel","error","info","warning","help","disabled","value","labelDescription","labelSecondary","layout","required","handleFocus","handleBlur","handleChange","_objectSpread","emptyValue","expiry","month","substring","year","idRef","current","status","createElement","_extends","stretch","labelDirection","values","statusState","undefined","onChange","expiryToString","onBlur","onFocus","delimiter","inputs","mask","charAt","placeholderCharacter","autoComplete","suffix","title","contents","Object","join","_supportsEufemiaSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Expiry/Expiry.tsx"],"sourcesContent":["import React, { useContext, useRef } from 'react'\nimport { makeUniqueId } from '../../../../shared/component-helper'\nimport SharedContext from '../../../../shared/Context'\nimport { FieldHelpProps, FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { useDataValue } from '../../hooks'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { MultiInputMask } from '../../../../components/input-masked'\nimport type { MultiInputMaskValue } from '../../../../components/input-masked'\nimport { HelpButton } from '../../../../components'\n\ntype ExpiryValue = MultiInputMaskValue<'month' | 'year'>\n\nexport type ExpiryProps = FieldProps<string> & FieldHelpProps\n\nfunction Expiry(props: ExpiryProps) {\n  const sharedContext = useContext(SharedContext)\n  const placeholders =\n    sharedContext?.translation.DatePicker.placeholder_characters\n\n  const {\n    id: propsId,\n    className,\n    label = sharedContext?.translation.Forms.expiryLabel,\n    error,\n    info,\n    warning,\n    help,\n    disabled,\n    value = '',\n    labelDescription,\n    labelSecondary,\n    layout = 'vertical',\n    required,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue({\n    ...props,\n    emptyValue: '',\n  })\n\n  const expiry: ExpiryValue = {\n    month: value.substring(0, 2) ?? '',\n    year: value.substring(2, 4) ?? '',\n  }\n\n  const idRef = useRef(propsId || makeUniqueId()).current\n\n  const status = error ? 'error' : warning ? 'warn' : info ? 'info' : null\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-expiry', className)}\n      labelSecondary={labelSecondary}\n      labelDescription={labelDescription}\n      info={info}\n      warning={warning}\n      error={error}\n      {...pickSpacingProps(props)}\n    >\n      <MultiInputMask\n        stretch\n        id={`${idRef}__input`}\n        label={label}\n        labelDirection={layout}\n        values={expiry}\n        status={status}\n        statusState={disabled ? 'disabled' : undefined}\n        disabled={disabled}\n        required={required}\n        onChange={(expiry) => handleChange(expiryToString(expiry))}\n        onBlur={handleBlur}\n        onFocus={handleFocus}\n        delimiter=\"/\"\n        inputs={[\n          {\n            id: 'month',\n            label: sharedContext?.translation.DatePicker['month'],\n            mask: [\n              /[0-1]/,\n              expiry.month.charAt(0) === '0' ||\n              expiry.month.charAt(0) === ''\n                ? /[1-9]/\n                : /[0-2]/,\n            ],\n            placeholderCharacter: placeholders['month'],\n            autoComplete: 'cc-exp-month',\n          },\n          {\n            id: 'year',\n            label: sharedContext?.translation.DatePicker['year'],\n            mask: [/[0-9]/, /[0-9]/],\n            placeholderCharacter: placeholders['year'],\n            autoComplete: 'cc-exp-year',\n          },\n        ]}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n\n  function expiryToString(values: ExpiryValue) {\n    return Object.values(values).join('')\n  }\n}\n\nExpiry._supportsEufemiaSpacingProps = true\nexport default Expiry\n"],"mappings":"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"}

package/es/extensions/forms/Field/Expiry/style/dnb-expiry.css

@@ -1,12 +1,6 @@
-:root {
-  --forms-field-width--small: 5rem;
-  --forms-field-width--medium: 11rem;
-  --forms-field-width--large: 21rem;
-}
-
-.dnb-forms-field-expiry {
+.dnb-forms-field-expiry .dnb-multi-input-mask {
   width: var(--forms-field-width--small);
 }
-.dnb-forms-field-expiry .dnb-input__shell {
+.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell {
   justify-content: center;
 }

package/es/extensions/forms/Field/Expiry/style/dnb-expiry.min.css

@@ -1 +1 @@
-:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}.dnb-forms-field-expiry{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-input__shell{justify-content:center}
+.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}

package/es/extensions/forms/Field/Expiry/style/dnb-expiry.scss

@@ -1,9 +1,9 @@
-@import '../../style/field-sizes.scss';
-
 .dnb-forms-field-expiry {
-  width: var(--forms-field-width--small);
+  .dnb-multi-input-mask {
+    width: var(--forms-field-width--small);
 
-  .dnb-input__shell {
-    justify-content: center;
+    .dnb-input__shell {
+      justify-content: center;
+    }
   }
 }

package/es/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js

@@ -10,17 +10,18 @@ function NationalIdentityNumber(props) {
   var _props$pattern, _props$label, _props$width;
   const sharedContext = useContext(SharedContext);
   const tr = sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms;
+  const errorMessage = tr.nationalIdentityNumberErrorRequired;
   const {
     validate = true,
     omitMask
   } = props;
   const errorMessages = useMemo(() => _objectSpread({
-    required: tr.nationalIdentityNumberErrorRequired,
-    pattern: tr.nationalIdentityNumberErrorPattern
-  }, props.errorMessages), [tr, props.errorMessages]);
-  const mask = useMemo(() => omitMask ? [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/, /\d/] : [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/, /\d/, /\d/], [omitMask]);
+    required: errorMessage,
+    pattern: errorMessage
+  }, props.errorMessages), [errorMessage, props.errorMessages]);
+  const mask = useMemo(() => omitMask ? Array(11).fill(/\d/) : [/\d/, /\d/, /\d/, /\d/, /\d/, /\d/, ' ', /\d/, /\d/, /\d/, /\d/, /\d/], [omitMask]);
   const stringComponentProps = _objectSpread(_objectSpread({}, props), {}, {
-    pattern: (_props$pattern = props.pattern) !== null && _props$pattern !== void 0 ? _props$pattern : validate ? '^[0-9]{11}$' : undefined,
+    pattern: (_props$pattern = props.pattern) !== null && _props$pattern !== void 0 ? _props$pattern : validate && !props.validator ? '^[0-9]{11}$' : undefined,
     label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : sharedContext === null || sharedContext === void 0 ? void 0 : sharedContext.translation.Forms.nationalIdentityNumberLabel,
     errorMessages,
     mask,

package/es/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.js.map

@@ -1 +1 @@
-{"version":3,"file":"NationalIdentityNumber.js","names":["React","useContext","useMemo","StringComponent","SharedContext","NationalIdentityNumber","props","_props$pattern","_props$label","_props$width","sharedContext","tr","translation","Forms","validate","omitMask","errorMessages","_objectSpread","required","nationalIdentityNumberErrorRequired","pattern","nationalIdentityNumberErrorPattern","mask","stringComponentProps","undefined","label","nationalIdentityNumberLabel","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  omitMask?: boolean\n  validate?: boolean\n}\n\nfunction NationalIdentityNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const tr = sharedContext?.translation.Forms\n\n  const { validate = true, omitMask } = props\n\n  const errorMessages = useMemo(\n    () => ({\n      required: tr.nationalIdentityNumberErrorRequired,\n      pattern: tr.nationalIdentityNumberErrorPattern,\n      ...props.errorMessages,\n    }),\n    [tr, props.errorMessages]\n  )\n  const mask = useMemo(\n    () =>\n      omitMask\n        ? [\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n          ]\n        : [\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            ' ',\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n          ],\n    [omitMask]\n  )\n\n  const stringComponentProps: Props = {\n    ...props,\n    pattern: props.pattern ?? (validate ? '^[0-9]{11}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.nationalIdentityNumberLabel,\n    errorMessages,\n    mask,\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nNationalIdentityNumber._supportsSpacingProps = true\nexport default NationalIdentityNumber\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,sBAAsBA,CAACC,KAAY,EAAE;EAAA,IAAAC,cAAA,EAAAC,YAAA,EAAAC,YAAA;EAC5C,MAAMC,aAAa,GAAGT,UAAU,CAACG,aAAa,CAAC;EAC/C,MAAMO,EAAE,GAAGD,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEE,WAAW,CAACC,KAAK;EAE3C,MAAM;IAAEC,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGT,KAAK;EAE3C,MAAMU,aAAa,GAAGd,OAAO,CAC3B,MAAAe,aAAA;IACEC,QAAQ,EAAEP,EAAE,CAACQ,mCAAmC;IAChDC,OAAO,EAAET,EAAE,CAACU;EAAkC,GAC3Cf,KAAK,CAACU,aAAa,CACtB,EACF,CAACL,EAAE,EAAEL,KAAK,CAACU,aAAa,CAC1B,CAAC;EACD,MAAMM,IAAI,GAAGpB,OAAO,CAClB,MACEa,QAAQ,GACJ,CACE,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,CACL,GACD,CACE,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,CACL,EACP,CAACA,QAAQ,CACX,CAAC;EAED,MAAMQ,oBAA2B,GAAAN,aAAA,CAAAA,aAAA,KAC5BX,KAAK;IACRc,OAAO,GAAAb,cAAA,GAAED,KAAK,CAACc,OAAO,cAAAb,cAAA,cAAAA,cAAA,GAAKO,QAAQ,GAAG,aAAa,GAAGU,SAAU;IAChEC,KAAK,GAAAjB,YAAA,GACHF,KAAK,CAACmB,KAAK,cAAAjB,YAAA,cAAAA,YAAA,GACXE,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEE,WAAW,CAACC,KAAK,CAACa,2BAA2B;IAC9DV,aAAa;IACbM,IAAI;IACJK,KAAK,GAAAlB,YAAA,GAAEH,KAAK,CAACqB,KAAK,cAAAlB,YAAA,cAAAA,YAAA,GAAI;EAAQ,EAC/B;EAED,OAAOT,KAAA,CAAA4B,aAAA,CAACzB,eAAe,EAAKoB,oBAAuB,CAAC;AACtD;AAEAlB,sBAAsB,CAACwB,qBAAqB,GAAG,IAAI;AACnD,eAAexB,sBAAsB"}
+{"version":3,"file":"NationalIdentityNumber.js","names":["React","useContext","useMemo","StringComponent","SharedContext","NationalIdentityNumber","props","_props$pattern","_props$label","_props$width","sharedContext","tr","translation","Forms","errorMessage","nationalIdentityNumberErrorRequired","validate","omitMask","errorMessages","_objectSpread","required","pattern","mask","Array","fill","stringComponentProps","validator","undefined","label","nationalIdentityNumberLabel","width","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/NationalIdentityNumber/NationalIdentityNumber.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport StringComponent, { Props as StringComponentProps } from '../String'\nimport SharedContext from '../../../../shared/Context'\n\nexport type Props = StringComponentProps & {\n  omitMask?: boolean\n  validate?: boolean\n}\n\nfunction NationalIdentityNumber(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const tr = sharedContext?.translation.Forms\n  const errorMessage = tr.nationalIdentityNumberErrorRequired\n\n  const { validate = true, omitMask } = props\n\n  const errorMessages = useMemo(\n    () => ({\n      required: errorMessage,\n      pattern: errorMessage,\n      ...props.errorMessages,\n    }),\n    [errorMessage, props.errorMessages]\n  )\n  const mask = useMemo(\n    () =>\n      omitMask\n        ? Array(11).fill(/\\d/)\n        : [\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            ' ',\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n            /\\d/,\n          ],\n    [omitMask]\n  )\n\n  const stringComponentProps: Props = {\n    ...props,\n    pattern:\n      props.pattern ??\n      (validate && !props.validator ? '^[0-9]{11}$' : undefined),\n    label:\n      props.label ??\n      sharedContext?.translation.Forms.nationalIdentityNumberLabel,\n    errorMessages,\n    mask,\n    width: props.width ?? 'medium',\n  }\n\n  return <StringComponent {...stringComponentProps} />\n}\n\nNationalIdentityNumber._supportsSpacingProps = true\nexport default NationalIdentityNumber\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,OAAOC,eAAe,MAAyC,WAAW;AAC1E,OAAOC,aAAa,MAAM,4BAA4B;AAOtD,SAASC,sBAAsBA,CAACC,KAAY,EAAE;EAAA,IAAAC,cAAA,EAAAC,YAAA,EAAAC,YAAA;EAC5C,MAAMC,aAAa,GAAGT,UAAU,CAACG,aAAa,CAAC;EAC/C,MAAMO,EAAE,GAAGD,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEE,WAAW,CAACC,KAAK;EAC3C,MAAMC,YAAY,GAAGH,EAAE,CAACI,mCAAmC;EAE3D,MAAM;IAAEC,QAAQ,GAAG,IAAI;IAAEC;EAAS,CAAC,GAAGX,KAAK;EAE3C,MAAMY,aAAa,GAAGhB,OAAO,CAC3B,MAAAiB,aAAA;IACEC,QAAQ,EAAEN,YAAY;IACtBO,OAAO,EAAEP;EAAY,GAClBR,KAAK,CAACY,aAAa,CACtB,EACF,CAACJ,YAAY,EAAER,KAAK,CAACY,aAAa,CACpC,CAAC;EACD,MAAMI,IAAI,GAAGpB,OAAO,CAClB,MACEe,QAAQ,GACJM,KAAK,CAAC,EAAE,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,GACpB,CACE,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,GAAG,EACH,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,CACL,EACP,CAACP,QAAQ,CACX,CAAC;EAED,MAAMQ,oBAA2B,GAAAN,aAAA,CAAAA,aAAA,KAC5Bb,KAAK;IACRe,OAAO,GAAAd,cAAA,GACLD,KAAK,CAACe,OAAO,cAAAd,cAAA,cAAAA,cAAA,GACZS,QAAQ,IAAI,CAACV,KAAK,CAACoB,SAAS,GAAG,aAAa,GAAGC,SAAU;IAC5DC,KAAK,GAAApB,YAAA,GACHF,KAAK,CAACsB,KAAK,cAAApB,YAAA,cAAAA,YAAA,GACXE,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEE,WAAW,CAACC,KAAK,CAACgB,2BAA2B;IAC9DX,aAAa;IACbI,IAAI;IACJQ,KAAK,GAAArB,YAAA,GAAEH,KAAK,CAACwB,KAAK,cAAArB,YAAA,cAAAA,YAAA,GAAI;EAAQ,EAC/B;EAED,OAAOT,KAAA,CAAA+B,aAAA,CAAC5B,eAAe,EAAKsB,oBAAuB,CAAC;AACtD;AAEApB,sBAAsB,CAAC2B,qBAAqB,GAAG,IAAI;AACnD,eAAe3B,sBAAsB"}

package/es/extensions/forms/Field/Number/Number.js

@@ -26,17 +26,14 @@ function NumberComponent(props) {
     suffix,
     rightAligned
   } = props;
-  const errorMessages = useMemo(() => {
-    var _props$minimum, _props$maximum, _props$exclusiveMinim, _props$exclusiveMaxim, _props$multipleOf;
-    return _objectSpread({
-      required: tr.inputErrorRequired,
-      minimum: tr.numberFieldErrorMinimum.replace('{minimum}', (_props$minimum = props.minimum) === null || _props$minimum === void 0 ? void 0 : _props$minimum.toString()),
-      maximum: tr.numberFieldErrorMaximum.replace('{maximum}', (_props$maximum = props.maximum) === null || _props$maximum === void 0 ? void 0 : _props$maximum.toString()),
-      exclusiveMinimum: tr.numberFieldErrorExclusiveMinimum.replace('{exclusiveMinimum}', (_props$exclusiveMinim = props.exclusiveMinimum) === null || _props$exclusiveMinim === void 0 ? void 0 : _props$exclusiveMinim.toString()),
-      exclusiveMaximum: tr.numberFieldErrorExclusiveMaximum.replace('{exclusiveMaximum}', (_props$exclusiveMaxim = props.exclusiveMaximum) === null || _props$exclusiveMaxim === void 0 ? void 0 : _props$exclusiveMaxim.toString()),
-      multipleOf: tr.numberFieldErrorMultipleOf.replace('{multipleOf}', (_props$multipleOf = props.multipleOf) === null || _props$multipleOf === void 0 ? void 0 : _props$multipleOf.toString())
-    }, props.errorMessages);
-  }, [tr, props.errorMessages, props.minimum, props.maximum, props.exclusiveMinimum, props.exclusiveMaximum, props.multipleOf]);
+  const errorMessages = useMemo(() => _objectSpread({
+    required: tr.inputErrorRequired,
+    minimum: tr.numberFieldErrorMinimum,
+    maximum: tr.numberFieldErrorMaximum,
+    exclusiveMinimum: tr.numberFieldErrorExclusiveMinimum,
+    exclusiveMaximum: tr.numberFieldErrorExclusiveMaximum,
+    multipleOf: tr.numberFieldErrorMultipleOf
+  }, props.errorMessages), [tr, props.errorMessages]);
   const schema = useMemo(() => {
     var _props$schema;
     return (_props$schema = props.schema) !== null && _props$schema !== void 0 ? _props$schema : {
@@ -127,6 +124,8 @@ function NumberComponent(props) {
     info: info,
     warning: warning,
     error: error,
+    disabled: disabled,
+    width: width === 'stretch' ? width : undefined,
     contentsWidth: width !== false ? width : undefined
   }, pickSpacingProps(props)), React.createElement(InputMasked, _extends({
     id: id,
@@ -136,7 +135,7 @@ function NumberComponent(props) {
     placeholder: placeholder,
     value: value
   }, maskProps, {
-    right: rightAligned,
+    align: rightAligned && 'right',
     on_focus: handleFocus,
     on_blur: handleBlur,
     on_change: handleChange,

package/es/extensions/forms/Field/Number/Number.js.map

@@ -1 +1 @@
-{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","InputMasked","HelpButton","SharedContext","classnames","FieldBlock","useDataValue","pickSpacingProps","NumberComponent","props","_props$width","sharedContext","tr","translation","Forms","currency","percent","mask","thousandSeparator","decimalSymbol","decimalLimit","prefix","suffix","rightAligned","errorMessages","_props$minimum","_props$maximum","_props$exclusiveMinim","_props$exclusiveMaxim","_props$multipleOf","_objectSpread","required","inputErrorRequired","minimum","numberFieldErrorMinimum","replace","toString","maximum","numberFieldErrorMaximum","exclusiveMinimum","numberFieldErrorExclusiveMinimum","exclusiveMaximum","numberFieldErrorExclusiveMaximum","multipleOf","numberFieldErrorMultipleOf","schema","_props$schema","type","toInput","external","undefined","fromInput","value","numberValue","emptyValue","maskProps","as_currency","as_percent","as_number","number_mask","includeThousandsSeparator","thousandsSeparatorSymbol","preparedProps","width","id","name","className","autoComplete","inputClassName","layout","placeholder","label","labelDescription","labelSecondary","disabled","info","warning","error","help","handleFocus","handleBlur","handleChange","createElement","_extends","forId","contentsWidth","right","on_focus","on_blur","on_change","status","stretch","title","contents","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport { JSONSchema7 } from 'json-schema'\nimport { InputMasked, HelpButton } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport SharedContext from '../../../../shared/Context'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\n\ninterface ErrorMessages {\n  required?: string\n  schema?: string\n  minimum?: string\n  maximum?: string\n  exclusiveMinimum?: string\n  exclusiveMaximum?: string\n  multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined, ErrorMessages> & {\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    // Formatting\n    thousandSeparator?: string | true\n    decimalSymbol?: string\n    decimalLimit?: number\n    prefix?: string\n    suffix?: string\n    // Validation\n    minimum?: number // aka greater than or equal to\n    maximum?: number // aka less than or equal to\n    exclusiveMinimum?: number // aka greater than\n    exclusiveMaximum?: number // aka less than\n    multipleOf?: number\n    // Styling\n    width?: false | 'small' | 'medium' | 'large' | 'stretch'\n    rightAligned?: boolean\n  }\n\nfunction NumberComponent(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const tr = sharedContext?.translation.Forms\n\n  const {\n    currency,\n    percent,\n    mask,\n    thousandSeparator,\n    decimalSymbol,\n    decimalLimit = 12,\n    prefix,\n    suffix,\n    rightAligned,\n  } = props\n\n  const errorMessages = useMemo(\n    () => ({\n      required: tr.inputErrorRequired,\n      minimum: tr.numberFieldErrorMinimum.replace(\n        '{minimum}',\n        props.minimum?.toString()\n      ),\n      maximum: tr.numberFieldErrorMaximum.replace(\n        '{maximum}',\n        props.maximum?.toString()\n      ),\n      exclusiveMinimum: tr.numberFieldErrorExclusiveMinimum.replace(\n        '{exclusiveMinimum}',\n        props.exclusiveMinimum?.toString()\n      ),\n      exclusiveMaximum: tr.numberFieldErrorExclusiveMaximum.replace(\n        '{exclusiveMaximum}',\n        props.exclusiveMaximum?.toString()\n      ),\n      multipleOf: tr.numberFieldErrorMultipleOf.replace(\n        '{multipleOf}',\n        props.multipleOf?.toString()\n      ),\n      ...props.errorMessages,\n    }),\n    [\n      tr,\n      props.errorMessages,\n      props.minimum,\n      props.maximum,\n      props.exclusiveMinimum,\n      props.exclusiveMaximum,\n      props.multipleOf,\n    ]\n  )\n  const schema = useMemo<JSONSchema7>(\n    () =>\n      props.schema ?? {\n        type: 'number',\n        minimum: props.minimum,\n        maximum: props.maximum,\n        exclusiveMinimum: props.exclusiveMinimum,\n        exclusiveMaximum: props.exclusiveMaximum,\n        multipleOf: props.multipleOf,\n      },\n    [\n      props.schema,\n      props.minimum,\n      props.maximum,\n      props.exclusiveMinimum,\n      props.exclusiveMaximum,\n      props.multipleOf,\n    ]\n  )\n\n  const toInput = useCallback((external: number | undefined) => {\n    if (external === undefined) {\n      return ''\n    }\n    return external\n  }, [])\n  const fromInput = useCallback(\n    ({ value, numberValue }: { value: string; numberValue: number }) => {\n      if (value === '') {\n        return emptyValue\n      }\n      return numberValue\n    },\n    []\n  )\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    if (currency) {\n      return {\n        as_currency: currency,\n      }\n    }\n    if (percent) {\n      return {\n        as_percent: percent,\n      }\n    }\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        decimalLimit,\n        decimalSymbol,\n        includeThousandsSeparator: thousandSeparator !== undefined,\n        thousandsSeparatorSymbol:\n          thousandSeparator === true ? ' ' : thousandSeparator,\n        prefix,\n        suffix,\n      },\n    }\n  }, [\n    currency,\n    percent,\n    mask,\n    decimalLimit,\n    decimalSymbol,\n    thousandSeparator,\n    prefix,\n    suffix,\n  ])\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages,\n    schema,\n    toInput,\n    fromInput,\n    width: props.width ?? 'medium',\n  }\n\n  const {\n    id,\n    name,\n    className,\n    autoComplete,\n    inputClassName,\n    layout,\n    placeholder,\n    label,\n    labelDescription,\n    labelSecondary,\n    value,\n    disabled,\n    info,\n    warning,\n    error,\n    help,\n    emptyValue,\n    width,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-number', className)}\n      forId={id}\n      layout={layout}\n      label={label}\n      labelDescription={labelDescription}\n      labelSecondary={labelSecondary}\n      info={info}\n      warning={warning}\n      error={error}\n      contentsWidth={width !== false ? width : undefined}\n      {...pickSpacingProps(props)}\n    >\n      <InputMasked\n        id={id}\n        name={name}\n        autoComplete={autoComplete}\n        className={classnames(\n          'dnb-forms-field-number__input',\n          inputClassName\n        )}\n        placeholder={placeholder}\n        value={value}\n        {...maskProps}\n        right={rightAligned}\n        on_focus={handleFocus}\n        on_blur={handleBlur}\n        on_change={handleChange}\n        disabled={disabled}\n        status={error ? 'error' : undefined}\n        stretch={width !== undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}
+{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","InputMasked","HelpButton","SharedContext","classnames","FieldBlock","useDataValue","pickSpacingProps","NumberComponent","props","_props$width","sharedContext","tr","translation","Forms","currency","percent","mask","thousandSeparator","decimalSymbol","decimalLimit","prefix","suffix","rightAligned","errorMessages","_objectSpread","required","inputErrorRequired","minimum","numberFieldErrorMinimum","maximum","numberFieldErrorMaximum","exclusiveMinimum","numberFieldErrorExclusiveMinimum","exclusiveMaximum","numberFieldErrorExclusiveMaximum","multipleOf","numberFieldErrorMultipleOf","schema","_props$schema","type","toInput","external","undefined","fromInput","value","numberValue","emptyValue","maskProps","as_currency","as_percent","as_number","number_mask","includeThousandsSeparator","thousandsSeparatorSymbol","preparedProps","width","id","name","className","autoComplete","inputClassName","layout","placeholder","label","labelDescription","labelSecondary","disabled","info","warning","error","help","handleFocus","handleBlur","handleChange","createElement","_extends","forId","contentsWidth","align","on_focus","on_blur","on_change","status","stretch","title","contents","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport { JSONSchema7 } from 'json-schema'\nimport { InputMasked, HelpButton } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport SharedContext from '../../../../shared/Context'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useDataValue } from '../../hooks'\nimport { FieldProps, FieldHelpProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\n\ninterface ErrorMessages {\n  required?: string\n  schema?: string\n  minimum?: string\n  maximum?: string\n  exclusiveMinimum?: string\n  exclusiveMaximum?: string\n  multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n  FieldProps<number, undefined, ErrorMessages> & {\n    inputClassName?: string\n    currency?: InputMaskedProps['as_currency']\n    percent?: InputMaskedProps['as_percent']\n    mask?: InputMaskedProps['mask']\n    // Formatting\n    thousandSeparator?: string | true\n    decimalSymbol?: string\n    decimalLimit?: number\n    prefix?: string\n    suffix?: string\n    // Validation\n    minimum?: number // aka greater than or equal to\n    maximum?: number // aka less than or equal to\n    exclusiveMinimum?: number // aka greater than\n    exclusiveMaximum?: number // aka less than\n    multipleOf?: number\n    // Styling\n    width?: false | 'small' | 'medium' | 'large' | 'stretch'\n    rightAligned?: boolean\n  }\n\nfunction NumberComponent(props: Props) {\n  const sharedContext = useContext(SharedContext)\n  const tr = sharedContext?.translation.Forms\n\n  const {\n    currency,\n    percent,\n    mask,\n    thousandSeparator,\n    decimalSymbol,\n    decimalLimit = 12,\n    prefix,\n    suffix,\n    rightAligned,\n  } = props\n\n  const errorMessages = useMemo(\n    () => ({\n      required: tr.inputErrorRequired,\n      minimum: tr.numberFieldErrorMinimum,\n      maximum: tr.numberFieldErrorMaximum,\n      exclusiveMinimum: tr.numberFieldErrorExclusiveMinimum,\n      exclusiveMaximum: tr.numberFieldErrorExclusiveMaximum,\n      multipleOf: tr.numberFieldErrorMultipleOf,\n      ...props.errorMessages,\n    }),\n    [tr, props.errorMessages]\n  )\n  const schema = useMemo<JSONSchema7>(\n    () =>\n      props.schema ?? {\n        type: 'number',\n        minimum: props.minimum,\n        maximum: props.maximum,\n        exclusiveMinimum: props.exclusiveMinimum,\n        exclusiveMaximum: props.exclusiveMaximum,\n        multipleOf: props.multipleOf,\n      },\n    [\n      props.schema,\n      props.minimum,\n      props.maximum,\n      props.exclusiveMinimum,\n      props.exclusiveMaximum,\n      props.multipleOf,\n    ]\n  )\n\n  const toInput = useCallback((external: number | undefined) => {\n    if (external === undefined) {\n      return ''\n    }\n    return external\n  }, [])\n  const fromInput = useCallback(\n    ({ value, numberValue }: { value: string; numberValue: number }) => {\n      if (value === '') {\n        return emptyValue\n      }\n      return numberValue\n    },\n    []\n  )\n\n  const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n    if (currency) {\n      return {\n        as_currency: currency,\n      }\n    }\n    if (percent) {\n      return {\n        as_percent: percent,\n      }\n    }\n    // Custom mask based on props\n    return {\n      as_number: true,\n      mask,\n      number_mask: {\n        decimalLimit,\n        decimalSymbol,\n        includeThousandsSeparator: thousandSeparator !== undefined,\n        thousandsSeparatorSymbol:\n          thousandSeparator === true ? ' ' : thousandSeparator,\n        prefix,\n        suffix,\n      },\n    }\n  }, [\n    currency,\n    percent,\n    mask,\n    decimalLimit,\n    decimalSymbol,\n    thousandSeparator,\n    prefix,\n    suffix,\n  ])\n\n  const preparedProps: Props = {\n    ...props,\n    errorMessages,\n    schema,\n    toInput,\n    fromInput,\n    width: props.width ?? 'medium',\n  }\n\n  const {\n    id,\n    name,\n    className,\n    autoComplete,\n    inputClassName,\n    layout,\n    placeholder,\n    label,\n    labelDescription,\n    labelSecondary,\n    value,\n    disabled,\n    info,\n    warning,\n    error,\n    help,\n    emptyValue,\n    width,\n    handleFocus,\n    handleBlur,\n    handleChange,\n  } = useDataValue(preparedProps)\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-number', className)}\n      forId={id}\n      layout={layout}\n      label={label}\n      labelDescription={labelDescription}\n      labelSecondary={labelSecondary}\n      info={info}\n      warning={warning}\n      error={error}\n      disabled={disabled}\n      width={width === 'stretch' ? width : undefined}\n      contentsWidth={width !== false ? width : undefined}\n      {...pickSpacingProps(props)}\n    >\n      <InputMasked\n        id={id}\n        name={name}\n        autoComplete={autoComplete}\n        className={classnames(\n          'dnb-forms-field-number__input',\n          inputClassName\n        )}\n        placeholder={placeholder}\n        value={value}\n        {...maskProps}\n        align={rightAligned && 'right'}\n        on_focus={handleFocus}\n        on_blur={handleBlur}\n        on_change={handleChange}\n        disabled={disabled}\n        status={error ? 'error' : undefined}\n        stretch={width !== undefined}\n        suffix={\n          help ? (\n            <HelpButton title={help.title}>{help.contents}</HelpButton>\n          ) : undefined\n        }\n      />\n    </FieldBlock>\n  )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}