@homebound/beam 2.138.0 → 2.139.0
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
2
|
import { Xss } from "../Css";
|
|
3
|
-
export declare type NumberFieldType = "cents" | "percent" | "basisPoints" | "days";
|
|
3
|
+
export declare type NumberFieldType = "cents" | "dollars" | "percent" | "basisPoints" | "days";
|
|
4
4
|
export interface NumberFieldProps {
|
|
5
5
|
label: string;
|
|
6
6
|
/** If set, the label will be defined as 'aria-label` on the input element */
|
|
@@ -21,6 +21,7 @@ export interface NumberFieldProps {
|
|
|
21
21
|
xss?: Xss<"textAlign" | "justifyContent">;
|
|
22
22
|
displayDirection?: boolean;
|
|
23
23
|
numFractionDigits?: number;
|
|
24
|
+
numberFormatOptions?: Intl.NumberFormatOptions;
|
|
24
25
|
truncate?: boolean;
|
|
25
26
|
onEnter?: VoidFunction;
|
|
26
27
|
}
|
|
@@ -15,7 +15,7 @@ function NumberField(props) {
|
|
|
15
15
|
// Determine default alignment based on presentation context
|
|
16
16
|
const { fieldProps } = (0, PresentationContext_1.usePresentationContext)();
|
|
17
17
|
const alignment = (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.numberAlignment) === "right" ? Css_1.Css.tr.jcfe.$ : Css_1.Css.tl.jcfs.$;
|
|
18
|
-
const { disabled, required, readOnly, type, label, onBlur, onFocus, errorMsg, helperText, value, onChange, xss, displayDirection = false, numFractionDigits, truncate = false, onEnter, ...otherProps } = props;
|
|
18
|
+
const { disabled, required, readOnly, type, label, onBlur, onFocus, errorMsg, helperText, value, onChange, xss, displayDirection = false, numFractionDigits = type === "dollars" ? 2 : undefined, truncate = false, onEnter, ...otherProps } = props;
|
|
19
19
|
const isDisabled = !!disabled;
|
|
20
20
|
const isReadOnly = !!readOnly;
|
|
21
21
|
const factor = type === "percent" || type === "cents" ? 100 : type === "basisPoints" ? 10000 : 1;
|
|
@@ -25,15 +25,20 @@ function NumberField(props) {
|
|
|
25
25
|
// If formatOptions isn't memo'd, a useEffect in useNumberStateField will cause jank,
|
|
26
26
|
// see: https://github.com/adobe/react-spectrum/issues/1893.
|
|
27
27
|
const formatOptions = (0, react_1.useMemo)(() => {
|
|
28
|
+
if (props.numberFormatOptions !== undefined) {
|
|
29
|
+
return props.numberFormatOptions;
|
|
30
|
+
}
|
|
28
31
|
return type === "percent"
|
|
29
32
|
? { style: "percent", signDisplay, ...fractionFormatOptions }
|
|
30
33
|
: type === "basisPoints"
|
|
31
34
|
? { style: "percent", minimumFractionDigits: 2, signDisplay }
|
|
32
35
|
: type === "cents"
|
|
33
36
|
? { style: "currency", currency: "USD", minimumFractionDigits: 2, signDisplay }
|
|
34
|
-
: type === "
|
|
35
|
-
? { style: "
|
|
36
|
-
:
|
|
37
|
+
: type === "dollars"
|
|
38
|
+
? { style: "currency", currency: "USD", minimumFractionDigits: numFractionDigits !== null && numFractionDigits !== void 0 ? numFractionDigits : 2, signDisplay }
|
|
39
|
+
: type === "days"
|
|
40
|
+
? { style: "unit", unit: "day", unitDisplay: "long", maximumFractionDigits: 0, signDisplay }
|
|
41
|
+
: fractionFormatOptions;
|
|
37
42
|
}, [type]);
|
|
38
43
|
const numberParser = (0, react_1.useMemo)(() => new number_1.NumberParser(locale, formatOptions), [locale, formatOptions]);
|
|
39
44
|
const valueRef = (0, react_1.useRef)({ wip: false });
|