@dnb/eufemia 10.20.0 → 10.22.0

package/components/input-masked/InputMaskedDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputMaskedDocs.js","names":["inputMaskedProperties","as_number","doc","type","status","as_percent","as_currency","mask_options","number_mask","currency_mask","number_format","locale","mask","show_mask","show_guide","placeholder_char","keep_char_positions"],"sources":["../../../../src/components/input-masked/InputMaskedDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const inputMaskedProperties: PropertiesTableProps = {\n  as_number: {\n    doc: 'Set to `true` to automatically set a number mask based on the given or inherited locale.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  as_percent: {\n    doc: 'Set to `true` to automatically set a number mask with a percentage sign based on the given or inherited locale.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  as_currency: {\n    doc: 'Set to `true` to use `NOK` or give it a currency code e.g. `USD` to automatically set a currency mask based on the given or inherited locale.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  mask_options: {\n    doc: 'Use it to manipulate internal masks. You can use it instead of e.g. `number_mask` or `currency_mask`. All options are listed below.',\n    type: 'object',\n    status: 'optional',\n  },\n  number_mask: {\n    doc: 'Set to `true` to enable the default numbers formatting – or give an `object` containing the number mask properties. More details below. Can be a JSON string as well, containing the number mask properties. Is disabled by default.',\n    type: ['boolean', 'object'],\n    status: 'optional',\n  },\n  currency_mask: {\n    doc: 'Set to `true` or set the _valuta_ (currency_mask=\"kr\") to enable a custom currency mask – or give an `object` containing the number mask properties. More details below. Can be a JSON string as well, containing the number mask properties. Is disabled by default. Defaults to `kr`.',\n    type: ['boolean', 'object'],\n    status: 'optional',\n  },\n  number_format: {\n    doc: 'Use an object with [NumberFormat](/uilib/components/number-format/properties) e.g. `{ omit_rounding: false }`.',\n    type: 'object',\n    status: 'optional',\n  },\n  locale: {\n    doc: 'Define the locale to be used in the `as_number` or `as_currency` masked. It will be inherited from the [Eufemia Provider](/uilib/usage/customisation/provider) if not given. Defaults to `nb-NO`.',\n    type: 'string',\n    status: 'optional',\n  },\n  mask: {\n    doc: 'A mask can be defined both as a [RegExp style of characters](https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#readme) or a callback function. Example below.',\n    type: ['RegExp', 'function'],\n    status: 'optional',\n  },\n  show_mask: {\n    doc: 'Show mask when input is empty and has no focus. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  show_guide: {\n    doc: \"When `false` is given, it doesn't print out placeholder characters and only adds mask characters when the user reaches them as they're typing. Defaults to `true`.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  placeholder_char: {\n    doc: 'The placeholder character represents the fillable spot in the mask (e.g. `_`). Defaults to invisible space.',\n    type: 'string',\n    status: 'optional',\n  },\n  keep_char_positions: {\n    doc: 'When `true`, adding or deleting characters will not affect the positions of existing characters. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n  '[Input](/uilib/components/input/properties)': {\n    doc: 'All `Input` properties are supported.',\n    type: 'Various',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,qBAA2C,GAAG;EACzDC,SAAS,EAAE;IACTC,GAAG,EAAE,0FAA0F;IAC/FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,UAAU,EAAE;IACVH,GAAG,EAAE,iHAAiH;IACtHC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,WAAW,EAAE;IACXJ,GAAG,EAAE,+IAA+I;IACpJC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDG,YAAY,EAAE;IACZL,GAAG,EAAE,qIAAqI;IAC1IC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,WAAW,EAAE;IACXN,GAAG,EAAE,sOAAsO;IAC3OC,IAAI,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;IAC3BC,MAAM,EAAE;EACV,CAAC;EACDK,aAAa,EAAE;IACbP,GAAG,EAAE,yRAAyR;IAC9RC,IAAI,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;IAC3BC,MAAM,EAAE;EACV,CAAC;EACDM,aAAa,EAAE;IACbR,GAAG,EAAE,gHAAgH;IACrHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,MAAM,EAAE;IACNT,GAAG,EAAE,mMAAmM;IACxMC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,IAAI,EAAE;IACJV,GAAG,EAAE,0LAA0L;IAC/LC,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;IAC5BC,MAAM,EAAE;EACV,CAAC;EACDS,SAAS,EAAE;IACTX,GAAG,EAAE,sEAAsE;IAC3EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,UAAU,EAAE;IACVZ,GAAG,EAAE,oKAAoK;IACzKC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,gBAAgB,EAAE;IAChBb,GAAG,EAAE,6GAA6G;IAClHC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDY,mBAAmB,EAAE;IACnBd,GAAG,EAAE,uHAAuH;IAC5HC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV,CAAC;EACD,6CAA6C,EAAE;IAC7CF,GAAG,EAAE,uCAAuC;IAC5CC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV;AACF,CAAC"}

package/components/input-masked/InputMaskedHooks.js

@@ -14,6 +14,7 @@ import createNumberMask from './addons/createNumberMask';
 import keycode from 'keycode';
 import InputMaskedContext from './InputMaskedContext';
 import { isRequestingLocaleSupport, isRequestingNumberMask, correctNumberValue, handlePercentMask, handleCurrencyMask, handleNumberMask, correctCaretPosition, getSoftKeyboardAttributes, handleThousandsSeparator, handleDecimalSeparator, fromJSON, invisibleSpace } from './InputMaskedUtils';
+const useLayoutEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
 export const useFilteredProps = () => {
   const {
     props
@@ -147,11 +148,11 @@ export const useInputElement = () => {
   const isFn = typeof inner_ref === 'function';
   const refHook = React.useRef();
   const ref = !isFn && inner_ref || refHook;
-  React.useLayoutEffect(() => {
+  useLayoutEffect(() => {
     if (isFn) {
       inner_ref === null || inner_ref === void 0 ? void 0 : inner_ref(ref.current);
     }
-  }, [ref.current]);
+  }, [inner_ref, isFn, ref]);
   const inputElementRef = React.useRef(React.createElement("input", {
     ref: ref
   }));
@@ -314,7 +315,8 @@ const useNumberMaskParams = () => {
   const {
     as_number,
     as_percent,
-    as_currency
+    as_currency,
+    value
   } = props;
   mask_options = fromJSON(mask_options);
   number_mask = isTrue(number_mask) ? {} : fromJSON(number_mask);
@@ -333,10 +335,11 @@ const useNumberMaskParams = () => {
         thousandsSeparatorSymbol
       });
     } else if (as_currency) {
+      var _currency_mask2;
       currency_mask = extendPropsWithContext(currency_mask, null, {
         decimalSymbol,
         thousandsSeparatorSymbol,
-        currency: getCurrencySymbol(locale, typeof as_currency === 'string' ? as_currency : null)
+        currency: getCurrencySymbol(locale, typeof as_currency === 'string' ? as_currency : null, (_currency_mask2 = currency_mask) === null || _currency_mask2 === void 0 ? void 0 : _currency_mask2.currencyDisplay, value)
       });
     }
   }

package/components/input-masked/InputMaskedHooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputMaskedHooks.js","names":["React","classnames","cleanNumber","getCurrencySymbol","isTrue","dispatchCustomElementEvent","extendPropsWithContext","safeSetSelection","TextMask","createNumberMask","keycode","InputMaskedContext","isRequestingLocaleSupport","isRequestingNumberMask","correctNumberValue","handlePercentMask","handleCurrencyMask","handleNumberMask","correctCaretPosition","getSoftKeyboardAttributes","handleThousandsSeparator","handleDecimalSeparator","fromJSON","invisibleSpace","useFilteredProps","props","useContext","mask","number_mask","currency_mask","number_format","mask_options","as_currency","as_number","as_percent","locale","show_mask","show_guide","pipe","keep_char_positions","placeholder_char","attributes","_objectWithoutProperties","_excluded","htmlAttributes","Object","freeze","useLocale","context","useLocalValue","maskParams","useNumberMaskParams","localValue","setLocalValue","useState","useEffect","value","useNumberMask","useMask","numberMask","useMaskParams","placeholder","showMask","placeholderChar","showGuide","keepCharPositions","useInputElement","inner_ref","isFn","refHook","useRef","ref","useLayoutEffect","current","inputElementRef","createElement","InputElement","params","innerRef","_extends","inputRef","inputElement","guide","className","useEventMapping","_ref","callEvent","useCallEvent","onBeforeInput","event","onFocus","onBlur","onMouseUp","onMouseDown","onKeyDown","onSubmit","onChange","on_focus","undefined","on_blur","on_key_down","on_submit","on_change","_ref2","isNumberMask","decimalSeparators","isUnidentified","_ref3","name","target","selStart","selectionStart","keyCode","which","data","disallowLeadingZeroes","replace","test","testValue","slice","length","preventDefault","decimalSymbol","hasDecimalSymbol","includes","allowedDecimals","decimalLimit","allowDecimal","charAtSelection","index","indexOf","thousandsSeparatorSymbol","num","prefix","suffix","decimalSeparator","thousandsSeparator","numberValue","Number","cleanedValue","String","charAt","runCorrectCaretPosition","__getCorrectCaretPosition","result","_currency_mask","_objectSpread","currency"],"sources":["../../../../src/components/input-masked/InputMaskedHooks.js"],"sourcesContent":["/**\n * Web InputMasked Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport {\n  cleanNumber,\n  getCurrencySymbol,\n} from '../number-format/NumberUtils'\nimport {\n  isTrue,\n  dispatchCustomElementEvent,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { safeSetSelection } from './text-mask/createTextMaskInputElement'\n\nimport TextMask from './TextMask'\nimport createNumberMask from './addons/createNumberMask'\nimport keycode from 'keycode'\nimport InputMaskedContext from './InputMaskedContext'\n\nimport {\n  isRequestingLocaleSupport,\n  isRequestingNumberMask,\n  correctNumberValue,\n  handlePercentMask,\n  handleCurrencyMask,\n  handleNumberMask,\n  correctCaretPosition,\n  getSoftKeyboardAttributes,\n  handleThousandsSeparator,\n  handleDecimalSeparator,\n  fromJSON,\n  invisibleSpace,\n} from './InputMaskedUtils'\n\n/**\n * Takes all component properties and filters out all internal used properties\n *\n * @returns object {props, htmlAttributes}\n */\nexport const useFilteredProps = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const {\n    mask, // eslint-disable-line\n    number_mask, // eslint-disable-line\n    currency_mask, // eslint-disable-line\n    number_format, // eslint-disable-line\n    mask_options, // eslint-disable-line\n    as_currency, // eslint-disable-line\n    as_number, // eslint-disable-line\n    as_percent, // eslint-disable-line\n    locale, // eslint-disable-line\n    show_mask, // eslint-disable-line\n    show_guide, // eslint-disable-line\n    pipe, // eslint-disable-line\n    keep_char_positions, // eslint-disable-line\n    placeholder_char, // eslint-disable-line\n\n    // Get get rest of possible attributes\n    ...attributes\n  } = props\n\n  return { props, htmlAttributes: Object.freeze(attributes) }\n}\n\n/**\n * Returns locale from either component or context\n *\n * @returns string\n */\nexport const useLocale = () => {\n  const { props, context } = React.useContext(InputMaskedContext)\n\n  let { locale } = props\n  if (!locale && context?.locale) {\n    locale = context.locale\n  }\n\n  return locale\n}\n\n/**\n * Handle internal value state\n *\n * It handles both the value state given as a prop form outside,\n * along with the current written and internal value.\n *\n * @returns object with internal value state and state setter\n */\nexport const useLocalValue = () => {\n  const { props, context } = React.useContext(InputMaskedContext)\n  const maskParams = useNumberMaskParams() || {}\n  const locale = useLocale()\n\n  const [localValue, setLocalValue] = React.useState(() =>\n    correctNumberValue({\n      locale,\n      props,\n      maskParams,\n    })\n  )\n\n  /**\n   * Use an effect here, just;\n   * because when a property gets changed from outside\n   */\n  React.useEffect(() => {\n    const value = correctNumberValue({\n      localValue,\n      locale,\n      props,\n      maskParams,\n    })\n\n    setLocalValue(value)\n\n    // Do not set \"localValue\" and \"maskParams\" here\n  }, [props, context, locale]) // eslint-disable-line\n\n  return { localValue, setLocalValue }\n}\n\n/**\n * Create createNumberMask if number mask parameters exists\n *\n * @returns mask function\n */\nexport const useNumberMask = () => {\n  const maskParams = useNumberMaskParams()\n  const { props } = React.useContext(InputMaskedContext)\n\n  if (!maskParams || !isRequestingNumberMask(props)) {\n    return null\n  }\n\n  const mask = createNumberMask(maskParams)\n\n  mask.maskParams = maskParams\n\n  return mask\n}\n\n/**\n * Returns either internal mask or given property mask\n *\n * @returns mask function\n */\nexport const useMask = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const numberMask = useNumberMask()\n  if (numberMask) {\n    return numberMask\n  }\n\n  return props.mask\n}\n\n/**\n * Returns the final mask params\n *\n * @returns mask params\n */\nexport const useMaskParams = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const {\n    keep_char_positions,\n    show_guide,\n    show_mask,\n    placeholder_char,\n    placeholder,\n  } = props\n\n  const mask = useMask()\n  const maskParams = useNumberMaskParams() || {}\n\n  maskParams.showMask = !placeholder && isTrue(show_mask)\n\n  // Revalidated placeholder char to a zero width space\n  maskParams.placeholderChar = placeholder_char\n  if (typeof mask?.placeholderChar !== 'undefined') {\n    maskParams.placeholderChar = mask.placeholderChar\n  }\n  if (maskParams.placeholderChar === null) {\n    maskParams.placeholderChar = invisibleSpace\n  }\n\n  if (typeof mask?.showMask !== 'undefined') {\n    maskParams.showMask = mask.showMask\n  }\n\n  maskParams.showGuide = isTrue(show_guide)\n  maskParams.keepCharPositions = isTrue(keep_char_positions)\n\n  return maskParams\n}\n\n/**\n * Handle the TextMask dependency\n *\n * @returns React Element\n */\nexport const useInputElement = () => {\n  const { props } = React.useContext(InputMaskedContext)\n  const { pipe, inner_ref } = props\n\n  const mask = useMask()\n  const { showMask, showGuide, placeholderChar, keepCharPositions } =\n    useMaskParams()\n\n  const isFn = typeof inner_ref === 'function'\n  const refHook = React.useRef()\n  const ref = (!isFn && inner_ref) || refHook\n\n  React.useLayoutEffect(() => {\n    if (isFn) {\n      inner_ref?.(ref.current)\n    }\n  }, [ref.current])\n\n  // Create the actual input element\n  const inputElementRef = React.useRef(<input ref={ref} />)\n\n  const InputElement = (params, innerRef) => {\n    // Set ref for Eufemia input\n    innerRef.current = ref.current\n\n    return (\n      <TextMask\n        inputRef={ref}\n        inputElement={inputElementRef.current}\n        pipe={pipe}\n        mask={mask || []}\n        showMask={showMask}\n        guide={showGuide}\n        keepCharPositions={keepCharPositions}\n        placeholderChar={placeholderChar}\n        {...getSoftKeyboardAttributes(mask)}\n        {...params}\n        className={classnames(\n          params.className,\n          showMask &&\n            showGuide &&\n            placeholderChar &&\n            placeholderChar !== invisibleSpace &&\n            'dnb-input-masked--guide' // will use --font-family-monospace\n        )}\n      />\n    )\n  }\n  return InputElement\n}\n\n/**\n * Will map some events we need to map during typing\n *\n * @param {object} param0\n * @property {function} setLocalValue setState handler\n * @returns object of events to handle\n */\nexport const useEventMapping = ({ setLocalValue }) => {\n  const callEvent = useCallEvent({ setLocalValue })\n\n  return {\n    onBeforeInput: (event) => callEvent({ event }, 'on_before_input'),\n    onFocus: (params) => callEvent(params, 'on_focus'),\n    onBlur: (params) => callEvent(params, 'on_blur'),\n    onMouseUp: (event) => callEvent({ event }, 'on_mouse_up'),\n    onMouseDown: (event) => callEvent({ event }, 'on_mouse_down'),\n    onKeyDown: (params) => callEvent(params, 'on_key_down'),\n    onSubmit: (params) => callEvent(params, 'on_submit'),\n    onChange: (params) => callEvent(params, 'on_change'),\n\n    on_focus: undefined,\n    on_blur: undefined,\n    on_key_down: undefined,\n    on_submit: undefined,\n    on_change: undefined,\n  }\n}\n\n/**\n * Will map some events we need to map during typing\n *\n * @param {object} param0\n * @property {function} setLocalValue setState handler\n * @returns event handler function\n */\nconst useCallEvent = ({ setLocalValue }) => {\n  const { props } = React.useContext(InputMaskedContext)\n  const maskParams = useMaskParams()\n  const isNumberMask = useNumberMask()\n\n  // Source: https://en.wikipedia.org/wiki/Decimal_separator\n  const decimalSeparators = /[,.'·]/\n  let isUnidentified = false\n\n  const callEvent = ({ event, value }, name) => {\n    value = value || event.target.value\n    const selStart = event.target.selectionStart\n    let keyCode = keycode(event)\n\n    // Android issue: https://bugs.chromium.org/p/chromium/issues/detail?id=118639\n    if (\n      name === 'on_key_down' &&\n      (event.which === 229 || keyCode === undefined)\n    ) {\n      isUnidentified = true\n    }\n\n    // Android issue: https://bugs.chromium.org/p/chromium/issues/detail?id=118639\n    // so we use this solution instead\n    if (\n      isUnidentified &&\n      name === 'on_before_input' &&\n      typeof event?.data !== 'undefined'\n    ) {\n      name = 'on_key_down'\n      keyCode = event.data\n      isUnidentified = false\n    }\n\n    // Prevent entering a leading zero\n    if (\n      name === 'on_key_down' &&\n      !isUnidentified &&\n      maskParams?.disallowLeadingZeroes &&\n      (keyCode === '0' ||\n        keyCode === 'numpad 0' ||\n        (value.replace(/[^\\d]/g, '') === '' &&\n          decimalSeparators.test(keyCode)))\n    ) {\n      const testValue = (\n        value.slice(0, selStart) +\n        '0' +\n        value.slice(selStart + 1, value.length)\n      ).replace(/[^\\d]/g, '')\n\n      if (/^0/.test(testValue)) {\n        event.preventDefault()\n      }\n    }\n\n    if (\n      name === 'on_key_down' &&\n      isNumberMask &&\n      !isUnidentified &&\n      maskParams?.decimalSymbol\n    ) {\n      const hasDecimalSymbol = value.includes(maskParams.decimalSymbol)\n      const allowedDecimals =\n        maskParams.decimalLimit > 0 || maskParams.allowDecimal !== false\n\n      if (!allowedDecimals && decimalSeparators.test(keyCode)) {\n        event.preventDefault()\n      }\n\n      const charAtSelection = value.slice(selStart, selStart + 1)\n\n      if (allowedDecimals) {\n        // if we have already a decimal ...\n        if (hasDecimalSymbol && decimalSeparators.test(keyCode)) {\n          // ... we set the cursor on after the decimalSeparators\n          if (decimalSeparators.test(charAtSelection)) {\n            const index = value.indexOf(maskParams.decimalSymbol)\n            if (index > -1) {\n              safeSetSelection(event.target, index + 1)\n            }\n          }\n\n          // ... we do not allow to type another\n          event.preventDefault()\n        }\n\n        // replace other decimal\n        else if (\n          !hasDecimalSymbol &&\n          keyCode !== maskParams.decimalSymbol &&\n          decimalSeparators.test(keyCode)\n        ) {\n          value = value.slice(0, selStart)\n          setLocalValue(value + maskParams.decimalSymbol)\n          event.target.value = value + maskParams.decimalSymbol\n          event.preventDefault()\n        }\n      }\n\n      // move cursor to right if key is delete and char at selection is thousand separator\n      if (\n        keyCode === 'delete' &&\n        charAtSelection === (maskParams.thousandsSeparatorSymbol || ' ')\n      ) {\n        safeSetSelection(event.target, selStart + 1)\n        event.preventDefault()\n      }\n    }\n\n    let num = cleanNumber(value, {\n      prefix: maskParams.prefix,\n      suffix: maskParams.suffix,\n      decimalSeparator: maskParams.decimalSymbol || ',',\n      thousandsSeparator: maskParams.thousandsSeparatorSymbol || ' ',\n    })\n\n    // We don't want to return NaN, so we set it to 0\n    if (num === '-') {\n      num = -0\n    }\n\n    const numberValue = Number(num)\n\n    // Return '' (empty string) when the user has entered something invalid\n    const cleanedValue =\n      numberValue === 0 && String(num).charAt(0) !== '0' ? '' : num\n\n    switch (name) {\n      case 'on_focus':\n      case 'on_key_down':\n      case 'on_mouse_down':\n      case 'on_mouse_up':\n        event.target.runCorrectCaretPosition = () =>\n          correctCaretPosition(event.target, maskParams, props)\n        if (!event.target.__getCorrectCaretPosition) {\n          event.target.runCorrectCaretPosition()\n        }\n        break\n    }\n\n    const result = dispatchCustomElementEvent(props, name, {\n      event,\n      value,\n      numberValue,\n      cleanedValue,\n    })\n\n    if (name === 'on_change') {\n      setLocalValue(value)\n    }\n\n    return result\n  }\n\n  return callEvent\n}\n\n/**\n * Returns number mask parameters if requested by the component properties\n *\n * @returns object of number mask parameter\n */\nconst useNumberMaskParams = () => {\n  const { props } = React.useContext(InputMaskedContext)\n  const locale = useLocale()\n\n  if (!isRequestingNumberMask(props)) {\n    return { ...fromJSON(props.mask_options) }\n  }\n\n  let { number_mask, currency_mask, mask_options } = props\n\n  const { as_number, as_percent, as_currency } = props\n\n  mask_options = fromJSON(mask_options)\n  number_mask = isTrue(number_mask) ? {} : fromJSON(number_mask)\n  currency_mask = isTrue(currency_mask)\n    ? {}\n    : fromJSON(currency_mask, {\n        currency: currency_mask,\n      })\n  if (!currency_mask?.currency) {\n    delete currency_mask.currency\n  }\n\n  if (isRequestingLocaleSupport(props)) {\n    const thousandsSeparatorSymbol = handleThousandsSeparator(locale)\n    const decimalSymbol = handleDecimalSeparator(locale)\n\n    if (isTrue(as_number) || isTrue(as_percent)) {\n      number_mask = extendPropsWithContext(number_mask, null, {\n        decimalSymbol,\n        thousandsSeparatorSymbol,\n      })\n    } else if (as_currency) {\n      currency_mask = extendPropsWithContext(currency_mask, null, {\n        decimalSymbol,\n        thousandsSeparatorSymbol,\n        currency: getCurrencySymbol(\n          locale,\n          typeof as_currency === 'string' ? as_currency : null\n        ),\n      })\n    }\n  }\n\n  let maskParams = null\n\n  if (number_mask) {\n    maskParams = handleNumberMask({\n      mask_options,\n      number_mask,\n    })\n\n    if (isTrue(as_percent)) {\n      maskParams = handlePercentMask({ props, locale, maskParams })\n    }\n  } else if (currency_mask) {\n    maskParams = handleCurrencyMask({\n      mask_options,\n      currency_mask,\n    })\n  }\n\n  return maskParams\n}\n"],"mappings":"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"}
+{"version":3,"file":"InputMaskedHooks.js","names":["React","classnames","cleanNumber","getCurrencySymbol","isTrue","dispatchCustomElementEvent","extendPropsWithContext","safeSetSelection","TextMask","createNumberMask","keycode","InputMaskedContext","isRequestingLocaleSupport","isRequestingNumberMask","correctNumberValue","handlePercentMask","handleCurrencyMask","handleNumberMask","correctCaretPosition","getSoftKeyboardAttributes","handleThousandsSeparator","handleDecimalSeparator","fromJSON","invisibleSpace","useLayoutEffect","window","useEffect","useFilteredProps","props","useContext","mask","number_mask","currency_mask","number_format","mask_options","as_currency","as_number","as_percent","locale","show_mask","show_guide","pipe","keep_char_positions","placeholder_char","attributes","_objectWithoutProperties","_excluded","htmlAttributes","Object","freeze","useLocale","context","useLocalValue","maskParams","useNumberMaskParams","localValue","setLocalValue","useState","value","useNumberMask","useMask","numberMask","useMaskParams","placeholder","showMask","placeholderChar","showGuide","keepCharPositions","useInputElement","inner_ref","isFn","refHook","useRef","ref","current","inputElementRef","createElement","InputElement","params","innerRef","_extends","inputRef","inputElement","guide","className","useEventMapping","_ref","callEvent","useCallEvent","onBeforeInput","event","onFocus","onBlur","onMouseUp","onMouseDown","onKeyDown","onSubmit","onChange","on_focus","undefined","on_blur","on_key_down","on_submit","on_change","_ref2","isNumberMask","decimalSeparators","isUnidentified","_ref3","name","target","selStart","selectionStart","keyCode","which","data","disallowLeadingZeroes","replace","test","testValue","slice","length","preventDefault","decimalSymbol","hasDecimalSymbol","includes","allowedDecimals","decimalLimit","allowDecimal","charAtSelection","index","indexOf","thousandsSeparatorSymbol","num","prefix","suffix","decimalSeparator","thousandsSeparator","numberValue","Number","cleanedValue","String","charAt","runCorrectCaretPosition","__getCorrectCaretPosition","result","_currency_mask","_objectSpread","currency","_currency_mask2","currencyDisplay"],"sources":["../../../../src/components/input-masked/InputMaskedHooks.js"],"sourcesContent":["/**\n * Web InputMasked Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport {\n  cleanNumber,\n  getCurrencySymbol,\n} from '../number-format/NumberUtils'\nimport {\n  isTrue,\n  dispatchCustomElementEvent,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { safeSetSelection } from './text-mask/createTextMaskInputElement'\n\nimport TextMask from './TextMask'\nimport createNumberMask from './addons/createNumberMask'\nimport keycode from 'keycode'\nimport InputMaskedContext from './InputMaskedContext'\n\nimport {\n  isRequestingLocaleSupport,\n  isRequestingNumberMask,\n  correctNumberValue,\n  handlePercentMask,\n  handleCurrencyMask,\n  handleNumberMask,\n  correctCaretPosition,\n  getSoftKeyboardAttributes,\n  handleThousandsSeparator,\n  handleDecimalSeparator,\n  fromJSON,\n  invisibleSpace,\n} from './InputMaskedUtils'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\n/**\n * Takes all component properties and filters out all internal used properties\n *\n * @returns object {props, htmlAttributes}\n */\nexport const useFilteredProps = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const {\n    mask, // eslint-disable-line\n    number_mask, // eslint-disable-line\n    currency_mask, // eslint-disable-line\n    number_format, // eslint-disable-line\n    mask_options, // eslint-disable-line\n    as_currency, // eslint-disable-line\n    as_number, // eslint-disable-line\n    as_percent, // eslint-disable-line\n    locale, // eslint-disable-line\n    show_mask, // eslint-disable-line\n    show_guide, // eslint-disable-line\n    pipe, // eslint-disable-line\n    keep_char_positions, // eslint-disable-line\n    placeholder_char, // eslint-disable-line\n\n    // Get get rest of possible attributes\n    ...attributes\n  } = props\n\n  return { props, htmlAttributes: Object.freeze(attributes) }\n}\n\n/**\n * Returns locale from either component or context\n *\n * @returns string\n */\nexport const useLocale = () => {\n  const { props, context } = React.useContext(InputMaskedContext)\n\n  let { locale } = props\n  if (!locale && context?.locale) {\n    locale = context.locale\n  }\n\n  return locale\n}\n\n/**\n * Handle internal value state\n *\n * It handles both the value state given as a prop form outside,\n * along with the current written and internal value.\n *\n * @returns object with internal value state and state setter\n */\nexport const useLocalValue = () => {\n  const { props, context } = React.useContext(InputMaskedContext)\n  const maskParams = useNumberMaskParams() || {}\n  const locale = useLocale()\n\n  const [localValue, setLocalValue] = React.useState(() =>\n    correctNumberValue({\n      locale,\n      props,\n      maskParams,\n    })\n  )\n\n  /**\n   * Use an effect here, just;\n   * because when a property gets changed from outside\n   */\n  React.useEffect(() => {\n    const value = correctNumberValue({\n      localValue,\n      locale,\n      props,\n      maskParams,\n    })\n\n    setLocalValue(value)\n\n    // Do not set \"localValue\" and \"maskParams\" here\n  }, [props, context, locale]) // eslint-disable-line\n\n  return { localValue, setLocalValue }\n}\n\n/**\n * Create createNumberMask if number mask parameters exists\n *\n * @returns mask function\n */\nexport const useNumberMask = () => {\n  const maskParams = useNumberMaskParams()\n  const { props } = React.useContext(InputMaskedContext)\n\n  if (!maskParams || !isRequestingNumberMask(props)) {\n    return null\n  }\n\n  const mask = createNumberMask(maskParams)\n\n  mask.maskParams = maskParams\n\n  return mask\n}\n\n/**\n * Returns either internal mask or given property mask\n *\n * @returns mask function\n */\nexport const useMask = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const numberMask = useNumberMask()\n  if (numberMask) {\n    return numberMask\n  }\n\n  return props.mask\n}\n\n/**\n * Returns the final mask params\n *\n * @returns mask params\n */\nexport const useMaskParams = () => {\n  const { props } = React.useContext(InputMaskedContext)\n\n  const {\n    keep_char_positions,\n    show_guide,\n    show_mask,\n    placeholder_char,\n    placeholder,\n  } = props\n\n  const mask = useMask()\n  const maskParams = useNumberMaskParams() || {}\n\n  maskParams.showMask = !placeholder && isTrue(show_mask)\n\n  // Revalidated placeholder char to a zero width space\n  maskParams.placeholderChar = placeholder_char\n  if (typeof mask?.placeholderChar !== 'undefined') {\n    maskParams.placeholderChar = mask.placeholderChar\n  }\n  if (maskParams.placeholderChar === null) {\n    maskParams.placeholderChar = invisibleSpace\n  }\n\n  if (typeof mask?.showMask !== 'undefined') {\n    maskParams.showMask = mask.showMask\n  }\n\n  maskParams.showGuide = isTrue(show_guide)\n  maskParams.keepCharPositions = isTrue(keep_char_positions)\n\n  return maskParams\n}\n\n/**\n * Handle the TextMask dependency\n *\n * @returns React Element\n */\nexport const useInputElement = () => {\n  const { props } = React.useContext(InputMaskedContext)\n  const { pipe, inner_ref } = props\n\n  const mask = useMask()\n  const { showMask, showGuide, placeholderChar, keepCharPositions } =\n    useMaskParams()\n\n  const isFn = typeof inner_ref === 'function'\n  const refHook = React.useRef()\n  const ref = (!isFn && inner_ref) || refHook\n\n  useLayoutEffect(() => {\n    if (isFn) {\n      inner_ref?.(ref.current)\n    }\n  }, [inner_ref, isFn, ref])\n\n  // Create the actual input element\n  const inputElementRef = React.useRef(<input ref={ref} />)\n\n  const InputElement = (params, innerRef) => {\n    // Set ref for Eufemia input\n    innerRef.current = ref.current\n\n    return (\n      <TextMask\n        inputRef={ref}\n        inputElement={inputElementRef.current}\n        pipe={pipe}\n        mask={mask || []}\n        showMask={showMask}\n        guide={showGuide}\n        keepCharPositions={keepCharPositions}\n        placeholderChar={placeholderChar}\n        {...getSoftKeyboardAttributes(mask)}\n        {...params}\n        className={classnames(\n          params.className,\n          showMask &&\n            showGuide &&\n            placeholderChar &&\n            placeholderChar !== invisibleSpace &&\n            'dnb-input-masked--guide' // will use --font-family-monospace\n        )}\n      />\n    )\n  }\n  return InputElement\n}\n\n/**\n * Will map some events we need to map during typing\n *\n * @param {object} param0\n * @property {function} setLocalValue setState handler\n * @returns object of events to handle\n */\nexport const useEventMapping = ({ setLocalValue }) => {\n  const callEvent = useCallEvent({ setLocalValue })\n\n  return {\n    onBeforeInput: (event) => callEvent({ event }, 'on_before_input'),\n    onFocus: (params) => callEvent(params, 'on_focus'),\n    onBlur: (params) => callEvent(params, 'on_blur'),\n    onMouseUp: (event) => callEvent({ event }, 'on_mouse_up'),\n    onMouseDown: (event) => callEvent({ event }, 'on_mouse_down'),\n    onKeyDown: (params) => callEvent(params, 'on_key_down'),\n    onSubmit: (params) => callEvent(params, 'on_submit'),\n    onChange: (params) => callEvent(params, 'on_change'),\n\n    on_focus: undefined,\n    on_blur: undefined,\n    on_key_down: undefined,\n    on_submit: undefined,\n    on_change: undefined,\n  }\n}\n\n/**\n * Will map some events we need to map during typing\n *\n * @param {object} param0\n * @property {function} setLocalValue setState handler\n * @returns event handler function\n */\nconst useCallEvent = ({ setLocalValue }) => {\n  const { props } = React.useContext(InputMaskedContext)\n  const maskParams = useMaskParams()\n  const isNumberMask = useNumberMask()\n\n  // Source: https://en.wikipedia.org/wiki/Decimal_separator\n  const decimalSeparators = /[,.'·]/\n  let isUnidentified = false\n\n  const callEvent = ({ event, value }, name) => {\n    value = value || event.target.value\n    const selStart = event.target.selectionStart\n    let keyCode = keycode(event)\n\n    // Android issue: https://bugs.chromium.org/p/chromium/issues/detail?id=118639\n    if (\n      name === 'on_key_down' &&\n      (event.which === 229 || keyCode === undefined)\n    ) {\n      isUnidentified = true\n    }\n\n    // Android issue: https://bugs.chromium.org/p/chromium/issues/detail?id=118639\n    // so we use this solution instead\n    if (\n      isUnidentified &&\n      name === 'on_before_input' &&\n      typeof event?.data !== 'undefined'\n    ) {\n      name = 'on_key_down'\n      keyCode = event.data\n      isUnidentified = false\n    }\n\n    // Prevent entering a leading zero\n    if (\n      name === 'on_key_down' &&\n      !isUnidentified &&\n      maskParams?.disallowLeadingZeroes &&\n      (keyCode === '0' ||\n        keyCode === 'numpad 0' ||\n        (value.replace(/[^\\d]/g, '') === '' &&\n          decimalSeparators.test(keyCode)))\n    ) {\n      const testValue = (\n        value.slice(0, selStart) +\n        '0' +\n        value.slice(selStart + 1, value.length)\n      ).replace(/[^\\d]/g, '')\n\n      if (/^0/.test(testValue)) {\n        event.preventDefault()\n      }\n    }\n\n    if (\n      name === 'on_key_down' &&\n      isNumberMask &&\n      !isUnidentified &&\n      maskParams?.decimalSymbol\n    ) {\n      const hasDecimalSymbol = value.includes(maskParams.decimalSymbol)\n      const allowedDecimals =\n        maskParams.decimalLimit > 0 || maskParams.allowDecimal !== false\n\n      if (!allowedDecimals && decimalSeparators.test(keyCode)) {\n        event.preventDefault()\n      }\n\n      const charAtSelection = value.slice(selStart, selStart + 1)\n\n      if (allowedDecimals) {\n        // if we have already a decimal ...\n        if (hasDecimalSymbol && decimalSeparators.test(keyCode)) {\n          // ... we set the cursor on after the decimalSeparators\n          if (decimalSeparators.test(charAtSelection)) {\n            const index = value.indexOf(maskParams.decimalSymbol)\n            if (index > -1) {\n              safeSetSelection(event.target, index + 1)\n            }\n          }\n\n          // ... we do not allow to type another\n          event.preventDefault()\n        }\n\n        // replace other decimal\n        else if (\n          !hasDecimalSymbol &&\n          keyCode !== maskParams.decimalSymbol &&\n          decimalSeparators.test(keyCode)\n        ) {\n          value = value.slice(0, selStart)\n          setLocalValue(value + maskParams.decimalSymbol)\n          event.target.value = value + maskParams.decimalSymbol\n          event.preventDefault()\n        }\n      }\n\n      // move cursor to right if key is delete and char at selection is thousand separator\n      if (\n        keyCode === 'delete' &&\n        charAtSelection === (maskParams.thousandsSeparatorSymbol || ' ')\n      ) {\n        safeSetSelection(event.target, selStart + 1)\n        event.preventDefault()\n      }\n    }\n\n    let num = cleanNumber(value, {\n      prefix: maskParams.prefix,\n      suffix: maskParams.suffix,\n      decimalSeparator: maskParams.decimalSymbol || ',',\n      thousandsSeparator: maskParams.thousandsSeparatorSymbol || ' ',\n    })\n\n    // We don't want to return NaN, so we set it to 0\n    if (num === '-') {\n      num = -0\n    }\n\n    const numberValue = Number(num)\n\n    // Return '' (empty string) when the user has entered something invalid\n    const cleanedValue =\n      numberValue === 0 && String(num).charAt(0) !== '0' ? '' : num\n\n    switch (name) {\n      case 'on_focus':\n      case 'on_key_down':\n      case 'on_mouse_down':\n      case 'on_mouse_up':\n        event.target.runCorrectCaretPosition = () =>\n          correctCaretPosition(event.target, maskParams, props)\n        if (!event.target.__getCorrectCaretPosition) {\n          event.target.runCorrectCaretPosition()\n        }\n        break\n    }\n\n    const result = dispatchCustomElementEvent(props, name, {\n      event,\n      value,\n      numberValue,\n      cleanedValue,\n    })\n\n    if (name === 'on_change') {\n      setLocalValue(value)\n    }\n\n    return result\n  }\n\n  return callEvent\n}\n\n/**\n * Returns number mask parameters if requested by the component properties\n *\n * @returns object of number mask parameter\n */\nconst useNumberMaskParams = () => {\n  const { props } = React.useContext(InputMaskedContext)\n  const locale = useLocale()\n\n  if (!isRequestingNumberMask(props)) {\n    return { ...fromJSON(props.mask_options) }\n  }\n\n  let { number_mask, currency_mask, mask_options } = props\n  const { as_number, as_percent, as_currency, value } = props\n\n  mask_options = fromJSON(mask_options)\n  number_mask = isTrue(number_mask) ? {} : fromJSON(number_mask)\n  currency_mask = isTrue(currency_mask)\n    ? {}\n    : fromJSON(currency_mask, {\n        currency: currency_mask,\n      })\n  if (!currency_mask?.currency) {\n    delete currency_mask.currency\n  }\n\n  if (isRequestingLocaleSupport(props)) {\n    const thousandsSeparatorSymbol = handleThousandsSeparator(locale)\n    const decimalSymbol = handleDecimalSeparator(locale)\n\n    if (isTrue(as_number) || isTrue(as_percent)) {\n      number_mask = extendPropsWithContext(number_mask, null, {\n        decimalSymbol,\n        thousandsSeparatorSymbol,\n      })\n    } else if (as_currency) {\n      currency_mask = extendPropsWithContext(currency_mask, null, {\n        decimalSymbol,\n        thousandsSeparatorSymbol,\n        currency: getCurrencySymbol(\n          locale,\n          typeof as_currency === 'string' ? as_currency : null,\n          currency_mask?.currencyDisplay,\n          value\n        ),\n      })\n    }\n  }\n\n  let maskParams = null\n\n  if (number_mask) {\n    maskParams = handleNumberMask({\n      mask_options,\n      number_mask,\n    })\n\n    if (isTrue(as_percent)) {\n      maskParams = handlePercentMask({ props, locale, maskParams })\n    }\n  } else if (currency_mask) {\n    maskParams = handleCurrencyMask({\n      mask_options,\n      currency_mask,\n    })\n  }\n\n  return maskParams\n}\n"],"mappings":"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"}

package/components/input-masked/MultiInputMask.js

@@ -161,7 +161,7 @@ function MultiInputMaskInput(_ref4) {
     guide: true,
     showMask: true,
     keepCharPositions: false,
-    "aria-labelledby": `${id}-${inputId}__label`,
+    "aria-label": label,
     ref: getInputRef,
     onKeyDown: onKeyDown,
     onBlur: onBlur,
@@ -181,11 +181,7 @@ function MultiInputMaskInput(_ref4) {
     onChange: event => {
       onChange(inputId, removePlaceholder(event.target.value, placeholderCharacter));
     }
-  }, attributes)), React.createElement("label", {
-    id: `${id}-${inputId}__label`,
-    htmlFor: `${id}-${inputId}`,
-    hidden: true
-  }, label), delimiter && React.createElement("span", {
+  }, attributes)), delimiter && React.createElement("span", {
     "aria-hidden": true,
     className: 'dnb-multi-input-mask__delimiter' + (shouldHighlight ? " dnb-multi-input-mask__delimiter--highlight" : "")
   }, delimiter));

package/components/input-masked/MultiInputMask.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiInputMask.js","names":["React","useRef","Input","TextMask","useHandleCursorPosition","classnames","FormLabel","createSpacingClasses","useMultiInputValue","makeUniqueId","MultiInputMask","_ref","id","label","labelDirection","inputs","delimiter","onChange","onChangeExternal","disabled","status","statusState","values","defaultValues","className","stretch","inputMode","suffix","onBlur","onFocus","props","_objectWithoutProperties","_excluded","callback","inputRefs","onKeyDown","current","getKeysToHandle","WrapperElement","createElement","element","onClick","onLegendClick","vertical","_extends","status_state","input_element","map","_ref2","index","inputId","rest","_excluded2","MultiInputMaskInput","key","length","undefined","getInputRef","value","firstInput","focus","setSelectionRange","ref","inputRef","includes","push","uniqueMasks","getUniqueMasks","size","pattern","next","replace","RegExp","reduce","keys","_ref3","mask","masks","Set","forEach","input","add","String","_ref4","placeholderCharacter","attributes","_excluded3","shouldHighlight","test","Fragment","placeholderChar","guide","showMask","keepCharPositions","_ref5","target","event","_excluded4","select","_objectSpread","removePlaceholder","htmlFor","hidden","placeholder","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input-masked/MultiInputMask.tsx"],"sourcesContent":["import React, { Fragment, MutableRefObject, useRef } from 'react'\nimport Input from '../Input'\nimport TextMask from './TextMask'\nimport useHandleCursorPosition from './hooks/useHandleCursorPosition'\nimport classnames from 'classnames'\nimport FormLabel from '../FormLabel'\nimport { SpacingProps } from '../space/types'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport { FormStatusState, FormStatusText } from '../FormStatus'\nimport { useMultiInputValue } from './hooks/useMultiInputValues'\nimport { makeUniqueId } from '../../shared/component-helper'\n\nexport type MultiInputMaskInput<T extends string> = {\n  /**\n   * Defines the id for the input. This id is also used to map the input value to the correct property on the objects used for `values` and `onChange` parameters.\n   */\n  id: T\n  /**\n   * Label used by the input. The label itself is hidden, but required to uphold accessibility standards for screen readers.\n   */\n  label: React.ReactNode\n  /**\n   * Each RegExp item in the array defines what the mask should be for each subsequent character in the input. The length sets the size of the input, so an array of two items would produce an input of two characters\n   */\n  mask: RegExp[]\n  /**\n   * Sets the placeholder character used for the input.\n   */\n  placeholderCharacter: string\n} & Omit<React.HTMLProps<HTMLInputElement>, 'onChange' | 'ref'>\n\nexport type MultiInputMaskValue<T extends string> = {\n  // eslint-disable-next-line no-unused-vars\n  [K in T]: string\n}\n\nexport type MultiInputMaskProps<T extends string> = {\n  /**\n   * The label describing the group of inputs inside the components.\n   */\n  label?: React.ReactNode\n  /**\n   * Use to change the label layout direction. Defaults to `horizontal`.\n   */\n  labelDirection?: 'vertical' | 'horizontal'\n  /**\n   * Used to define the different inputs representing the inputs in the component. The id's defined here is used to map input value to correct property in `values` parameters used in `onChange`\n   */\n  inputs: MultiInputMaskInput<T>[]\n  /**\n   * Values used for the inputs inside the component. Expects an object with keys matching the id's defined in `inputs`\n   */\n  values?: MultiInputMaskValue<T>\n  /**\n   * Defines the delimiter used to separate the inputs inside the component.\n   */\n  delimiter?: string\n  /**\n   * Runs when the input value changes. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onChange?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Runs when the input gains focus. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onFocus?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Runs when the input loses focus. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onBlur?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message.\n   */\n  status?: FormStatusText\n  /**\n   * Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.\n   */\n  statusState?: FormStatusState\n  /**\n   * Set it to `true` in order to stretch the input to the available space. Defaults to false.\n   */\n  stretch?: boolean\n  /**\n   * Text describing the content of the input more than the label. you can also send in a React component, so it gets wrapped inside the Input component.\n   */\n  suffix?: React.ReactNode\n} & Omit<\n  React.HTMLProps<HTMLInputElement>,\n  'onChange' | 'onFocus' | 'onBlur' | 'ref' | 'value' | 'label'\n> &\n  SpacingProps\n\nfunction MultiInputMask<T extends string>({\n  id = makeUniqueId(),\n  label,\n  labelDirection = 'horizontal',\n  inputs,\n  delimiter,\n  onChange: onChangeExternal,\n  disabled,\n  status,\n  statusState,\n  values: defaultValues,\n  className,\n  stretch,\n  inputMode,\n  suffix,\n  onBlur,\n  onFocus,\n  ...props\n}: MultiInputMaskProps<T>) {\n  const [values, onChange] = useMultiInputValue({\n    inputs,\n    defaultValues,\n    callback: onChangeExternal,\n  })\n\n  const inputRefs = useRef<Array<MutableRefObject<HTMLInputElement>>>([])\n\n  const { onKeyDown } = useHandleCursorPosition(\n    inputRefs.current,\n    getKeysToHandle()\n  )\n\n  const WrapperElement = label ? 'fieldset' : 'div'\n\n  return (\n    <WrapperElement\n      className={classnames(\n        'dnb-multi-input-mask__fieldset',\n        labelDirection === 'horizontal' &&\n          'dnb-multi-input-mask__fieldset--horizontal',\n        createSpacingClasses(props)\n      )}\n    >\n      {label && (\n        <FormLabel\n          className={classnames(\n            'dnb-multi-input-mask__legend',\n            labelDirection === 'horizontal' &&\n              'dnb-multi-input-mask__legend--horizontal'\n          )}\n          element=\"legend\"\n          onClick={onLegendClick}\n          disabled={disabled}\n          vertical={labelDirection === 'vertical'}\n        >\n          {/* This <span/> wrapper is needed to make hover work in Safari Desktop */}\n          <span>{label}</span>\n        </FormLabel>\n      )}\n      <Input\n        {...props}\n        className={classnames('dnb-multi-input-mask', className)}\n        disabled={disabled}\n        status={status}\n        status_state={statusState}\n        suffix={suffix}\n        stretch={stretch}\n        input_element={inputs.map(({ id: inputId, ...rest }, index) => {\n          return (\n            <MultiInputMaskInput\n              key={inputId}\n              id={id}\n              inputId={inputId}\n              delimiter={\n                index !== inputs.length - 1 ? delimiter : undefined\n              }\n              disabled={disabled}\n              inputMode={inputMode}\n              onKeyDown={onKeyDown}\n              onChange={onChange}\n              onFocus={() => {\n                if (onFocus) {\n                  onFocus(values)\n                }\n              }}\n              onBlur={() => {\n                if (onBlur) {\n                  onBlur(values)\n                }\n              }}\n              getInputRef={getInputRef}\n              {...rest}\n              value={values[inputId]}\n            />\n          )\n        })}\n      />\n    </WrapperElement>\n  )\n\n  // Event handlers\n  function onLegendClick() {\n    if (disabled) {\n      return\n    }\n\n    const firstInput = inputRefs.current[0].current\n\n    firstInput.focus()\n    firstInput.setSelectionRange(0, 0)\n  }\n\n  // Utilities\n  function getInputRef(ref?: {\n    inputRef?: MutableRefObject<HTMLInputElement>\n  }) {\n    const inputRef = ref?.inputRef\n\n    if (inputRef && !inputRefs.current.includes(inputRef)) {\n      inputRefs.current.push(inputRef)\n    }\n\n    return inputRef\n  }\n\n  function getKeysToHandle() {\n    const uniqueMasks = getUniqueMasks()\n\n    // Return the only one RegExp since all the inputs are using the same mask\n    if (uniqueMasks.size === 1) {\n      const pattern = uniqueMasks.values().next().value.replace(/\\//g, '')\n      return new RegExp(pattern)\n    }\n\n    // If there are multiple types of masks used, then map the maps to an object based on input ids\n    // So that useHandleCursorPosition can do a per character test to see if the pressed key should be handled or not\n    return inputs.reduce(\n      (keys, { id, mask }) => {\n        keys[id] = mask\n\n        return keys\n      },\n      {} as Record<T, RegExp[]>\n    )\n  }\n\n  function getUniqueMasks() {\n    const masks = new Set()\n\n    inputs.forEach((input) => {\n      input.mask.forEach((pattern) => masks.add(String(pattern)))\n    })\n\n    return masks\n  }\n}\n\ntype MultiInputMaskInputProps<T extends string> =\n  MultiInputMaskInput<T> & {\n    id: MultiInputMaskInput<T>['id']\n    inputId: MultiInputMaskInput<T>['id']\n    label: MultiInputMaskInput<T>['label']\n    value: string\n    mask: MultiInputMaskInput<T>['mask']\n    placeholderCharacter: MultiInputMaskInput<T>['placeholderCharacter']\n    delimiter?: MultiInputMaskProps<T>['delimiter']\n    disabled: boolean\n    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void\n    onChange: (\n      id: string,\n      placeholderCharacter: MultiInputMaskInput<T>['placeholderCharacter']\n    ) => void\n    getInputRef: () => MutableRefObject<HTMLInputElement>\n  }\n\nfunction MultiInputMaskInput<T extends string>({\n  id,\n  inputId,\n  label,\n  value,\n  mask,\n  placeholderCharacter,\n  delimiter,\n  disabled,\n  getInputRef,\n  onKeyDown,\n  onChange,\n  onBlur,\n  onFocus,\n  ...attributes\n}: MultiInputMaskInputProps<T>) {\n  const shouldHighlight = !disabled && /\\w+/.test(value)\n\n  return (\n    <>\n      <TextMask\n        id={`${id}-${inputId}`}\n        data-mask-id={inputId}\n        className={classnames(\n          'dnb-input__input',\n          'dnb-multi-input-mask__input',\n          shouldHighlight && 'dnb-multi-input-mask__input--highlight'\n        )}\n        disabled={disabled}\n        size={mask.length}\n        mask={mask}\n        value={value ?? ''}\n        placeholderChar={placeholderCharacter}\n        guide={true}\n        showMask={true}\n        keepCharPositions={false} // so we can overwrite next value, if it already exists\n        aria-labelledby={`${id}-${inputId}__label`}\n        ref={getInputRef}\n        onKeyDown={onKeyDown}\n        onBlur={onBlur}\n        onFocus={({ target, ...event }) => {\n          target.focus()\n          target.select()\n\n          if (onFocus) {\n            onFocus({ target, ...event })\n          }\n        }}\n        onChange={(event) => {\n          onChange(\n            inputId,\n            removePlaceholder(event.target.value, placeholderCharacter)\n          )\n        }}\n        {...attributes}\n      />\n      <label\n        id={`${id}-${inputId}__label`}\n        htmlFor={`${id}-${inputId}`}\n        hidden\n      >\n        {label}\n      </label>\n      {delimiter && (\n        <span\n          aria-hidden\n          className={classnames(\n            'dnb-multi-input-mask__delimiter',\n            shouldHighlight && 'dnb-multi-input-mask__delimiter--highlight'\n          )}\n        >\n          {delimiter}\n        </span>\n      )}\n    </>\n  )\n\n  function removePlaceholder(value: string, placeholder: string) {\n    return value.replace(RegExp(placeholder, 'gm'), '')\n  }\n}\n\nexport default MultiInputMask\n\nMultiInputMask._formElement = true\nMultiInputMask._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"MultiInputMask.js","names":["React","useRef","Input","TextMask","useHandleCursorPosition","classnames","FormLabel","createSpacingClasses","useMultiInputValue","makeUniqueId","MultiInputMask","_ref","id","label","labelDirection","inputs","delimiter","onChange","onChangeExternal","disabled","status","statusState","values","defaultValues","className","stretch","inputMode","suffix","onBlur","onFocus","props","_objectWithoutProperties","_excluded","callback","inputRefs","onKeyDown","current","getKeysToHandle","WrapperElement","createElement","element","onClick","onLegendClick","vertical","_extends","status_state","input_element","map","_ref2","index","inputId","rest","_excluded2","MultiInputMaskInput","key","length","undefined","getInputRef","value","firstInput","focus","setSelectionRange","ref","inputRef","includes","push","uniqueMasks","getUniqueMasks","size","pattern","next","replace","RegExp","reduce","keys","_ref3","mask","masks","Set","forEach","input","add","String","_ref4","placeholderCharacter","attributes","_excluded3","shouldHighlight","test","Fragment","placeholderChar","guide","showMask","keepCharPositions","_ref5","target","event","_excluded4","select","_objectSpread","removePlaceholder","placeholder","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input-masked/MultiInputMask.tsx"],"sourcesContent":["import React, { Fragment, MutableRefObject, useRef } from 'react'\nimport Input from '../Input'\nimport TextMask from './TextMask'\nimport useHandleCursorPosition from './hooks/useHandleCursorPosition'\nimport classnames from 'classnames'\nimport FormLabel from '../FormLabel'\nimport { SpacingProps } from '../space/types'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport { FormStatusState, FormStatusText } from '../FormStatus'\nimport { useMultiInputValue } from './hooks/useMultiInputValues'\nimport { makeUniqueId } from '../../shared/component-helper'\n\nexport type MultiInputMaskInput<T extends string> = {\n  /**\n   * Defines the id for the input. This id is also used to map the input value to the correct property on the objects used for `values` and `onChange` parameters.\n   */\n  id: T\n  /**\n   * Label used by the input. The label itself is hidden, but required to uphold accessibility standards for screen readers.\n   */\n  label: React.ReactNode\n  /**\n   * Each RegExp item in the array defines what the mask should be for each subsequent character in the input. The length sets the size of the input, so an array of two items would produce an input of two characters\n   */\n  mask: RegExp[]\n  /**\n   * Sets the placeholder character used for the input.\n   */\n  placeholderCharacter: string\n} & Omit<React.HTMLProps<HTMLInputElement>, 'onChange' | 'ref'>\n\nexport type MultiInputMaskValue<T extends string> = {\n  // eslint-disable-next-line no-unused-vars\n  [K in T]: string\n}\n\nexport type MultiInputMaskProps<T extends string> = {\n  /**\n   * The label describing the group of inputs inside the components.\n   */\n  label?: React.ReactNode\n  /**\n   * Use to change the label layout direction. Defaults to `horizontal`.\n   */\n  labelDirection?: 'vertical' | 'horizontal'\n  /**\n   * Used to define the different inputs representing the inputs in the component. The id's defined here is used to map input value to correct property in `values` parameters used in `onChange`\n   */\n  inputs: MultiInputMaskInput<T>[]\n  /**\n   * Values used for the inputs inside the component. Expects an object with keys matching the id's defined in `inputs`\n   */\n  values?: MultiInputMaskValue<T>\n  /**\n   * Defines the delimiter used to separate the inputs inside the component.\n   */\n  delimiter?: string\n  /**\n   * Runs when the input value changes. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onChange?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Runs when the input gains focus. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onFocus?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Runs when the input loses focus. Has an object parameter with keys matching the id's defined in `inputs`. i.e. `{month: string, year: string}`\n   */\n  onBlur?: (values: MultiInputMaskValue<T>) => void\n  /**\n   * Text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message.\n   */\n  status?: FormStatusText\n  /**\n   * Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.\n   */\n  statusState?: FormStatusState\n  /**\n   * Set it to `true` in order to stretch the input to the available space. Defaults to false.\n   */\n  stretch?: boolean\n  /**\n   * Text describing the content of the input more than the label. you can also send in a React component, so it gets wrapped inside the Input component.\n   */\n  suffix?: React.ReactNode\n} & Omit<\n  React.HTMLProps<HTMLInputElement>,\n  'onChange' | 'onFocus' | 'onBlur' | 'ref' | 'value' | 'label'\n> &\n  SpacingProps\n\nfunction MultiInputMask<T extends string>({\n  id = makeUniqueId(),\n  label,\n  labelDirection = 'horizontal',\n  inputs,\n  delimiter,\n  onChange: onChangeExternal,\n  disabled,\n  status,\n  statusState,\n  values: defaultValues,\n  className,\n  stretch,\n  inputMode,\n  suffix,\n  onBlur,\n  onFocus,\n  ...props\n}: MultiInputMaskProps<T>) {\n  const [values, onChange] = useMultiInputValue({\n    inputs,\n    defaultValues,\n    callback: onChangeExternal,\n  })\n\n  const inputRefs = useRef<Array<MutableRefObject<HTMLInputElement>>>([])\n\n  const { onKeyDown } = useHandleCursorPosition(\n    inputRefs.current,\n    getKeysToHandle()\n  )\n\n  const WrapperElement = label ? 'fieldset' : 'div'\n\n  return (\n    <WrapperElement\n      className={classnames(\n        'dnb-multi-input-mask__fieldset',\n        labelDirection === 'horizontal' &&\n          'dnb-multi-input-mask__fieldset--horizontal',\n        createSpacingClasses(props)\n      )}\n    >\n      {label && (\n        <FormLabel\n          className={classnames(\n            'dnb-multi-input-mask__legend',\n            labelDirection === 'horizontal' &&\n              'dnb-multi-input-mask__legend--horizontal'\n          )}\n          element=\"legend\"\n          onClick={onLegendClick}\n          disabled={disabled}\n          vertical={labelDirection === 'vertical'}\n        >\n          {/* This <span/> wrapper is needed to make hover work in Safari Desktop */}\n          <span>{label}</span>\n        </FormLabel>\n      )}\n      <Input\n        {...props}\n        className={classnames('dnb-multi-input-mask', className)}\n        disabled={disabled}\n        status={status}\n        status_state={statusState}\n        suffix={suffix}\n        stretch={stretch}\n        input_element={inputs.map(({ id: inputId, ...rest }, index) => {\n          return (\n            <MultiInputMaskInput\n              key={inputId}\n              id={id}\n              inputId={inputId}\n              delimiter={\n                index !== inputs.length - 1 ? delimiter : undefined\n              }\n              disabled={disabled}\n              inputMode={inputMode}\n              onKeyDown={onKeyDown}\n              onChange={onChange}\n              onFocus={() => {\n                if (onFocus) {\n                  onFocus(values)\n                }\n              }}\n              onBlur={() => {\n                if (onBlur) {\n                  onBlur(values)\n                }\n              }}\n              getInputRef={getInputRef}\n              {...rest}\n              value={values[inputId]}\n            />\n          )\n        })}\n      />\n    </WrapperElement>\n  )\n\n  // Event handlers\n  function onLegendClick() {\n    if (disabled) {\n      return\n    }\n\n    const firstInput = inputRefs.current[0].current\n\n    firstInput.focus()\n    firstInput.setSelectionRange(0, 0)\n  }\n\n  // Utilities\n  function getInputRef(ref?: {\n    inputRef?: MutableRefObject<HTMLInputElement>\n  }) {\n    const inputRef = ref?.inputRef\n\n    if (inputRef && !inputRefs.current.includes(inputRef)) {\n      inputRefs.current.push(inputRef)\n    }\n\n    return inputRef\n  }\n\n  function getKeysToHandle() {\n    const uniqueMasks = getUniqueMasks()\n\n    // Return the only one RegExp since all the inputs are using the same mask\n    if (uniqueMasks.size === 1) {\n      const pattern = uniqueMasks.values().next().value.replace(/\\//g, '')\n      return new RegExp(pattern)\n    }\n\n    // If there are multiple types of masks used, then map the maps to an object based on input ids\n    // So that useHandleCursorPosition can do a per character test to see if the pressed key should be handled or not\n    return inputs.reduce(\n      (keys, { id, mask }) => {\n        keys[id] = mask\n\n        return keys\n      },\n      {} as Record<T, RegExp[]>\n    )\n  }\n\n  function getUniqueMasks() {\n    const masks = new Set()\n\n    inputs.forEach((input) => {\n      input.mask.forEach((pattern) => masks.add(String(pattern)))\n    })\n\n    return masks\n  }\n}\n\ntype MultiInputMaskInputProps<T extends string> =\n  MultiInputMaskInput<T> & {\n    id: MultiInputMaskInput<T>['id']\n    inputId: MultiInputMaskInput<T>['id']\n    label: MultiInputMaskInput<T>['label']\n    value: string\n    mask: MultiInputMaskInput<T>['mask']\n    placeholderCharacter: MultiInputMaskInput<T>['placeholderCharacter']\n    delimiter?: MultiInputMaskProps<T>['delimiter']\n    disabled: boolean\n    onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void\n    onChange: (\n      id: string,\n      placeholderCharacter: MultiInputMaskInput<T>['placeholderCharacter']\n    ) => void\n    getInputRef: () => MutableRefObject<HTMLInputElement>\n  }\n\nfunction MultiInputMaskInput<T extends string>({\n  id,\n  inputId,\n  label,\n  value,\n  mask,\n  placeholderCharacter,\n  delimiter,\n  disabled,\n  getInputRef,\n  onKeyDown,\n  onChange,\n  onBlur,\n  onFocus,\n  ...attributes\n}: MultiInputMaskInputProps<T>) {\n  const shouldHighlight = !disabled && /\\w+/.test(value)\n\n  return (\n    <>\n      <TextMask\n        id={`${id}-${inputId}`}\n        data-mask-id={inputId}\n        className={classnames(\n          'dnb-input__input',\n          'dnb-multi-input-mask__input',\n          shouldHighlight && 'dnb-multi-input-mask__input--highlight'\n        )}\n        disabled={disabled}\n        size={mask.length}\n        mask={mask}\n        value={value ?? ''}\n        placeholderChar={placeholderCharacter}\n        guide={true}\n        showMask={true}\n        keepCharPositions={false} // so we can overwrite next value, if it already exists\n        aria-label={label}\n        ref={getInputRef}\n        onKeyDown={onKeyDown}\n        onBlur={onBlur}\n        onFocus={({ target, ...event }) => {\n          target.focus()\n          target.select()\n\n          if (onFocus) {\n            onFocus({ target, ...event })\n          }\n        }}\n        onChange={(event) => {\n          onChange(\n            inputId,\n            removePlaceholder(event.target.value, placeholderCharacter)\n          )\n        }}\n        {...attributes}\n      />\n      {delimiter && (\n        <span\n          aria-hidden\n          className={classnames(\n            'dnb-multi-input-mask__delimiter',\n            shouldHighlight && 'dnb-multi-input-mask__delimiter--highlight'\n          )}\n        >\n          {delimiter}\n        </span>\n      )}\n    </>\n  )\n\n  function removePlaceholder(value: string, placeholder: string) {\n    return value.replace(RegExp(placeholder, 'gm'), '')\n  }\n}\n\nexport default MultiInputMask\n\nMultiInputMask._formElement = true\nMultiInputMask._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/input-masked/style/dnb-input-masked.css

@@ -44,6 +44,9 @@
 .dnb-multi-input-mask__input.dnb-input__input:last-of-type {
   padding-right: 0.5rem;
 }
+.dnb-input--medium .dnb-multi-input-mask__input.dnb-input__input, .dnb-input--large .dnb-multi-input-mask__input.dnb-input__input {
+  padding: 0 0.25rem;
+}
 
 .dnb-multi-input-mask {
   width: -moz-fit-content;

package/components/input-masked/style/dnb-input-masked.min.css

@@ -1 +1 @@
-.dnb-input-masked--guide{font-family:var(--font-family-monospace)}.dnb-input-masked input::placeholder{color:inherit}.dnb-multi-input-mask__fieldset{border:none;margin:0;padding:0}.dnb-multi-input-mask__fieldset--horizontal{align-items:baseline;display:inline-flex;flex-flow:row wrap;gap:1rem}.dnb-multi-input-mask__input.dnb-input__input{background:transparent;border:none;display:inline-block;font-family:var(--font-family-monospace);margin:0;outline:none;overflow:visible;padding:0 .125rem;text-align:center;transform:translateY(0);white-space:nowrap;width:auto}.dnb-multi-input-mask__input.dnb-input__input:first-of-type{padding-left:.5rem}.dnb-multi-input-mask__input.dnb-input__input:last-of-type{padding-right:.5rem}.dnb-multi-input-mask{width:-moz-fit-content;width:fit-content}.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__delimiter,.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__input{color:var(--color-black-55)}.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__delimiter--highlight,.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__input--highlight{color:var(--color-black)}.dnb-multi-input-mask .dnb-input__shell:focus-within{box-shadow:0 0 0 var(--input-border-width--focus) var(--input-border-color--hover)}.dnb-multi-input-mask__legend--horizontal.dnb-form-label{display:contents}.dnb-multi-input-mask__legend:not([disabled]):hover~.dnb-multi-input-mask .dnb-input__shell{box-shadow:0 0 0 var(--input-border-width--focus) var(--input-border-color--hover)}
+.dnb-input-masked--guide{font-family:var(--font-family-monospace)}.dnb-input-masked input::placeholder{color:inherit}.dnb-multi-input-mask__fieldset{border:none;margin:0;padding:0}.dnb-multi-input-mask__fieldset--horizontal{align-items:baseline;display:inline-flex;flex-flow:row wrap;gap:1rem}.dnb-multi-input-mask__input.dnb-input__input{background:transparent;border:none;display:inline-block;font-family:var(--font-family-monospace);margin:0;outline:none;overflow:visible;padding:0 .125rem;text-align:center;transform:translateY(0);white-space:nowrap;width:auto}.dnb-multi-input-mask__input.dnb-input__input:first-of-type{padding-left:.5rem}.dnb-multi-input-mask__input.dnb-input__input:last-of-type{padding-right:.5rem}.dnb-input--large .dnb-multi-input-mask__input.dnb-input__input,.dnb-input--medium .dnb-multi-input-mask__input.dnb-input__input{padding:0 .25rem}.dnb-multi-input-mask{width:-moz-fit-content;width:fit-content}.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__delimiter,.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__input{color:var(--color-black-55)}.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__delimiter--highlight,.dnb-multi-input-mask:not(.dnb-input__status--error) .dnb-multi-input-mask__input--highlight{color:var(--color-black)}.dnb-multi-input-mask .dnb-input__shell:focus-within{box-shadow:0 0 0 var(--input-border-width--focus) var(--input-border-color--hover)}.dnb-multi-input-mask__legend--horizontal.dnb-form-label{display:contents}.dnb-multi-input-mask__legend:not([disabled]):hover~.dnb-multi-input-mask .dnb-input__shell{box-shadow:0 0 0 var(--input-border-width--focus) var(--input-border-color--hover)}

package/components/input-masked/style/dnb-input-masked.scss

@@ -56,6 +56,11 @@
   &:last-of-type {
     padding-right: 0.5rem;
   }
+
+  .dnb-input--medium &,
+  .dnb-input--large & {
+    padding: 0 0.25rem;
+  }
 }
 
 .dnb-multi-input-mask {

package/components/number-format/NumberFormat.d.ts

@@ -46,7 +46,7 @@ export type NumberFormatProps = {
    */
   currency?: NumberFormatCurrency;
   /**
-   * Use either empty/false to hide the sign/name or use `code` (NOK), `name` (norske kroner) , `symbol` (kr) or `narrowSymbol` (for a shorter symbol variant). Defaults to `narrowSymbol` when the locale is `no` else we default to `code`.
+   * Use either empty/false to hide the sign/name or use `code` (NOK), `name` (kroner) , `symbol` (kr) or `narrowSymbol` (for a shorter symbol variant). Defaults to `narrowSymbol` when the locale is `no` else we default to `code`.
    */
   currency_display?:
     | 'code'

package/components/number-format/NumberUtils.js

@@ -144,7 +144,7 @@ export const format = function (value) {
         let {
           value
         } = _ref;
-        return currencySuffix = value.trim();
+        return currencySuffix = alignCurrencySymbol(value.trim(), currency_display);
       }, currency_position);
     }
     display = formatNumber(cleanedNumber, locale, opts, formatter);
@@ -294,6 +294,12 @@ const prepareMinus = (display, locale) => {
   }
   return display;
 };
+function alignCurrencySymbol(output, currencyDisplay) {
+  if (currencyDisplay === 'name') {
+    output = output.replace(/(nor[^\s]+?)\s(\w+)/i, '$2');
+  }
+  return output;
+}
 const enhanceSR = (value, aria, locale) => {
   if (IS_MAC && Math.abs(parseFloat(value)) <= 99999) {
     aria = String(aria).replace(/\s([0-9])/g, '$1');
@@ -313,7 +319,7 @@ export const formatNumber = function (number, locale) {
       formatter = getGroupFormatter(locale, null, formatter);
     }
     if (formatter) {
-      return replaceNaNWithDash(formatToParts({
+      number = formatToParts({
         number,
         locale,
         options
@@ -322,14 +328,14 @@ export const formatNumber = function (number, locale) {
           value
         } = _ref2;
         return acc + value;
-      }, ''));
+      }, '');
     } else if (typeof Number !== 'undefined' && typeof Number.toLocaleString === 'function') {
-      return replaceNaNWithDash(parseFloat(number).toLocaleString(locale, options));
+      number = parseFloat(number).toLocaleString(locale, options);
     }
   } catch (e) {
     warn(`Number could not be formatted: ${JSON.stringify([number, locale, options])}`, e);
   }
-  return replaceNaNWithDash(number);
+  return replaceNaNWithDash(alignCurrencySymbol(number, options.currencyDisplay));
 };
 function replaceNaNWithDash(number) {
   return String(number).replace(/NaN/, '–');
@@ -596,11 +602,11 @@ export function useCopyWithNotice() {
 }
 export function getFallbackCurrencyDisplay() {
   let locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-  let currency_display = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  if (!currency_display && (!locale || /(no|nb|nn)$/i.test(locale))) {
-    currency_display = 'narrowSymbol';
+  let currencyDisplay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+  if (!currencyDisplay && (!locale || /(no|nb|nn)$/i.test(locale))) {
+    currencyDisplay = 'narrowSymbol';
   }
-  return currency_display || CURRENCY_DISPLAY;
+  return currencyDisplay || CURRENCY_DISPLAY;
 }
 export function getDecimalSeparator() {
   var _formatToParts$find;
@@ -634,24 +640,26 @@ export function getCurrencySymbol() {
   var _formatToParts$find2;
   let locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
   let currency = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  let currencyDisplay = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  let display = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  let number = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 2;
   if (!currency) {
     currency = CURRENCY;
   }
-  return ((_formatToParts$find2 = formatToParts({
-    number: 1,
+  const currencyDisplay = getFallbackCurrencyDisplay(locale, display);
+  return alignCurrencySymbol(((_formatToParts$find2 = formatToParts({
+    number,
     locale,
     options: {
       style: 'currency',
       currency,
-      currencyDisplay: getFallbackCurrencyDisplay(locale, currencyDisplay)
+      currencyDisplay
     }
   }).find(_ref6 => {
     let {
       type
     } = _ref6;
     return type === 'currency';
-  })) === null || _formatToParts$find2 === void 0 ? void 0 : _formatToParts$find2.value) || currency;
+  })) === null || _formatToParts$find2 === void 0 ? void 0 : _formatToParts$find2.value) || currency, currencyDisplay);
 }
 function getGroupFormatter() {
   let locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;