@dnb/eufemia 10.20.0 → 10.22.0

package/es/components/input/InputPassword.js

@@ -1,84 +1,6 @@
-"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 PropTypes from 'prop-types';
-import classnames from 'classnames';
-import Context from '../../shared/Context';
-import Input, { SubmitButton } from './Input';
-import { pickFormElementProps } from '../../shared/helpers/filterValidProps';
-import { makeUniqueId, extendPropsWithContextInClassComponent, convertStatusToStateOnly, combineDescribedBy, dispatchCustomElementEvent } from '../../shared/component-helper';
-import IconView from '../../icons/view';
-import IconViewOff from '../../icons/hide';
-import IconViewMedium from '../../icons/view_medium';
-import IconViewOffMedium from '../../icons/hide_medium';
-export default class InputPassword extends React.PureComponent {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "state", {
-      hidden: true
-    });
-    _defineProperty(this, "toggleVisibility", event => {
-      const hidden = this.state.hidden;
-      this.setState({
-        hidden: !hidden
-      }, () => {
-        if (this._ref.current) {
-          this._ref.current.focus();
-        }
-      });
-      dispatchCustomElementEvent(this, hidden ? 'on_show_password' : 'on_hide_password', {
-        event
-      });
-    });
-    this._id = props.id || makeUniqueId();
-    this._ref = props.inner_ref || React.createRef();
-  }
-  render() {
-    var _this$context, _this$context2, _this$context3;
-    const props = extendPropsWithContextInClassComponent(this.props, InputPassword.defaultProps, {
-      skeleton: (_this$context = this.context) === null || _this$context === void 0 ? void 0 : _this$context.skeleton
-    }, this.context.getTranslation(this.props).Input, pickFormElementProps((_this$context2 = this.context) === null || _this$context2 === void 0 ? void 0 : _this$context2.FormRow), pickFormElementProps((_this$context3 = this.context) === null || _this$context3 === void 0 ? void 0 : _this$context3.formElement), this.context.Input, this.context.InputPassword);
-    const id = this._id;
-    const params = {
-      id
-    };
-    params['aria-describedby'] = combineDescribedBy(this.props, id + '-submit-button');
-    return React.createElement(Input, _extends({}, this.props, params, {
-      className: classnames('dnb-input--password', this.props.className),
-      type: this.state.hidden ? 'password' : 'text',
-      inner_ref: this._ref,
-      submit_element: React.createElement(SubmitButton, {
-        id: id + '-submit-button',
-        type: "button",
-        variant: "secondary",
-        "aria-controls": id,
-        "aria-label": this.state.hidden ? props.show_password : props.hide_password,
-        icon: props.size === 'large' ? this.state.hidden ? IconViewMedium : IconViewOffMedium : this.state.hidden ? IconView : IconViewOff,
-        skeleton: props.skeleton,
-        status: convertStatusToStateOnly(props.status, props.status_state),
-        status_state: props.status_state,
-        onClick: this.toggleVisibility
-      })
-    }));
-  }
-}
-_defineProperty(InputPassword, "contextType", Context);
-_defineProperty(InputPassword, "defaultProps", _objectSpread({
-  show_password: null,
-  hide_password: null,
-  on_show_password: null,
-  on_hide_password: null
-}, Input.defaultProps));
-process.env.NODE_ENV !== "production" ? InputPassword.propTypes = _objectSpread({
-  show_password: PropTypes.string,
-  hide_password: PropTypes.string,
-  on_show_password: PropTypes.func,
-  on_hide_password: PropTypes.func
-}, Input.propTypes) : void 0;
+import Password from '../../extensions/forms/Field/Password';
+const InputPassword = Password;
+export default InputPassword;
 InputPassword._formElement = true;
 InputPassword._supportsSpacingProps = true;
 //# sourceMappingURL=InputPassword.js.map

