linear-react-components-ui 2.0.0-rc.3 → 2.0.0-rc.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/inputs/number/Currency.js +20 -9
- package/lib/inputs/number/Currency.js.map +1 -1
- package/lib/inputs/number/Decimal.js +19 -8
- package/lib/inputs/number/Decimal.js.map +1 -1
- package/lib/inputs/number/format_number.js +14 -1
- package/lib/inputs/number/format_number.js.map +1 -1
- package/lib/inputs/number/index.js +16 -5
- package/lib/inputs/number/index.js.map +1 -1
- package/lib/inputs/types.d.ts +1 -1
- package/package.json +1 -1
|
@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useRef, useEffect } from "react";
|
|
3
3
|
import _ from "../../_virtual/lodash.js";
|
|
4
4
|
import { useIMask } from "react-imask";
|
|
5
|
-
import { numberToEnUS } from "./format_number.js";
|
|
5
|
+
import { numberToEnUS, numberToPtBR } from "./format_number.js";
|
|
6
6
|
import InputTextBase from "../base/InputTextBase.js";
|
|
7
7
|
import { mergeRefs } from "../../form2/helpers.js";
|
|
8
8
|
const CurrencyField = (props) => {
|
|
@@ -16,17 +16,17 @@ const CurrencyField = (props) => {
|
|
|
16
16
|
allowNegative = false,
|
|
17
17
|
scale = 2,
|
|
18
18
|
normalizeZeros = true,
|
|
19
|
-
padFractionalZeros =
|
|
19
|
+
padFractionalZeros = true,
|
|
20
20
|
unmask = true,
|
|
21
21
|
currencySymbol = "R$",
|
|
22
22
|
displayCurrencySymbol = true
|
|
23
23
|
} = props;
|
|
24
24
|
const currencyNumberInputRef = useRef(null);
|
|
25
|
+
const isResetting = useRef(false);
|
|
25
26
|
const leftElements = displayCurrencySymbol ? /* @__PURE__ */ jsx("span", { className: "currency-symbol", children: currencySymbol }) : [];
|
|
26
27
|
const {
|
|
27
28
|
value: maskedValue,
|
|
28
|
-
setValue: setMaskedValue
|
|
29
|
-
unmaskedValue
|
|
29
|
+
setValue: setMaskedValue
|
|
30
30
|
} = useIMask({
|
|
31
31
|
mask: Number,
|
|
32
32
|
unmask,
|
|
@@ -41,6 +41,10 @@ const CurrencyField = (props) => {
|
|
|
41
41
|
}, {
|
|
42
42
|
ref: currencyNumberInputRef,
|
|
43
43
|
onAccept: (__, options, event) => {
|
|
44
|
+
if (isResetting.current) {
|
|
45
|
+
isResetting.current = false;
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
44
48
|
const parsedValue = numberToEnUS(options.unmaskedValue);
|
|
45
49
|
props?.onChange?.({
|
|
46
50
|
...event,
|
|
@@ -54,9 +58,9 @@ const CurrencyField = (props) => {
|
|
|
54
58
|
});
|
|
55
59
|
const handleBlur = (event_0) => {
|
|
56
60
|
if (!_.isNil(min)) {
|
|
57
|
-
const currentValue =
|
|
61
|
+
const currentValue = numberToEnUS(maskedValue);
|
|
58
62
|
if (_.isNaN(currentValue) || currentValue < min) {
|
|
59
|
-
setMaskedValue(_.toString(min));
|
|
63
|
+
setMaskedValue(numberToPtBR(min) ?? _.toString(min));
|
|
60
64
|
props?.onChange?.({
|
|
61
65
|
...event_0,
|
|
62
66
|
target: {
|
|
@@ -70,9 +74,16 @@ const CurrencyField = (props) => {
|
|
|
70
74
|
props?.onBlur?.(event_0);
|
|
71
75
|
};
|
|
72
76
|
useEffect(() => {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
77
|
+
if (_.isNil(props?.value)) {
|
|
78
|
+
if (maskedValue !== "") {
|
|
79
|
+
isResetting.current = true;
|
|
80
|
+
setMaskedValue("");
|
|
81
|
+
}
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
const valueToPtBR = numberToPtBR(props?.value) ?? "";
|
|
85
|
+
if (!_.isEqual(parseFloat(_.toString(props?.value)), numberToEnUS(maskedValue))) {
|
|
86
|
+
setMaskedValue(valueToPtBR);
|
|
76
87
|
}
|
|
77
88
|
}, [props?.value]);
|
|
78
89
|
return /* @__PURE__ */ jsx(InputTextBase, { ...props, inputRef: mergeRefs(currencyNumberInputRef, inputRef), type: "text", onChange: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Currency.js","sources":["../../../src/lib/inputs/number/Currency.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport _ from 'lodash';\nimport { useIMask } from 'react-imask';\nimport { ICurrencyProps } from './types';\nimport { numberToEnUS } from './format_number';\nimport InputTextBase from '../base/InputTextBase';\nimport { mergeRefs } from '../../form2/helpers';\nimport type { CustomInputEvent } from '../base/types';\n\nconst CurrencyField = (props: ICurrencyProps) => {\n const {\n inputRef = undefined, textAlign = 'left', themePopover = 'light', popoverAlign = 'left',\n min = undefined, max = undefined, allowNegative = false, scale = 2, normalizeZeros = true,\n padFractionalZeros =
|
|
1
|
+
{"version":3,"file":"Currency.js","sources":["../../../src/lib/inputs/number/Currency.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport _ from 'lodash';\nimport { useIMask } from 'react-imask';\nimport { ICurrencyProps } from './types';\nimport { numberToEnUS, numberToPtBR } from './format_number';\nimport InputTextBase from '../base/InputTextBase';\nimport { mergeRefs } from '../../form2/helpers';\nimport type { CustomInputEvent } from '../base/types';\n\nconst CurrencyField = (props: ICurrencyProps) => {\n const {\n inputRef = undefined, textAlign = 'left', themePopover = 'light', popoverAlign = 'left',\n min = undefined, max = undefined, allowNegative = false, scale = 2, normalizeZeros = true,\n padFractionalZeros = true, unmask = true, currencySymbol = 'R$', displayCurrencySymbol = true,\n } = props;\n const currencyNumberInputRef = useRef<HTMLInputElement | null>(null);\n const isResetting = useRef(false);\n const leftElements = displayCurrencySymbol ?\n <span className=\"currency-symbol\">{currencySymbol}</span>\n : [];\n\n const { value: maskedValue, setValue: setMaskedValue } = useIMask({\n mask: Number,\n unmask,\n scale,\n normalizeZeros,\n padFractionalZeros,\n max,\n min: !_.isNil(min) ? min : (allowNegative ? undefined : 0),\n radix: ',',\n mapToRadix: ['.'],\n thousandsSeparator: '.',\n }, {\n ref: currencyNumberInputRef,\n onAccept: (__, options, event) => {\n if (isResetting.current) {\n isResetting.current = false;\n return;\n }\n const parsedValue = numberToEnUS(options.unmaskedValue);\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: parsedValue as any,\n },\n } as React.ChangeEvent<HTMLInputElement>);\n },\n });\n\n /**\n * Função sobrescrevendo o evento onBlur para tratar o valor mínimo ao sair do campo, \n * garantindo que o valor não seja menor que o mínimo definido.\n */\n const handleBlur = (event: CustomInputEvent) => {\n if (!_.isNil(min)) {\n const currentValue = numberToEnUS(maskedValue) as number;\n if (_.isNaN(currentValue) || currentValue < min) {\n setMaskedValue(numberToPtBR(min) ?? _.toString(min));\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: min as any,\n },\n } as CustomInputEvent);\n }\n }\n props?.onBlur?.(event);\n };\n\n useEffect(() => {\n if (_.isNil(props?.value)) {\n if (maskedValue !== '') {\n isResetting.current = true;\n setMaskedValue('');\n }\n return;\n }\n const valueToPtBR = numberToPtBR(props?.value) ?? '';\n if (!_.isEqual(\n parseFloat(_.toString(props?.value)), numberToEnUS(maskedValue),\n )) {\n setMaskedValue(valueToPtBR);\n }\n }, [props?.value]);\n\n return (\n <InputTextBase\n {...props}\n inputRef={mergeRefs(currencyNumberInputRef, inputRef) as any}\n type=\"text\"\n onChange={() => { }}\n leftElements={leftElements}\n onBlur={handleBlur}\n value={maskedValue}\n textAlign={textAlign}\n themePopover={themePopover}\n popoverAlign={popoverAlign} />\n );\n};\n\nexport default CurrencyField;\n"],"names":["CurrencyField","props","inputRef","undefined","textAlign","themePopover","popoverAlign","min","max","allowNegative","scale","normalizeZeros","padFractionalZeros","unmask","currencySymbol","displayCurrencySymbol","currencyNumberInputRef","useRef","isResetting","leftElements","value","maskedValue","setValue","setMaskedValue","useIMask","mask","Number","_","isNil","radix","mapToRadix","thousandsSeparator","ref","onAccept","__","options","event","current","parsedValue","numberToEnUS","unmaskedValue","onChange","target","name","handleBlur","currentValue","isNaN","numberToPtBR","toString","onBlur","useEffect","valueToPtBR","isEqual","parseFloat","mergeRefs"],"mappings":";;;;;;;AASA,MAAMA,gBAAgBA,CAACC,UAA0B;AAC/C,QAAM;AAAA,IACJC,WAAWC;AAAAA,IAAWC,YAAY;AAAA,IAAQC,eAAe;AAAA,IAASC,eAAe;AAAA,IACjFC,MAAMJ;AAAAA,IAAWK,MAAML;AAAAA,IAAWM,gBAAgB;AAAA,IAAOC,QAAQ;AAAA,IAAGC,iBAAiB;AAAA,IACrFC,qBAAqB;AAAA,IAAMC,SAAS;AAAA,IAAMC,iBAAiB;AAAA,IAAMC,wBAAwB;AAAA,EAAA,IACvFd;AACJ,QAAMe,yBAAyBC,OAAgC,IAAI;AACnE,QAAMC,cAAcD,OAAO,KAAK;AAChC,QAAME,eAAeJ,wBACnB,oBAAC,QAAA,EAAK,WAAU,mBAAmBD,UAAAA,eAAAA,CAAe,IAChD,CAAA;AAEJ,QAAM;AAAA,IAAEM,OAAOC;AAAAA,IAAaC,UAAUC;AAAAA,EAAAA,IAAmBC,SAAS;AAAA,IAChEC,MAAMC;AAAAA,IACNb;AAAAA,IACAH;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAJ;AAAAA,IACAD,KAAK,CAACoB,EAAEC,MAAMrB,GAAG,IAAIA,MAAOE,gBAAgBN,SAAY;AAAA,IACxD0B,OAAO;AAAA,IACPC,YAAY,CAAC,GAAG;AAAA,IAChBC,oBAAoB;AAAA,EAAA,GACnB;AAAA,IACDC,KAAKhB;AAAAA,IACLiB,UAAUA,CAACC,IAAIC,SAASC,UAAU;AAChC,UAAIlB,YAAYmB,SAAS;AACvBnB,oBAAYmB,UAAU;AACtB;AAAA,MACF;AACA,YAAMC,cAAcC,aAAaJ,QAAQK,aAAa;AACtDvC,aAAOwC,WAAW;AAAA,QAChB,GAAGL;AAAAA,QACHM,QAAQ;AAAA,UACN,GAAGN,OAAOM;AAAAA,UACVC,MAAM1C,OAAO0C;AAAAA,UACbvB,OAAOkB;AAAAA,QAAAA;AAAAA,MACT,CACsC;AAAA,IAC1C;AAAA,EAAA,CACD;AAMD,QAAMM,aAAaA,CAACR,YAA4B;AAC9C,QAAI,CAACT,EAAEC,MAAMrB,GAAG,GAAG;AACjB,YAAMsC,eAAeN,aAAalB,WAAW;AAC7C,UAAIM,EAAEmB,MAAMD,YAAY,KAAKA,eAAetC,KAAK;AAC/CgB,uBAAewB,aAAaxC,GAAG,KAAKoB,EAAEqB,SAASzC,GAAG,CAAC;AACnDN,eAAOwC,WAAW;AAAA,UAChB,GAAGL;AAAAA,UACHM,QAAQ;AAAA,YACN,GAAGN,SAAOM;AAAAA,YACVC,MAAM1C,OAAO0C;AAAAA,YACbvB,OAAOb;AAAAA,UAAAA;AAAAA,QACT,CACmB;AAAA,MACvB;AAAA,IACF;AACAN,WAAOgD,SAASb,OAAK;AAAA,EACvB;AAEAc,YAAU,MAAM;AACd,QAAIvB,EAAEC,MAAM3B,OAAOmB,KAAK,GAAG;AACzB,UAAIC,gBAAgB,IAAI;AACtBH,oBAAYmB,UAAU;AACtBd,uBAAe,EAAE;AAAA,MACnB;AACA;AAAA,IACF;AACA,UAAM4B,cAAcJ,aAAa9C,OAAOmB,KAAK,KAAK;AAClD,QAAI,CAACO,EAAEyB,QACLC,WAAW1B,EAAEqB,SAAS/C,OAAOmB,KAAK,CAAC,GAAGmB,aAAalB,WAAW,CAChE,GAAG;AACDE,qBAAe4B,WAAW;AAAA,IAC5B;AAAA,EACF,GAAG,CAAClD,OAAOmB,KAAK,CAAC;AAEjB,SACE,oBAAC,eAAA,EACC,GAAInB,OACJ,UAAUqD,UAAUtC,wBAAwBd,QAAQ,GACpD,MAAK,QACL,UAAU,MAAM;AAAA,EAAE,GAClB,cACA,QAAQ0C,YACR,OAAOvB,aACP,WACA,cACA,cAA2B;AAEjC;"}
|
|
@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import _ from "../../_virtual/lodash.js";
|
|
3
3
|
import { useRef, useEffect } from "react";
|
|
4
4
|
import { useIMask } from "react-imask";
|
|
5
|
-
import { numberToEnUS } from "./format_number.js";
|
|
5
|
+
import { numberToEnUS, numberToPtBR } from "./format_number.js";
|
|
6
6
|
import InputTextBase from "../base/InputTextBase.js";
|
|
7
7
|
import { mergeRefs } from "../../form2/helpers.js";
|
|
8
8
|
const DecimalField = (props) => {
|
|
@@ -20,10 +20,10 @@ const DecimalField = (props) => {
|
|
|
20
20
|
inputRef = void 0
|
|
21
21
|
} = props;
|
|
22
22
|
const decimalNumberInputRef = useRef(null);
|
|
23
|
+
const isResetting = useRef(false);
|
|
23
24
|
const {
|
|
24
25
|
value: maskedValue,
|
|
25
|
-
setValue: setMaskedValue
|
|
26
|
-
unmaskedValue
|
|
26
|
+
setValue: setMaskedValue
|
|
27
27
|
} = useIMask({
|
|
28
28
|
mask: Number,
|
|
29
29
|
unmask,
|
|
@@ -38,6 +38,10 @@ const DecimalField = (props) => {
|
|
|
38
38
|
}, {
|
|
39
39
|
ref: decimalNumberInputRef,
|
|
40
40
|
onAccept: (__, options, event) => {
|
|
41
|
+
if (isResetting.current) {
|
|
42
|
+
isResetting.current = false;
|
|
43
|
+
return;
|
|
44
|
+
}
|
|
41
45
|
const parsedValue = numberToEnUS(options.unmaskedValue);
|
|
42
46
|
props?.onChange?.({
|
|
43
47
|
...event,
|
|
@@ -51,9 +55,9 @@ const DecimalField = (props) => {
|
|
|
51
55
|
});
|
|
52
56
|
const handleBlur = (event_0) => {
|
|
53
57
|
if (!_.isNil(min)) {
|
|
54
|
-
const currentValue =
|
|
58
|
+
const currentValue = numberToEnUS(maskedValue);
|
|
55
59
|
if (_.isNaN(currentValue) || currentValue < min) {
|
|
56
|
-
setMaskedValue(_.toString(min));
|
|
60
|
+
setMaskedValue(numberToPtBR(min) ?? _.toString(min));
|
|
57
61
|
props?.onChange?.({
|
|
58
62
|
...event_0,
|
|
59
63
|
target: {
|
|
@@ -67,9 +71,16 @@ const DecimalField = (props) => {
|
|
|
67
71
|
props?.onBlur?.(event_0);
|
|
68
72
|
};
|
|
69
73
|
useEffect(() => {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
74
|
+
if (_.isNil(props?.value)) {
|
|
75
|
+
if (maskedValue !== "") {
|
|
76
|
+
isResetting.current = true;
|
|
77
|
+
setMaskedValue("");
|
|
78
|
+
}
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
const valueToPtBR = numberToPtBR(props?.value) ?? "";
|
|
82
|
+
if (!_.isEqual(parseFloat(_.toString(props?.value)), numberToEnUS(maskedValue))) {
|
|
83
|
+
setMaskedValue(valueToPtBR);
|
|
73
84
|
}
|
|
74
85
|
}, [props?.value]);
|
|
75
86
|
return /* @__PURE__ */ jsx(InputTextBase, { ...props, inputRef: mergeRefs(decimalNumberInputRef, inputRef), type: "text", onChange: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Decimal.js","sources":["../../../src/lib/inputs/number/Decimal.tsx"],"sourcesContent":["import _ from 'lodash';\nimport React, { useEffect, useRef } from 'react';\nimport { useIMask } from 'react-imask';\nimport { IDecimalProps } from './types';\nimport { numberToEnUS } from './format_number';\nimport InputTextBase from '../base/InputTextBase';\nimport type { CustomInputEvent } from '../base/types';\nimport { mergeRefs } from '../../form2/helpers';\n\nconst DecimalField = (props: IDecimalProps) => {\n const {\n textAlign = 'left', themePopover = 'light', popoverAlign = 'left', min = undefined,\n max = undefined, allowNegative = false, scale = 2, normalizeZeros = true,\n padFractionalZeros = true, unmask = true, inputRef = undefined,\n } = props;\n const decimalNumberInputRef = useRef<HTMLInputElement | null>(null);\n\n const { value: maskedValue, setValue: setMaskedValue
|
|
1
|
+
{"version":3,"file":"Decimal.js","sources":["../../../src/lib/inputs/number/Decimal.tsx"],"sourcesContent":["import _ from 'lodash';\nimport React, { useEffect, useRef } from 'react';\nimport { useIMask } from 'react-imask';\nimport { IDecimalProps } from './types';\nimport { numberToEnUS, numberToPtBR } from './format_number';\nimport InputTextBase from '../base/InputTextBase';\nimport type { CustomInputEvent } from '../base/types';\nimport { mergeRefs } from '../../form2/helpers';\n\nconst DecimalField = (props: IDecimalProps) => {\n const {\n textAlign = 'left', themePopover = 'light', popoverAlign = 'left', min = undefined,\n max = undefined, allowNegative = false, scale = 2, normalizeZeros = true,\n padFractionalZeros = true, unmask = true, inputRef = undefined,\n } = props;\n const decimalNumberInputRef = useRef<HTMLInputElement | null>(null);\n const isResetting = useRef(false);\n\n const { value: maskedValue, setValue: setMaskedValue } = useIMask({\n mask: Number,\n unmask,\n scale,\n normalizeZeros,\n padFractionalZeros,\n max,\n min: !_.isNil(min) ? min : (allowNegative ? undefined : 0),\n radix: ',',\n mapToRadix: ['.'],\n thousandsSeparator: '.',\n }, {\n ref: decimalNumberInputRef,\n onAccept: (__, options, event) => {\n if (isResetting.current) {\n isResetting.current = false;\n return;\n }\n const parsedValue = numberToEnUS(options.unmaskedValue);\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: parsedValue as any,\n },\n } as React.ChangeEvent<HTMLInputElement>);\n },\n });\n\n /**\n * Função sobrescrevendo o evento onBlur para tratar o valor mínimo ao sair do campo, \n * garantindo que o valor não seja menor que o mínimo definido.\n */\n const handleBlur = (event: CustomInputEvent) => {\n if (!_.isNil(min)) {\n const currentValue = numberToEnUS(maskedValue) as number;\n if (_.isNaN(currentValue) || currentValue < min) {\n setMaskedValue(numberToPtBR(min) ?? _.toString(min));\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: min as any,\n },\n } as CustomInputEvent);\n }\n }\n props?.onBlur?.(event);\n };\n\n useEffect(() => {\n if (_.isNil(props?.value)) {\n if (maskedValue !== '') {\n isResetting.current = true;\n setMaskedValue('');\n }\n return;\n }\n const valueToPtBR = numberToPtBR(props?.value) ?? '';\n if (!_.isEqual(\n parseFloat(_.toString(props?.value)), numberToEnUS(maskedValue),\n )) {\n setMaskedValue(valueToPtBR);\n }\n }, [props?.value]);\n\n return (\n <InputTextBase\n {...props}\n inputRef={mergeRefs(decimalNumberInputRef, inputRef) as any}\n type=\"text\"\n onChange={() => { }}\n onBlur={handleBlur}\n value={maskedValue}\n textAlign={textAlign}\n themePopover={themePopover}\n popoverAlign={popoverAlign} />\n );\n};\n\nexport default DecimalField;\n"],"names":["DecimalField","props","textAlign","themePopover","popoverAlign","min","undefined","max","allowNegative","scale","normalizeZeros","padFractionalZeros","unmask","inputRef","decimalNumberInputRef","useRef","isResetting","value","maskedValue","setValue","setMaskedValue","useIMask","mask","Number","_","isNil","radix","mapToRadix","thousandsSeparator","ref","onAccept","__","options","event","current","parsedValue","numberToEnUS","unmaskedValue","onChange","target","name","handleBlur","currentValue","isNaN","numberToPtBR","toString","onBlur","useEffect","valueToPtBR","isEqual","parseFloat","mergeRefs"],"mappings":";;;;;;;AASA,MAAMA,eAAeA,CAACC,UAAyB;AAC7C,QAAM;AAAA,IACJC,YAAY;AAAA,IAAQC,eAAe;AAAA,IAASC,eAAe;AAAA,IAAQC,MAAMC;AAAAA,IACzEC,MAAMD;AAAAA,IAAWE,gBAAgB;AAAA,IAAOC,QAAQ;AAAA,IAAGC,iBAAiB;AAAA,IACpEC,qBAAqB;AAAA,IAAMC,SAAS;AAAA,IAAMC,WAAWP;AAAAA,EAAAA,IACnDL;AACJ,QAAMa,wBAAwBC,OAAgC,IAAI;AAClE,QAAMC,cAAcD,OAAO,KAAK;AAEhC,QAAM;AAAA,IAAEE,OAAOC;AAAAA,IAAaC,UAAUC;AAAAA,EAAAA,IAAmBC,SAAS;AAAA,IAChEC,MAAMC;AAAAA,IACNX;AAAAA,IACAH;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAJ;AAAAA,IACAF,KAAK,CAACmB,EAAEC,MAAMpB,GAAG,IAAIA,MAAOG,gBAAgBF,SAAY;AAAA,IACxDoB,OAAO;AAAA,IACPC,YAAY,CAAC,GAAG;AAAA,IAChBC,oBAAoB;AAAA,EAAA,GACnB;AAAA,IACDC,KAAKf;AAAAA,IACLgB,UAAUA,CAACC,IAAIC,SAASC,UAAU;AAChC,UAAIjB,YAAYkB,SAAS;AACvBlB,oBAAYkB,UAAU;AACtB;AAAA,MACF;AACA,YAAMC,cAAcC,aAAaJ,QAAQK,aAAa;AACtDpC,aAAOqC,WAAW;AAAA,QAChB,GAAGL;AAAAA,QACHM,QAAQ;AAAA,UACN,GAAGN,OAAOM;AAAAA,UACVC,MAAMvC,OAAOuC;AAAAA,UACbvB,OAAOkB;AAAAA,QAAAA;AAAAA,MACT,CACsC;AAAA,IAC1C;AAAA,EAAA,CACD;AAMD,QAAMM,aAAaA,CAACR,YAA4B;AAC9C,QAAI,CAACT,EAAEC,MAAMpB,GAAG,GAAG;AACjB,YAAMqC,eAAeN,aAAalB,WAAW;AAC7C,UAAIM,EAAEmB,MAAMD,YAAY,KAAKA,eAAerC,KAAK;AAC/Ce,uBAAewB,aAAavC,GAAG,KAAKmB,EAAEqB,SAASxC,GAAG,CAAC;AACnDJ,eAAOqC,WAAW;AAAA,UAChB,GAAGL;AAAAA,UACHM,QAAQ;AAAA,YACN,GAAGN,SAAOM;AAAAA,YACVC,MAAMvC,OAAOuC;AAAAA,YACbvB,OAAOZ;AAAAA,UAAAA;AAAAA,QACT,CACmB;AAAA,MACvB;AAAA,IACF;AACAJ,WAAO6C,SAASb,OAAK;AAAA,EACvB;AAEAc,YAAU,MAAM;AACd,QAAIvB,EAAEC,MAAMxB,OAAOgB,KAAK,GAAG;AACzB,UAAIC,gBAAgB,IAAI;AACtBF,oBAAYkB,UAAU;AACtBd,uBAAe,EAAE;AAAA,MACnB;AACA;AAAA,IACF;AACA,UAAM4B,cAAcJ,aAAa3C,OAAOgB,KAAK,KAAK;AAClD,QAAI,CAACO,EAAEyB,QACLC,WAAW1B,EAAEqB,SAAS5C,OAAOgB,KAAK,CAAC,GAAGmB,aAAalB,WAAW,CAChE,GAAG;AACDE,qBAAe4B,WAAW;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC/C,OAAOgB,KAAK,CAAC;AAEjB,SACE,oBAAC,eAAA,EACC,GAAIhB,OACJ,UAAUkD,UAAUrC,uBAAuBD,QAAQ,GACnD,MAAK,QACL,UAAU,MAAM;AAAA,EAAE,GAClB,QAAQ4B,YACR,OAAOvB,aACP,WACA,cACA,cAA2B;AAEjC;"}
|
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
const numberToPtBR = (value) => {
|
|
2
|
+
if (value !== void 0 && typeof value === "number") {
|
|
3
|
+
return value.toLocaleString("pt-BR");
|
|
4
|
+
}
|
|
5
|
+
if (value !== void 0 && typeof value === "string" && value.trim() !== "") {
|
|
6
|
+
const parsed = Number(value);
|
|
7
|
+
if (!isNaN(parsed)) {
|
|
8
|
+
return parsed.toLocaleString("pt-BR");
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
return value;
|
|
12
|
+
};
|
|
1
13
|
const numberToEnUS = (value) => {
|
|
2
14
|
if (!value || value.trim() === "") {
|
|
3
15
|
return 0;
|
|
@@ -16,6 +28,7 @@ const formatOnlyNumbers = (value) => {
|
|
|
16
28
|
};
|
|
17
29
|
export {
|
|
18
30
|
formatOnlyNumbers,
|
|
19
|
-
numberToEnUS
|
|
31
|
+
numberToEnUS,
|
|
32
|
+
numberToPtBR
|
|
20
33
|
};
|
|
21
34
|
//# sourceMappingURL=format_number.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"format_number.js","sources":["../../../src/lib/inputs/number/format_number.tsx"],"sourcesContent":["export const numberToPtBR = (value?: string | number): string | undefined => {\n if (value !== undefined && typeof value === 'number') {\n return value.toLocaleString('pt-BR');\n }\n return value;\n};\n\nexport const numberToEnUS = (value: string) => {\n // Se o valor estiver vazio ou já for um número válido sem formatação BR\n if (!value || value.trim() === '') {\n return 0;\n }\n // Verifica se contém vírgula(indicador de formato BR)\n // Formatos BR: \"12,89\", \"1.234,56\", \"1234,56\"\n if (value.includes(',')) {\n // Remove separadores de milhar(.) e substitui vírgula decimal por ponto\n const formattedNumber = value.replaceAll('.', '').replaceAll(',', '.');\n const parsed = Number(formattedNumber);\n return isNaN(parsed) ? 0 : parsed;\n }\n // Tenta converter diretamente(formato já é en-US ou Number)\n const parsed = Number(value);\n return isNaN(parsed) ? 0 : parsed;\n};\n\nexport const formatOnlyNumbers = (value: string): string => {\n const teste = value.replace(/[._\\-/()\\s+]/g, '');\n return teste;\n};\n"],"names":["
|
|
1
|
+
{"version":3,"file":"format_number.js","sources":["../../../src/lib/inputs/number/format_number.tsx"],"sourcesContent":["export const numberToPtBR = (value?: string | number): string | undefined => {\n if (value !== undefined && typeof value === 'number') {\n return value.toLocaleString('pt-BR');\n }\n if (value !== undefined && typeof value === 'string' && value.trim() !== '') {\n const parsed = Number(value);\n if (!isNaN(parsed)) {\n return parsed.toLocaleString('pt-BR');\n }\n }\n return value;\n};\n\nexport const numberToEnUS = (value: string) => {\n // Se o valor estiver vazio ou já for um número válido sem formatação BR\n if (!value || value.trim() === '') {\n return 0;\n }\n // Verifica se contém vírgula(indicador de formato BR)\n // Formatos BR: \"12,89\", \"1.234,56\", \"1234,56\"\n if (value.includes(',')) {\n // Remove separadores de milhar(.) e substitui vírgula decimal por ponto\n const formattedNumber = value.replaceAll('.', '').replaceAll(',', '.');\n const parsed = Number(formattedNumber);\n return isNaN(parsed) ? 0 : parsed;\n }\n // Tenta converter diretamente(formato já é en-US ou Number)\n const parsed = Number(value);\n return isNaN(parsed) ? 0 : parsed;\n};\n\nexport const formatOnlyNumbers = (value: string): string => {\n const teste = value.replace(/[._\\-/()\\s+]/g, '');\n return teste;\n};\n"],"names":["numberToPtBR","value","undefined","toLocaleString","trim","parsed","Number","isNaN","numberToEnUS","includes","formattedNumber","replaceAll","formatOnlyNumbers","teste","replace"],"mappings":"AAAO,MAAMA,eAAeA,CAACC,UAAgD;AAC3E,MAAIA,UAAUC,UAAa,OAAOD,UAAU,UAAU;AACpD,WAAOA,MAAME,eAAe,OAAO;AAAA,EACrC;AACA,MAAIF,UAAUC,UAAa,OAAOD,UAAU,YAAYA,MAAMG,KAAAA,MAAW,IAAI;AAC3E,UAAMC,SAASC,OAAOL,KAAK;AAC3B,QAAI,CAACM,MAAMF,MAAM,GAAG;AAClB,aAAOA,OAAOF,eAAe,OAAO;AAAA,IACtC;AAAA,EACF;AACA,SAAOF;AACT;AAEO,MAAMO,eAAeA,CAACP,UAAkB;AAE7C,MAAI,CAACA,SAASA,MAAMG,KAAAA,MAAW,IAAI;AACjC,WAAO;AAAA,EACT;AAGA,MAAIH,MAAMQ,SAAS,GAAG,GAAG;AAEvB,UAAMC,kBAAkBT,MAAMU,WAAW,KAAK,EAAE,EAAEA,WAAW,KAAK,GAAG;AACrE,UAAMN,UAASC,OAAOI,eAAe;AACrC,WAAOH,MAAMF,OAAM,IAAI,IAAIA;AAAAA,EAC7B;AAEA,QAAMA,SAASC,OAAOL,KAAK;AAC3B,SAAOM,MAAMF,MAAM,IAAI,IAAIA;AAC7B;AAEO,MAAMO,oBAAoBA,CAACX,UAA0B;AAC1D,QAAMY,QAAQZ,MAAMa,QAAQ,iBAAiB,EAAE;AAC/C,SAAOD;AACT;"}
|
|
@@ -17,10 +17,10 @@ const NumberField = (props) => {
|
|
|
17
17
|
inputRef = void 0
|
|
18
18
|
} = props;
|
|
19
19
|
const numberInputRef = useRef(null);
|
|
20
|
+
const isResetting = useRef(false);
|
|
20
21
|
const {
|
|
21
22
|
value: maskedValue,
|
|
22
|
-
setValue: setMaskedValue
|
|
23
|
-
unmaskedValue
|
|
23
|
+
setValue: setMaskedValue
|
|
24
24
|
} = useIMask({
|
|
25
25
|
mask: Number,
|
|
26
26
|
max,
|
|
@@ -34,6 +34,10 @@ const NumberField = (props) => {
|
|
|
34
34
|
}, {
|
|
35
35
|
ref: numberInputRef,
|
|
36
36
|
onAccept: (value, __, event) => {
|
|
37
|
+
if (isResetting.current) {
|
|
38
|
+
isResetting.current = false;
|
|
39
|
+
return;
|
|
40
|
+
}
|
|
37
41
|
const parsedValue = parseInt(value, 10);
|
|
38
42
|
props?.onChange?.({
|
|
39
43
|
...event,
|
|
@@ -47,7 +51,7 @@ const NumberField = (props) => {
|
|
|
47
51
|
});
|
|
48
52
|
const handleBlur = (event_0) => {
|
|
49
53
|
if (!_.isNil(min)) {
|
|
50
|
-
const currentValue = parseInt(
|
|
54
|
+
const currentValue = parseInt(maskedValue, 10);
|
|
51
55
|
if (_.isNaN(currentValue) || currentValue < min) {
|
|
52
56
|
setMaskedValue(_.toString(min));
|
|
53
57
|
props?.onChange?.({
|
|
@@ -63,8 +67,15 @@ const NumberField = (props) => {
|
|
|
63
67
|
props?.onBlur?.(event_0);
|
|
64
68
|
};
|
|
65
69
|
useEffect(() => {
|
|
66
|
-
|
|
67
|
-
|
|
70
|
+
if (_.isNil(props?.value)) {
|
|
71
|
+
if (maskedValue !== "") {
|
|
72
|
+
isResetting.current = true;
|
|
73
|
+
setMaskedValue("");
|
|
74
|
+
}
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const floatMaskedValue = Number(maskedValue || "0");
|
|
78
|
+
if (!_.isEqual(props?.value, floatMaskedValue) || _.isEqual(props?.value, 0)) {
|
|
68
79
|
setMaskedValue(_.toString(props?.value));
|
|
69
80
|
}
|
|
70
81
|
}, [props?.value]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/lib/inputs/number/index.tsx"],"sourcesContent":["import '../../assets/styles/numbers.scss';\n\nimport React, { useEffect, useRef } from 'react';\nimport _ from 'lodash';\nimport { useIMask } from 'react-imask';\nimport DecimalField from './Decimal';\nimport CurrencyField from './Currency';\nimport { INumberFieldProps } from './types';\nimport InputTextBase from '../base/InputTextBase';\nimport { CustomInputEvent } from '../base/types';\nimport { mergeRefs } from '../../form2/helpers';\n\nconst NumberField = (props: INumberFieldProps) => {\n const {\n textAlign = 'left', themePopover = 'light', popoverAlign = 'left', min = undefined, \n max = undefined, inputRef = undefined,\n } = props;\n const numberInputRef = useRef<HTMLInputElement | null>(null);\n\n const { value: maskedValue, setValue: setMaskedValue
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/lib/inputs/number/index.tsx"],"sourcesContent":["import '../../assets/styles/numbers.scss';\n\nimport React, { useEffect, useRef } from 'react';\nimport _ from 'lodash';\nimport { useIMask } from 'react-imask';\nimport DecimalField from './Decimal';\nimport CurrencyField from './Currency';\nimport { INumberFieldProps } from './types';\nimport InputTextBase from '../base/InputTextBase';\nimport { CustomInputEvent } from '../base/types';\nimport { mergeRefs } from '../../form2/helpers';\n\nconst NumberField = (props: INumberFieldProps) => {\n const {\n textAlign = 'left', themePopover = 'light', popoverAlign = 'left', min = undefined, \n max = undefined, inputRef = undefined,\n } = props;\n const numberInputRef = useRef<HTMLInputElement | null>(null);\n const isResetting = useRef(false);\n\n const { value: maskedValue, setValue: setMaskedValue } = useIMask({\n mask: Number,\n max,\n min,\n scale: 0,\n enum: undefined,\n to: undefined,\n from: undefined,\n normalizeZeros: true,\n padFractionalZeros: false,\n }, {\n ref: numberInputRef,\n onAccept: (value, __, event) => {\n if (isResetting.current) {\n isResetting.current = false;\n return;\n }\n const parsedValue = parseInt(value, 10);\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: parsedValue as any,\n },\n } as CustomInputEvent);\n },\n });\n\n /**\n * Função sobrescrevendo o evento onBlur para tratar o valor mínimo ao sair do campo, \n * garantindo que o valor não seja menor que o mínimo definido.\n */\n const handleBlur = (event: CustomInputEvent) => {\n if (!_.isNil(min)) {\n const currentValue = parseInt(maskedValue, 10) as number;\n if (_.isNaN(currentValue) || currentValue < min) {\n setMaskedValue(_.toString(min));\n props?.onChange?.({\n ...event,\n target: {\n ...event?.target,\n name: props?.name,\n value: min as any,\n },\n } as CustomInputEvent);\n }\n }\n props?.onBlur?.(event);\n };\n\n useEffect(() => {\n if (_.isNil(props?.value)) {\n if (maskedValue !== '') {\n isResetting.current = true;\n setMaskedValue('');\n }\n return;\n }\n const floatMaskedValue = Number(maskedValue || '0');\n if (!_.isEqual(props?.value, floatMaskedValue) || _.isEqual(props?.value, 0)) {\n setMaskedValue(_.toString(props?.value));\n }\n }, [props?.value]);\n\n return (\n <InputTextBase\n {...props}\n inputRef={mergeRefs(numberInputRef, inputRef) as any}\n type=\"number\"\n onChange={() => {}}\n onBlur={handleBlur}\n value={maskedValue}\n textAlign={textAlign}\n themePopover={themePopover}\n popoverAlign={popoverAlign} />\n );\n};\n\nexport default NumberField;\nexport {\n CurrencyField,\n DecimalField,\n};\n"],"names":["NumberField","props","textAlign","themePopover","popoverAlign","min","undefined","max","inputRef","numberInputRef","useRef","isResetting","value","maskedValue","setValue","setMaskedValue","useIMask","mask","Number","scale","enum","to","from","normalizeZeros","padFractionalZeros","ref","onAccept","__","event","current","parsedValue","parseInt","onChange","target","name","handleBlur","_","isNil","currentValue","isNaN","toString","onBlur","useEffect","floatMaskedValue","isEqual","mergeRefs"],"mappings":";;;;;;;;;AAYA,MAAMA,cAAcA,CAACC,UAA6B;AAChD,QAAM;AAAA,IACJC,YAAY;AAAA,IAAQC,eAAe;AAAA,IAASC,eAAe;AAAA,IAAQC,MAAMC;AAAAA,IACzEC,MAAMD;AAAAA,IAAWE,WAAWF;AAAAA,EAAAA,IAC1BL;AACJ,QAAMQ,iBAAiBC,OAAgC,IAAI;AAC3D,QAAMC,cAAcD,OAAO,KAAK;AAEhC,QAAM;AAAA,IAAEE,OAAOC;AAAAA,IAAaC,UAAUC;AAAAA,EAAAA,IAAmBC,SAAS;AAAA,IAChEC,MAAMC;AAAAA,IACNX;AAAAA,IACAF;AAAAA,IACAc,OAAO;AAAA,IACPC,MAAMd;AAAAA,IACNe,IAAIf;AAAAA,IACJgB,MAAMhB;AAAAA,IACNiB,gBAAgB;AAAA,IAChBC,oBAAoB;AAAA,EAAA,GACnB;AAAA,IACDC,KAAKhB;AAAAA,IACLiB,UAAUA,CAACd,OAAOe,IAAIC,UAAU;AAC9B,UAAIjB,YAAYkB,SAAS;AACvBlB,oBAAYkB,UAAU;AACtB;AAAA,MACF;AACA,YAAMC,cAAcC,SAASnB,OAAO,EAAE;AACtCX,aAAO+B,WAAW;AAAA,QAChB,GAAGJ;AAAAA,QACHK,QAAQ;AAAA,UACN,GAAGL,OAAOK;AAAAA,UACVC,MAAMjC,OAAOiC;AAAAA,UACbtB,OAAOkB;AAAAA,QAAAA;AAAAA,MACT,CACmB;AAAA,IACvB;AAAA,EAAA,CACD;AAMD,QAAMK,aAAaA,CAACP,YAA4B;AAC9C,QAAI,CAACQ,EAAEC,MAAMhC,GAAG,GAAG;AACjB,YAAMiC,eAAeP,SAASlB,aAAa,EAAE;AAC7C,UAAIuB,EAAEG,MAAMD,YAAY,KAAKA,eAAejC,KAAK;AAC/CU,uBAAeqB,EAAEI,SAASnC,GAAG,CAAC;AAC9BJ,eAAO+B,WAAW;AAAA,UAChB,GAAGJ;AAAAA,UACHK,QAAQ;AAAA,YACN,GAAGL,SAAOK;AAAAA,YACVC,MAAMjC,OAAOiC;AAAAA,YACbtB,OAAOP;AAAAA,UAAAA;AAAAA,QACT,CACmB;AAAA,MACvB;AAAA,IACF;AACAJ,WAAOwC,SAASb,OAAK;AAAA,EACvB;AAEAc,YAAU,MAAM;AACd,QAAIN,EAAEC,MAAMpC,OAAOW,KAAK,GAAG;AACzB,UAAIC,gBAAgB,IAAI;AACtBF,oBAAYkB,UAAU;AACtBd,uBAAe,EAAE;AAAA,MACnB;AACA;AAAA,IACF;AACA,UAAM4B,mBAAmBzB,OAAOL,eAAe,GAAG;AAClD,QAAI,CAACuB,EAAEQ,QAAQ3C,OAAOW,OAAO+B,gBAAgB,KAAKP,EAAEQ,QAAQ3C,OAAOW,OAAO,CAAC,GAAG;AAC5EG,qBAAeqB,EAAEI,SAASvC,OAAOW,KAAK,CAAC;AAAA,IACzC;AAAA,EACF,GAAG,CAACX,OAAOW,KAAK,CAAC;AAEjB,SACE,oBAAC,eAAA,EACC,GAAIX,OACJ,UAAU4C,UAAUpC,gBAAgBD,QAAQ,GAC5C,MAAK,UACL,UAAU,MAAM;AAAA,EAAC,GACjB,QAAQ2B,YACR,OAAOtB,aACP,WACA,cACA,cAA2B;AAEjC;"}
|
package/lib/inputs/types.d.ts
CHANGED