carbon-react/esm/components/decimal/decimal.component.js

A library of reusable React components for easily building user interfaces.

import{jsxs as e,Fragment as t,jsx as n}from"react/jsx-runtime";import r,{useContext as a,useCallback as o,useEffect as l,useState as i}from"react";import u from"invariant";import{Textbox as c}from"../textbox/textbox.component.js";import m from"../../__internal__/i18n-context/index.js";import p from"../../hooks/__internal__/usePrevious/index.js";import s from"../../__internal__/utils/logger/index.js";import g from"../../__internal__/utils/helpers/tags/tags.js";function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function f(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},r=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),r.forEach((function(t){d(e,t,n[t])}))}return e}const h=r.forwardRef(((r,d)=>{var{align:h="right",precision:v=2,inputWidth:y,readOnly:b,onChange:O,onBlur:x,id:_,name:j,allowEmptyValue:w=!1,locale:E,value:P}=r,D=function(e,t){if(null==e)return{};var n,r,a=function(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}(r,["align","precision","inputWidth","readOnly","onChange","onBlur","id","name","allowEmptyValue","locale","value"]);const N=a(m),$=o((e=>{var t;return null===(t=Intl.NumberFormat(E||N.locale()).formatToParts(10000.1).find((t=>t.type===e)))||void 0===t?void 0:t.value}),[N,E]),V=o((e=>Number.isNaN(Number(e))),[]),R=o((e=>{if(V(e))return e;if(""===e||e.match(/\s+/g))return e;const t=$("decimal"),[n,r]=e.split(".");let a=Intl.NumberFormat(E||N.locale(),{maximumFractionDigits:0}).format(+n);return(null==r?void 0:r.length)>v?a+=`${t+r}`:(null==r?void 0:r.length)<=v?a+=`${t+r+"0".repeat(v-r.length)}`:a+=`${v?t+"0".repeat(v):""}`,a}),[$,V,N,E,v]),C=w?"":R((0).toFixed(v)),F=o((e=>(u("string"==typeof e,"Decimal `value` prop must be a string"),e&&!w&&u(""!==e,"Decimal `value` must not be an empty string. Please use `allowEmptyValue` or specify a non-empty initialValue"),e)),[w]),S=p(v);l((()=>{S&&S!==v&&s.error("Decimal `precision` prop has changed value. Changing the Decimal `precision` prop has no effect.")}),[v,S]);const W=o((e=>{const t=new RegExp(`[\\${$("group")} ]*`,"g");return e.replace(t,"")}),[$]),k=o((e=>{var t;const n=(null===(t=$("group"))||void 0===t?void 0:t.match(/\s+/))&&!e.match(/\s{2,}/)?e.replace(/\s+/g,""):e,r=new RegExp("([^A-Za-z0-9]{2,})|(^[^A-Za-z0-9-]+)|([^0-9a-z-,.])|([^0-9-,.]+)|([W,.])$","g"),a=$("decimal"),o=new RegExp("."===a?`\\${a}`:a,"g");return n.match(r)||(n.match(o)||[]).length>1?n:W(n).replace(new RegExp(`\\${a}`,"g"),".")}),[$,W]),z=F(P||C),[B,I]=i(V(k(z))?z:R(z)),A=(e,t)=>({target:{name:j,id:_,value:{formattedValue:R(k(e)),rawValue:t||k(e)}}}),Z=p(P);return l((()=>{const e=k(B),t=F(P);e!==t&&I(R(""===t&&""===Z?C:t))}),[C,R,F,Z,B,k,P]),e(t,{children:[n(c,f({align:h,readOnly:b,inputWidth:y,onChange:e=>{const{value:t}=e.target;I(t),O(A(t))},onBlur:e=>{const{value:t}=e.target;let n;if(t){const e=k(t),r=V(e)?t:R(e);n=A(r,e),I(r)}else n=A(C),I(C);x&&x(n)},value:B,"data-component":"decimal",id:_,ref:d},D,g("decimal",D))),n("input",{name:j,value:k(B),type:"hidden","data-component":"hidden-input","data-role":"hidden-input"})]})}));h.displayName="Decimal";export{h as Decimal,h as default};