package/es/components/input/InputPassword.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputPassword.js","names":["React","PropTypes","classnames","Context","Input","SubmitButton","pickFormElementProps","makeUniqueId","extendPropsWithContextInClassComponent","convertStatusToStateOnly","combineDescribedBy","dispatchCustomElementEvent","IconView","IconViewOff","IconViewMedium","IconViewOffMedium","InputPassword","PureComponent","constructor","props","_defineProperty","hidden","event","state","setState","_ref","current","focus","_id","id","inner_ref","createRef","render","_this$context","_this$context2","_this$context3","defaultProps","skeleton","context","getTranslation","FormRow","formElement","params","createElement","_extends","className","type","submit_element","variant","show_password","hide_password","icon","size","status","status_state","onClick","toggleVisibility","_objectSpread","on_show_password","on_hide_password","process","env","NODE_ENV","propTypes","string","func","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input/InputPassword.js"],"sourcesContent":["/**\n * Web Input Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\n\nimport Input, { SubmitButton } from './Input'\nimport { pickFormElementProps } from '../../shared/helpers/filterValidProps'\nimport {\n  makeUniqueId,\n  extendPropsWithContextInClassComponent,\n  convertStatusToStateOnly,\n  combineDescribedBy,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport IconView from '../../icons/view'\nimport IconViewOff from '../../icons/hide'\nimport IconViewMedium from '../../icons/view_medium'\nimport IconViewOffMedium from '../../icons/hide_medium'\n\nexport default class InputPassword extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    show_password: PropTypes.string,\n    hide_password: PropTypes.string,\n    on_show_password: PropTypes.func,\n    on_hide_password: PropTypes.func,\n    ...Input.propTypes,\n  }\n  static defaultProps = {\n    show_password: null,\n    hide_password: null,\n    on_show_password: null,\n    on_hide_password: null,\n    ...Input.defaultProps,\n  }\n\n  state = { hidden: true }\n\n  constructor(props) {\n    super(props)\n\n    this._id = props.id || makeUniqueId() // cause we need an id anyway\n    this._ref = props.inner_ref || React.createRef()\n  }\n\n  toggleVisibility = (event) => {\n    const hidden = this.state.hidden\n    this.setState(\n      {\n        hidden: !hidden,\n      },\n      () => {\n        if (this._ref.current) {\n          this._ref.current.focus()\n        }\n      }\n    )\n\n    dispatchCustomElementEvent(\n      this,\n      hidden ? 'on_show_password' : 'on_hide_password',\n      { event }\n    )\n  }\n\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      InputPassword.defaultProps,\n      { skeleton: this.context?.skeleton },\n      this.context.getTranslation(this.props).Input,\n      // Deprecated – can be removed in v11\n      pickFormElementProps(this.context?.FormRow),\n      pickFormElementProps(this.context?.formElement),\n      this.context.Input,\n      this.context.InputPassword\n    )\n\n    const id = this._id\n    const params = { id }\n    params['aria-describedby'] = combineDescribedBy(\n      this.props,\n      id + '-submit-button'\n    )\n\n    return (\n      <Input\n        {...this.props}\n        {...params}\n        className={classnames('dnb-input--password', this.props.className)}\n        type={this.state.hidden ? 'password' : 'text'}\n        inner_ref={this._ref}\n        submit_element={\n          <SubmitButton\n            id={id + '-submit-button'}\n            type=\"button\"\n            variant=\"secondary\"\n            aria-controls={id}\n            aria-label={\n              this.state.hidden ? props.show_password : props.hide_password\n            }\n            icon={\n              props.size === 'large'\n                ? this.state.hidden\n                  ? IconViewMedium\n                  : IconViewOffMedium\n                : this.state.hidden\n                ? IconView\n                : IconViewOff\n            }\n            skeleton={props.skeleton}\n            status={convertStatusToStateOnly(\n              props.status,\n              props.status_state\n            )}\n            status_state={props.status_state}\n            onClick={this.toggleVisibility}\n          />\n        }\n      />\n    )\n  }\n}\n\nInputPassword._formElement = true\nInputPassword._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"InputPassword.js","names":["Password","InputPassword","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input/InputPassword.js"],"sourcesContent":["/**\n * Web Input Component\n *\n */\n\nimport Password from '../../extensions/forms/Field/Password'\n\n/**\n * @deprecated in v11, use `Field.Password instead.`\n */\nconst InputPassword = Password\n\nexport default InputPassword\n\nInputPassword._formElement = true\nInputPassword._supportsSpacingProps = true\n"],"mappings":"AAKA,OAAOA,QAAQ,MAAM,uCAAuC;AAK5D,MAAMC,aAAa,GAAGD,QAAQ;AAE9B,eAAeC,aAAa;AAE5BA,aAAa,CAACC,YAAY,GAAG,IAAI;AACjCD,aAAa,CAACE,qBAAqB,GAAG,IAAI"}

package/es/components/input-masked/InputMasked.d.ts

@@ -51,7 +51,7 @@ export interface InputMaskedProps
   extends Omit<React.HTMLProps<HTMLElement>, 'ref'>,
     SpacingProps {
   /**
-   * A mask can be defined both as a <a href="https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#readme">RegExp style of characters</a> or a callback function. Example below.
+   * 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.
    */
   mask?: InputMaskedMask;
   /**
@@ -59,7 +59,7 @@ export interface InputMaskedProps
    */
   number_mask?: InputMaskedNumberMask;
   /**
-   * Set to `true` or set the <em>valuta</em> (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`.
+   * 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`.
    */
   currency_mask?: InputMaskedCurrencyMask;
   /**
@@ -67,11 +67,11 @@ export interface InputMaskedProps
    */
   mask_options?: InputMaskedMaskOptions;
   /**
-   * Use an object with <a href="/uilib/components/number-format/properties">NumberFormat</a> e.g. `{ omit_rounding: false }`.
+   * Use an object with [NumberFormat](/uilib/components/number-format/properties) e.g. `{ omit_rounding: false }`.
    */
   number_format?: NumberFormatProps;
   /**
-   * Define the locale to be used in the `as_number` or `as_currency` masked. It will be inherited from the <a href="/uilib/usage/customisation/provider">Eufemia Provider</a> if not given. Defaults to `nb-NO`.
+   * 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`.
    */
   locale?: Locale;
   /**
@@ -91,7 +91,7 @@ export interface InputMaskedProps
    */
   show_mask?: boolean;
   /**
-   * When `false` is given, it doesn&#39;t print out placeholder characters and only adds mask characters when the user reaches them as they&#39;re typing. Defaults to `true`.
+   * 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`.
    */
   show_guide?: boolean;
   pipe?: (...args: any[]) => any;
@@ -103,9 +103,6 @@ export interface InputMaskedProps
    * The placeholder character represents the fillable spot in the mask (e.g. `_`). Defaults to invisible space.
    */
   placeholder_char?: string;
-  /**
-   * By providing a React.ref we can get the internally used input element (DOM). E.g. `inner_ref={myRef}` by using `React.createRef()` or `React.useRef()`.
-   */
   inner_ref?: React.Ref;
   /**
    * Will be called on value changes made by the user. Returns an object with the value as a string and the native event: `{ value, event }`.
@@ -125,127 +122,43 @@ export interface InputMaskedProps
   on_blur?: (...args: any[]) => any;
   on_submit_focus?: (...args: any[]) => any;
   on_submit_blur?: (...args: any[]) => any;
-  /**
-   * Choose between `text`, `number`, `email`, `password`, `url`, `tel` and `search`.
-   */
   type?: string;
-  /**
-   * The sizes you can choose is `small` (1.5rem), `default` (2rem), `medium` (2.5rem) and `large` (3rem) are supported component sizes. Defaults to `default` / `null`. Also, if you define a number like `size="2"` then it will be forwarded as the input element attribute.
-   */
   size?: InputSize;
-  /**
-   * The content value of the input.
-   */
   value?: InputMaskedValue;
   id?: string;
-  /**
-   * Prepends the Form Label component. If no ID is provided, a random ID is created.
-   */
   label?: FormLabelText;
-  /**
-   * Use `label_direction="vertical"` to change the label layout direction. Defaults to `horizontal`.
-   */
   label_direction?: FormLabelLabelDirection;
-  /**
-   * Use `true` to make the label only readable by screen readers.
-   */
   label_sr_only?: boolean;
-  /**
-   * 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.
-   */
   status?: FormStatusText;
-  /**
-   * Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.
-   */
   status_state?: FormStatusState;
-  /**
-   * Use an object to define additional FormStatus properties.
-   */
   status_props?: FormStatusProps;
   status_no_animation?: boolean;
-  /**
-   * Defines a custom visual state of the input. Use it only if you have to simulate a custom state. Currently are three statuses `virgin` , `focus` and `dirty`. Defaults to `null`.
-   */
   input_state?: string;
-  /**
-   * The <a href="/uilib/components/global-status/properties/#configuration-object">configuration</a> used for the target <a href="/uilib/components/global-status">GlobalStatus</a>.
-   */
   globalStatus?: GlobalStatusConfigObject;
-  /**
-   * Defaults to `off`. Set to `on` or any of <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete">allowed `attributes`</a>. Keep in mind, 1. you may have to define a `name`, 2. have the input as a descendant of a `<form>` element, 3. and have a submit button inside the form.
-   */
   autocomplete?: string;
-  /**
-   * Title attribute for the search icon. Only relevant if search input.
-   */
   submit_button_title?: string;
   clear_button_title?: string;
-  /**
-   * The placeholder which shows up once the input value is empty
-   */
   placeholder?: string;
-  /**
-   * If set to `true`, then a clear button will be shown which lets the user clear any given input value.
-   */
   clear?: boolean;
-  /**
-   * Set to `true` in case the `placeholder` has to be kept during focus. By default, the placeholder disappears on focus.
-   */
   keep_placeholder?: boolean;
   /**
-   * 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.
+   * (string): What to display after the amount. Defaults to an empty string.
    */
   suffix?: InputMaskedSuffix;
-  /**
-   * Defines the text alignment of the input. Can be `left`, `right` or `center`. Defaults to `left`.
-   */
   align?: InputMaskedAlign;
-  /**
-   * If set to `true`, then the whole input value gets selected on the entry focus. A second click will place the cursor on the wanted position.
-   */
   selectall?: boolean;
-  /**
-   * If set to `true`, then the input field will be 100% in `width`.
-   */
   stretch?: boolean;
   disabled?: boolean;
-  /**
-   * If set to `true`, an overlaying skeleton with animation will be shown.
-   */
   skeleton?: SkeletonShow;
   class?: string;
-  /**
-   * In case we have to set a custom input class.
-   */
   input_class?: string;
-  /**
-   * Provide the Input element with any attributes by using an Object `input_attributes={{size:&#39;2&#39;}}` or a JSON Object `input_attributes=&#39;{"size":"2"}&#39;`. "NB:" Keep in mind, that also every not listed component property will be sent along and set as an Input element attribute.
-   */
   input_attributes?: InputInputAttributes;
-  /**
-   * <em>(internal)</em> by providing a new component we can change the internally used element. Also supports a string only, like `input_element="input"`.
-   */
   input_element?: InputInputElement;
-  /**
-   * Icon to show before or after the input / placeholder. Can be either a string defining a primary icon or a Component using an SVG icon of either 16px or 24px.
-   */
   icon?: IconIcon;
-  /**
-   * The icon size of the icon shows. Defaults to `medium`.
-   */
   icon_size?: IconSize;
-  /**
-   * Defines the position of icon inside the input. Set to `left` or `right`. Defaults to `left` if not set.
-   */
   icon_position?: ButtonIconPosition;
   readOnly?: boolean;
-  /**
-   * <em>(internal)</em> by providing a new component to be rendered inside the "shell" – we can add a freely customizable internal element. Used by the Autocomplete component.
-   */
   inner_element?: React.ReactNode;
-  /**
-   * Accepts a React element which will show up like the "submit button" would do on `type="search"`.
-   */
   submit_element?: InputMaskedSubmitElement;
   submit_button_variant?: any;
   submit_button_icon?: InputMaskedSubmitButtonIcon;

package/es/components/input-masked/InputMasked.js

@@ -21,7 +21,9 @@ const InputMasked = props => {
       }
     }
   }
-  const contextAndProps = React.useCallback(extendPropsWithContext(props, InputMasked.defaultProps, context === null || context === void 0 ? void 0 : context.InputMasked), [props, InputMasked.defaultProps, context === null || context === void 0 ? void 0 : context.InputMasked]);
+  const contextAndProps = React.useMemo(() => {
+    return extendPropsWithContext(props, InputMasked.defaultProps, context === null || context === void 0 ? void 0 : context.InputMasked);
+  }, [context === null || context === void 0 ? void 0 : context.InputMasked, props]);
   return React.createElement(InputMaskedContext.Provider, {
     value: {
       props: contextAndProps,

package/es/components/input-masked/InputMasked.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputMasked.js","names":["React","PropTypes","extendPropsWithContext","InputMaskedContext","InputMaskedElement","Input","inputPropTypes","Context","InputMasked","props","context","useContext","mask","alias","key","test","contextAndProps","useCallback","defaultProps","createElement","Provider","value","_InputMaskedElement","process","env","NODE_ENV","propTypes","_objectSpread","oneOfType","object","array","func","number_mask","string","bool","currency_mask","mask_options","number_format","locale","as_currency","as_number","as_percent","show_mask","show_guide","pipe","keep_char_positions","placeholder_char","inner_ref","on_change","on_submit","on_focus","on_blur","on_submit_focus","on_submit_blur","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input-masked/InputMasked.js"],"sourcesContent":["/* eslint-disable react/no-unused-prop-types */\n/**\n * Web InputMasked Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport InputMaskedContext from './InputMaskedContext'\nimport InputMaskedElement from './InputMaskedElement'\nimport Input, { inputPropTypes } from '../input/Input'\nimport Context from '../../shared/Context'\n\nconst InputMasked = (props) => {\n  const context = React.useContext(Context)\n\n  // Remove masks defined in Provider/Context, because it overwrites a custom mask\n  if (props?.mask) {\n    const alias = context?.InputMasked\n    for (const key in alias) {\n      if (/^as[_A-Z]|number_mask|currency_mask/.test(key)) {\n        delete alias[key]\n      }\n    }\n  }\n\n  const contextAndProps = React.useCallback(\n    extendPropsWithContext(\n      props,\n      InputMasked.defaultProps,\n      context?.InputMasked\n    ),\n    [props, InputMasked.defaultProps, context?.InputMasked]\n  )\n\n  return (\n    <InputMaskedContext.Provider\n      value={{\n        props: contextAndProps,\n        context,\n      }}\n    >\n      <InputMaskedElement />\n    </InputMaskedContext.Provider>\n  )\n}\n\nInputMasked.propTypes = {\n  mask: PropTypes.oneOfType([\n    PropTypes.object,\n    PropTypes.array,\n    PropTypes.func,\n  ]),\n  number_mask: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.object,\n  ]),\n  currency_mask: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.object,\n  ]),\n  mask_options: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n  number_format: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n  locale: PropTypes.string,\n  as_currency: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  as_number: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  as_percent: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  show_mask: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  show_guide: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  pipe: PropTypes.func,\n  keep_char_positions: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n  ]),\n  placeholder_char: PropTypes.string,\n  inner_ref: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n  on_change: PropTypes.func,\n  on_submit: PropTypes.func,\n  on_focus: PropTypes.func,\n  on_blur: PropTypes.func,\n  on_submit_focus: PropTypes.func,\n  on_submit_blur: PropTypes.func,\n\n  ...inputPropTypes,\n}\n\nInputMasked.defaultProps = {\n  ...Input.defaultProps,\n\n  mask: null,\n  number_mask: null,\n  currency_mask: null,\n  mask_options: null,\n  number_format: null,\n  as_currency: null,\n  as_number: null,\n  as_percent: null,\n  locale: null,\n  show_mask: false,\n  show_guide: true,\n  pipe: null,\n  keep_char_positions: false,\n  placeholder_char: null,\n  inner_ref: null,\n\n  on_change: null,\n  on_submit: null,\n  on_focus: null,\n  on_blur: null,\n  on_submit_focus: null,\n  on_submit_blur: null,\n}\n\nInputMasked._formElement = true\nInputMasked._supportsSpacingProps = true\n\nexport default InputMasked\n"],"mappings":";;;;;;AAMA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,sBAAsB,QAAQ,+BAA+B;AACtE,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,OAAOC,KAAK,IAAIC,cAAc,QAAQ,gBAAgB;AACtD,OAAOC,OAAO,MAAM,sBAAsB;AAE1C,MAAMC,WAAW,GAAIC,KAAK,IAAK;EAC7B,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAACJ,OAAO,CAAC;EAGzC,IAAIE,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEG,IAAI,EAAE;IACf,MAAMC,KAAK,GAAGH,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WAAW;IAClC,KAAK,MAAMM,GAAG,IAAID,KAAK,EAAE;MACvB,IAAI,qCAAqC,CAACE,IAAI,CAACD,GAAG,CAAC,EAAE;QACnD,OAAOD,KAAK,CAACC,GAAG,CAAC;MACnB;IACF;EACF;EAEA,MAAME,eAAe,GAAGhB,KAAK,CAACiB,WAAW,CACvCf,sBAAsB,CACpBO,KAAK,EACLD,WAAW,CAACU,YAAY,EACxBR,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WACX,CAAC,EACD,CAACC,KAAK,EAAED,WAAW,CAACU,YAAY,EAAER,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WAAW,CACxD,CAAC;EAED,OACER,KAAA,CAAAmB,aAAA,CAAChB,kBAAkB,CAACiB,QAAQ;IAC1BC,KAAK,EAAE;MACLZ,KAAK,EAAEO,eAAe;MACtBN;IACF;EAAE,GAAAY,mBAAA,KAAAA,mBAAA,GAEFtB,KAAA,CAAAmB,aAAA,CAACf,kBAAkB,MAAE,CAAC,CACK,CAAC;AAElC,CAAC;AAEDmB,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAAjB,WAAW,CAACkB,SAAS,GAAAC,aAAA;EACnBf,IAAI,EAAEX,SAAS,CAAC2B,SAAS,CAAC,CACxB3B,SAAS,CAAC4B,MAAM,EAChB5B,SAAS,CAAC6B,KAAK,EACf7B,SAAS,CAAC8B,IAAI,CACf,CAAC;EACFC,WAAW,EAAE/B,SAAS,CAAC2B,SAAS,CAAC,CAC/B3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,EACdjC,SAAS,CAAC4B,MAAM,CACjB,CAAC;EACFM,aAAa,EAAElC,SAAS,CAAC2B,SAAS,CAAC,CACjC3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,EACdjC,SAAS,CAAC4B,MAAM,CACjB,CAAC;EACFO,YAAY,EAAEnC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAAC4B,MAAM,CAAC,CAAC;EACvEQ,aAAa,EAAEpC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAAC4B,MAAM,CAAC,CAAC;EACxES,MAAM,EAAErC,SAAS,CAACgC,MAAM;EACxBM,WAAW,EAAEtC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACpEM,SAAS,EAAEvC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EAClEO,UAAU,EAAExC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACnEQ,SAAS,EAAEzC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EAClES,UAAU,EAAE1C,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACnEU,IAAI,EAAE3C,SAAS,CAAC8B,IAAI;EACpBc,mBAAmB,EAAE5C,SAAS,CAAC2B,SAAS,CAAC,CACvC3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,CACf,CAAC;EACFY,gBAAgB,EAAE7C,SAAS,CAACgC,MAAM;EAClCc,SAAS,EAAE9C,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAAC4B,MAAM,EAAE5B,SAAS,CAAC8B,IAAI,CAAC,CAAC;EAElEiB,SAAS,EAAE/C,SAAS,CAAC8B,IAAI;EACzBkB,SAAS,EAAEhD,SAAS,CAAC8B,IAAI;EACzBmB,QAAQ,EAAEjD,SAAS,CAAC8B,IAAI;EACxBoB,OAAO,EAAElD,SAAS,CAAC8B,IAAI;EACvBqB,eAAe,EAAEnD,SAAS,CAAC8B,IAAI;EAC/BsB,cAAc,EAAEpD,SAAS,CAAC8B;AAAI,GAE3BzB,cAAc,CAClB;AAEDE,WAAW,CAACU,YAAY,GAAAS,aAAA,CAAAA,aAAA,KACnBtB,KAAK,CAACa,YAAY;EAErBN,IAAI,EAAE,IAAI;EACVoB,WAAW,EAAE,IAAI;EACjBG,aAAa,EAAE,IAAI;EACnBC,YAAY,EAAE,IAAI;EAClBC,aAAa,EAAE,IAAI;EACnBE,WAAW,EAAE,IAAI;EACjBC,SAAS,EAAE,IAAI;EACfC,UAAU,EAAE,IAAI;EAChBH,MAAM,EAAE,IAAI;EACZI,SAAS,EAAE,KAAK;EAChBC,UAAU,EAAE,IAAI;EAChBC,IAAI,EAAE,IAAI;EACVC,mBAAmB,EAAE,KAAK;EAC1BC,gBAAgB,EAAE,IAAI;EACtBC,SAAS,EAAE,IAAI;EAEfC,SAAS,EAAE,IAAI;EACfC,SAAS,EAAE,IAAI;EACfC,QAAQ,EAAE,IAAI;EACdC,OAAO,EAAE,IAAI;EACbC,eAAe,EAAE,IAAI;EACrBC,cAAc,EAAE;AAAI,EACrB;AAED7C,WAAW,CAAC8C,YAAY,GAAG,IAAI;AAC/B9C,WAAW,CAAC+C,qBAAqB,GAAG,IAAI;AAExC,eAAe/C,WAAW"}
+{"version":3,"file":"InputMasked.js","names":["React","PropTypes","extendPropsWithContext","InputMaskedContext","InputMaskedElement","Input","inputPropTypes","Context","InputMasked","props","context","useContext","mask","alias","key","test","contextAndProps","useMemo","defaultProps","createElement","Provider","value","_InputMaskedElement","process","env","NODE_ENV","propTypes","_objectSpread","oneOfType","object","array","func","number_mask","string","bool","currency_mask","mask_options","number_format","locale","as_currency","as_number","as_percent","show_mask","show_guide","pipe","keep_char_positions","placeholder_char","inner_ref","on_change","on_submit","on_focus","on_blur","on_submit_focus","on_submit_blur","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/input-masked/InputMasked.js"],"sourcesContent":["/* eslint-disable react/no-unused-prop-types */\n/**\n * Web InputMasked Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport InputMaskedContext from './InputMaskedContext'\nimport InputMaskedElement from './InputMaskedElement'\nimport Input, { inputPropTypes } from '../input/Input'\nimport Context from '../../shared/Context'\n\nconst InputMasked = (props) => {\n  const context = React.useContext(Context)\n\n  // Remove masks defined in Provider/Context, because it overwrites a custom mask\n  if (props?.mask) {\n    const alias = context?.InputMasked\n    for (const key in alias) {\n      if (/^as[_A-Z]|number_mask|currency_mask/.test(key)) {\n        delete alias[key]\n      }\n    }\n  }\n\n  const contextAndProps = React.useMemo(() => {\n    return extendPropsWithContext(\n      props,\n      InputMasked.defaultProps,\n      context?.InputMasked\n    )\n  }, [context?.InputMasked, props])\n\n  return (\n    <InputMaskedContext.Provider\n      value={{\n        props: contextAndProps,\n        context,\n      }}\n    >\n      <InputMaskedElement />\n    </InputMaskedContext.Provider>\n  )\n}\n\nInputMasked.propTypes = {\n  mask: PropTypes.oneOfType([\n    PropTypes.object,\n    PropTypes.array,\n    PropTypes.func,\n  ]),\n  number_mask: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.object,\n  ]),\n  currency_mask: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n    PropTypes.object,\n  ]),\n  mask_options: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n  number_format: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n  locale: PropTypes.string,\n  as_currency: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  as_number: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  as_percent: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  show_mask: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  show_guide: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n  pipe: PropTypes.func,\n  keep_char_positions: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.bool,\n  ]),\n  placeholder_char: PropTypes.string,\n  inner_ref: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n  on_change: PropTypes.func,\n  on_submit: PropTypes.func,\n  on_focus: PropTypes.func,\n  on_blur: PropTypes.func,\n  on_submit_focus: PropTypes.func,\n  on_submit_blur: PropTypes.func,\n\n  ...inputPropTypes,\n}\n\nInputMasked.defaultProps = {\n  ...Input.defaultProps,\n\n  mask: null,\n  number_mask: null,\n  currency_mask: null,\n  mask_options: null,\n  number_format: null,\n  as_currency: null,\n  as_number: null,\n  as_percent: null,\n  locale: null,\n  show_mask: false,\n  show_guide: true,\n  pipe: null,\n  keep_char_positions: false,\n  placeholder_char: null,\n  inner_ref: null,\n\n  on_change: null,\n  on_submit: null,\n  on_focus: null,\n  on_blur: null,\n  on_submit_focus: null,\n  on_submit_blur: null,\n}\n\nInputMasked._formElement = true\nInputMasked._supportsSpacingProps = true\n\nexport default InputMasked\n"],"mappings":";;;;;;AAMA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,SAASC,sBAAsB,QAAQ,+BAA+B;AACtE,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,OAAOC,kBAAkB,MAAM,sBAAsB;AACrD,OAAOC,KAAK,IAAIC,cAAc,QAAQ,gBAAgB;AACtD,OAAOC,OAAO,MAAM,sBAAsB;AAE1C,MAAMC,WAAW,GAAIC,KAAK,IAAK;EAC7B,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAACJ,OAAO,CAAC;EAGzC,IAAIE,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEG,IAAI,EAAE;IACf,MAAMC,KAAK,GAAGH,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WAAW;IAClC,KAAK,MAAMM,GAAG,IAAID,KAAK,EAAE;MACvB,IAAI,qCAAqC,CAACE,IAAI,CAACD,GAAG,CAAC,EAAE;QACnD,OAAOD,KAAK,CAACC,GAAG,CAAC;MACnB;IACF;EACF;EAEA,MAAME,eAAe,GAAGhB,KAAK,CAACiB,OAAO,CAAC,MAAM;IAC1C,OAAOf,sBAAsB,CAC3BO,KAAK,EACLD,WAAW,CAACU,YAAY,EACxBR,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WACX,CAAC;EACH,CAAC,EAAE,CAACE,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEF,WAAW,EAAEC,KAAK,CAAC,CAAC;EAEjC,OACET,KAAA,CAAAmB,aAAA,CAAChB,kBAAkB,CAACiB,QAAQ;IAC1BC,KAAK,EAAE;MACLZ,KAAK,EAAEO,eAAe;MACtBN;IACF;EAAE,GAAAY,mBAAA,KAAAA,mBAAA,GAEFtB,KAAA,CAAAmB,aAAA,CAACf,kBAAkB,MAAE,CAAC,CACK,CAAC;AAElC,CAAC;AAEDmB,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAAjB,WAAW,CAACkB,SAAS,GAAAC,aAAA;EACnBf,IAAI,EAAEX,SAAS,CAAC2B,SAAS,CAAC,CACxB3B,SAAS,CAAC4B,MAAM,EAChB5B,SAAS,CAAC6B,KAAK,EACf7B,SAAS,CAAC8B,IAAI,CACf,CAAC;EACFC,WAAW,EAAE/B,SAAS,CAAC2B,SAAS,CAAC,CAC/B3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,EACdjC,SAAS,CAAC4B,MAAM,CACjB,CAAC;EACFM,aAAa,EAAElC,SAAS,CAAC2B,SAAS,CAAC,CACjC3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,EACdjC,SAAS,CAAC4B,MAAM,CACjB,CAAC;EACFO,YAAY,EAAEnC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAAC4B,MAAM,CAAC,CAAC;EACvEQ,aAAa,EAAEpC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAAC4B,MAAM,CAAC,CAAC;EACxES,MAAM,EAAErC,SAAS,CAACgC,MAAM;EACxBM,WAAW,EAAEtC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACpEM,SAAS,EAAEvC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EAClEO,UAAU,EAAExC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACnEQ,SAAS,EAAEzC,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EAClES,UAAU,EAAE1C,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAACgC,MAAM,EAAEhC,SAAS,CAACiC,IAAI,CAAC,CAAC;EACnEU,IAAI,EAAE3C,SAAS,CAAC8B,IAAI;EACpBc,mBAAmB,EAAE5C,SAAS,CAAC2B,SAAS,CAAC,CACvC3B,SAAS,CAACgC,MAAM,EAChBhC,SAAS,CAACiC,IAAI,CACf,CAAC;EACFY,gBAAgB,EAAE7C,SAAS,CAACgC,MAAM;EAClCc,SAAS,EAAE9C,SAAS,CAAC2B,SAAS,CAAC,CAAC3B,SAAS,CAAC4B,MAAM,EAAE5B,SAAS,CAAC8B,IAAI,CAAC,CAAC;EAElEiB,SAAS,EAAE/C,SAAS,CAAC8B,IAAI;EACzBkB,SAAS,EAAEhD,SAAS,CAAC8B,IAAI;EACzBmB,QAAQ,EAAEjD,SAAS,CAAC8B,IAAI;EACxBoB,OAAO,EAAElD,SAAS,CAAC8B,IAAI;EACvBqB,eAAe,EAAEnD,SAAS,CAAC8B,IAAI;EAC/BsB,cAAc,EAAEpD,SAAS,CAAC8B;AAAI,GAE3BzB,cAAc,CAClB;AAEDE,WAAW,CAACU,YAAY,GAAAS,aAAA,CAAAA,aAAA,KACnBtB,KAAK,CAACa,YAAY;EAErBN,IAAI,EAAE,IAAI;EACVoB,WAAW,EAAE,IAAI;EACjBG,aAAa,EAAE,IAAI;EACnBC,YAAY,EAAE,IAAI;EAClBC,aAAa,EAAE,IAAI;EACnBE,WAAW,EAAE,IAAI;EACjBC,SAAS,EAAE,IAAI;EACfC,UAAU,EAAE,IAAI;EAChBH,MAAM,EAAE,IAAI;EACZI,SAAS,EAAE,KAAK;EAChBC,UAAU,EAAE,IAAI;EAChBC,IAAI,EAAE,IAAI;EACVC,mBAAmB,EAAE,KAAK;EAC1BC,gBAAgB,EAAE,IAAI;EACtBC,SAAS,EAAE,IAAI;EAEfC,SAAS,EAAE,IAAI;EACfC,SAAS,EAAE,IAAI;EACfC,QAAQ,EAAE,IAAI;EACdC,OAAO,EAAE,IAAI;EACbC,eAAe,EAAE,IAAI;EACrBC,cAAc,EAAE;AAAI,EACrB;AAED7C,WAAW,CAAC8C,YAAY,GAAG,IAAI;AAC/B9C,WAAW,CAAC+C,qBAAqB,GAAG,IAAI;AAExC,eAAe/C,WAAW"}

package/es/components/input-masked/InputMaskedDocs.d.ts

@@ -0,0 +1,2 @@
+import { PropertiesTableProps } from '../../shared/types';
+export declare const inputMaskedProperties: PropertiesTableProps;

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

@@ -0,0 +1,78 @@
+export const inputMaskedProperties = {
+  as_number: {
+    doc: 'Set to `true` to automatically set a number mask based on the given or inherited locale.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  as_percent: {
+    doc: 'Set to `true` to automatically set a number mask with a percentage sign based on the given or inherited locale.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  as_currency: {
+    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.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  mask_options: {
+    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.',
+    type: 'object',
+    status: 'optional'
+  },
+  number_mask: {
+    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.',
+    type: ['boolean', 'object'],
+    status: 'optional'
+  },
+  currency_mask: {
+    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`.',
+    type: ['boolean', 'object'],
+    status: 'optional'
+  },
+  number_format: {
+    doc: 'Use an object with [NumberFormat](/uilib/components/number-format/properties) e.g. `{ omit_rounding: false }`.',
+    type: 'object',
+    status: 'optional'
+  },
+  locale: {
+    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`.',
+    type: 'string',
+    status: 'optional'
+  },
+  mask: {
+    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.',
+    type: ['RegExp', 'function'],
+    status: 'optional'
+  },
+  show_mask: {
+    doc: 'Show mask when input is empty and has no focus. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  show_guide: {
+    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`.",
+    type: 'boolean',
+    status: 'optional'
+  },
+  placeholder_char: {
+    doc: 'The placeholder character represents the fillable spot in the mask (e.g. `_`). Defaults to invisible space.',
+    type: 'string',
+    status: 'optional'
+  },
+  keep_char_positions: {
+    doc: 'When `true`, adding or deleting characters will not affect the positions of existing characters. Defaults to `false`.',
+    type: 'boolean',
+    status: 'optional'
+  },
+  '[Space](/uilib/layout/space/properties)': {
+    doc: 'Spacing properties like `top` or `bottom` are supported.',
+    type: ['string', 'object'],
+    status: 'optional'
+  },
+  '[Input](/uilib/components/input/properties)': {
+    doc: 'All `Input` properties are supported.',
+    type: 'Various',
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=InputMaskedDocs.js.map

package/es/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/es/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
   }));
@@ -311,7 +312,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);
@@ -330,10 +332,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)
       });
     }
   }