@dmsi/wedgekit-react 0.0.1248 → 0.0.1250
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/dist/{chunk-MOBFZ672.js → chunk-3DJWSTPS.js} +1 -1
- package/dist/{chunk-5UPADXVU.js → chunk-3V5OMIYB.js} +6 -6
- package/dist/{chunk-EA6Y4HXQ.js → chunk-4FUZDLWX.js} +1 -1
- package/dist/{chunk-PABII472.js → chunk-H5SHC4XZ.js} +40 -33
- package/dist/{chunk-MAEVKATN.js → chunk-HRPW6VXG.js} +1 -1
- package/dist/{chunk-OG2PGA3X.js → chunk-JYECZBCJ.js} +1 -1
- package/dist/{chunk-PBJ2MEHM.js → chunk-QW4AJ5FK.js} +1 -1
- package/dist/{chunk-I3W5K76C.js → chunk-RN465M4S.js} +1 -1
- package/dist/components/CalendarRange.cjs +41 -34
- package/dist/components/CalendarRange.css +3 -0
- package/dist/components/CalendarRange.js +8 -8
- package/dist/components/Checkbox.cjs +1 -1
- package/dist/components/Checkbox.js +1 -1
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.cjs +41 -34
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.css +3 -0
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.js +8 -8
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs +41 -34
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.css +3 -0
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js +8 -8
- package/dist/components/DataGrid/PinnedColumns.cjs +41 -34
- package/dist/components/DataGrid/PinnedColumns.css +3 -0
- package/dist/components/DataGrid/PinnedColumns.js +8 -8
- package/dist/components/DataGrid/TableBody/LoadingCell.cjs +41 -34
- package/dist/components/DataGrid/TableBody/LoadingCell.css +3 -0
- package/dist/components/DataGrid/TableBody/LoadingCell.js +8 -8
- package/dist/components/DataGrid/TableBody/TableBodyRow.cjs +41 -34
- package/dist/components/DataGrid/TableBody/TableBodyRow.css +3 -0
- package/dist/components/DataGrid/TableBody/TableBodyRow.js +8 -8
- package/dist/components/DataGrid/TableBody/index.cjs +41 -34
- package/dist/components/DataGrid/TableBody/index.css +3 -0
- package/dist/components/DataGrid/TableBody/index.js +8 -8
- package/dist/components/DataGrid/index.cjs +41 -34
- package/dist/components/DataGrid/index.css +3 -0
- package/dist/components/DataGrid/index.js +8 -8
- package/dist/components/DataGrid/utils.cjs +41 -34
- package/dist/components/DataGrid/utils.css +3 -0
- package/dist/components/DataGrid/utils.js +8 -8
- package/dist/components/DataGridCell.cjs +40 -33
- package/dist/components/DataGridCell.js +3 -3
- package/dist/components/DateInput.cjs +41 -34
- package/dist/components/DateInput.css +3 -0
- package/dist/components/DateInput.js +8 -8
- package/dist/components/DateRangeInput.cjs +41 -34
- package/dist/components/DateRangeInput.css +3 -0
- package/dist/components/DateRangeInput.js +8 -8
- package/dist/components/FilterGroup.cjs +41 -34
- package/dist/components/FilterGroup.js +3 -3
- package/dist/components/Input.cjs +40 -33
- package/dist/components/Input.js +1 -1
- package/dist/components/MobileDataGrid/ColumnList.cjs +1 -1
- package/dist/components/MobileDataGrid/ColumnList.css +3 -0
- package/dist/components/MobileDataGrid/ColumnList.js +3 -3
- package/dist/components/MobileDataGrid/ColumnSelector/index.cjs +41 -34
- package/dist/components/MobileDataGrid/ColumnSelector/index.css +3 -0
- package/dist/components/MobileDataGrid/ColumnSelector/index.js +8 -8
- package/dist/components/MobileDataGrid/MobileDataGridCard/index.cjs +1 -1
- package/dist/components/MobileDataGrid/MobileDataGridCard/index.js +2 -2
- package/dist/components/MobileDataGrid/MobileDataGridHeader.cjs +41 -34
- package/dist/components/MobileDataGrid/MobileDataGridHeader.css +3 -0
- package/dist/components/MobileDataGrid/MobileDataGridHeader.js +8 -8
- package/dist/components/MobileDataGrid/index.cjs +41 -34
- package/dist/components/MobileDataGrid/index.css +3 -0
- package/dist/components/MobileDataGrid/index.js +8 -8
- package/dist/components/Password.cjs +40 -33
- package/dist/components/Password.js +1 -1
- package/dist/components/Search.cjs +40 -33
- package/dist/components/Search.js +2 -2
- package/dist/components/Select.cjs +40 -33
- package/dist/components/Select.js +2 -2
- package/dist/components/Stepper.cjs +40 -33
- package/dist/components/Stepper.js +1 -1
- package/dist/components/Time.cjs +40 -33
- package/dist/components/Time.js +1 -1
- package/dist/components/index.cjs +41 -34
- package/dist/components/index.css +3 -0
- package/dist/components/index.js +8 -8
- package/dist/index.css +3 -0
- package/package.json +1 -1
|
@@ -397,7 +397,7 @@ var Checkbox = (_a) => {
|
|
|
397
397
|
as: "span",
|
|
398
398
|
padded: true,
|
|
399
399
|
className: (0, import_clsx4.default)(
|
|
400
|
-
"text-nowrap",
|
|
400
|
+
!(paragraphClassName == null ? void 0 : paragraphClassName.includes("text-wrap")) && "text-nowrap",
|
|
401
401
|
disabled && !error && "!text-text-primary-disabled",
|
|
402
402
|
error && !disabled && !readOnly && "!text-text-primary-error",
|
|
403
403
|
paragraphClassName
|
|
@@ -2342,6 +2342,14 @@ var import_react11 = require("react");
|
|
|
2342
2342
|
var import_react10 = require("react");
|
|
2343
2343
|
var import_clsx11 = __toESM(require("clsx"), 1);
|
|
2344
2344
|
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
2345
|
+
function hasEquivalentNumericValue(currentValue, nextValue) {
|
|
2346
|
+
if (!currentValue || !nextValue) {
|
|
2347
|
+
return false;
|
|
2348
|
+
}
|
|
2349
|
+
const currentNumericValue = Number(currentValue.replace(/,/g, ""));
|
|
2350
|
+
const nextNumericValue = Number(nextValue.replace(/,/g, ""));
|
|
2351
|
+
return !Number.isNaN(currentNumericValue) && !Number.isNaN(nextNumericValue) && currentNumericValue === nextNumericValue;
|
|
2352
|
+
}
|
|
2345
2353
|
var InputBase = (_a) => {
|
|
2346
2354
|
var _b = _a, {
|
|
2347
2355
|
id,
|
|
@@ -2564,28 +2572,33 @@ var Input = (_a) => {
|
|
|
2564
2572
|
const [internalValue, setInternalValue] = (0, import_react10.useState)("");
|
|
2565
2573
|
const [displayValue, setDisplayValue] = (0, import_react10.useState)("");
|
|
2566
2574
|
const [isFocused, setIsFocused] = (0, import_react10.useState)(false);
|
|
2575
|
+
const internalValueRef = (0, import_react10.useRef)("");
|
|
2576
|
+
const setInputValues = (nextInternalValue, nextDisplayValue) => {
|
|
2577
|
+
internalValueRef.current = nextInternalValue;
|
|
2578
|
+
setInternalValue(nextInternalValue);
|
|
2579
|
+
setDisplayValue(nextDisplayValue);
|
|
2580
|
+
};
|
|
2567
2581
|
(0, import_react10.useEffect)(() => {
|
|
2568
2582
|
var _a2;
|
|
2569
2583
|
const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
|
|
2570
2584
|
const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
|
|
2571
2585
|
if (!stringValue) {
|
|
2572
|
-
|
|
2573
|
-
setDisplayValue("");
|
|
2586
|
+
setInputValues("", "");
|
|
2574
2587
|
return;
|
|
2575
2588
|
}
|
|
2576
2589
|
if (!shouldUseThousandsFormatting) {
|
|
2577
|
-
|
|
2578
|
-
|
|
2590
|
+
setInputValues(stringValue, stringValue);
|
|
2591
|
+
return;
|
|
2592
|
+
}
|
|
2593
|
+
if (isFocused && hasEquivalentNumericValue(internalValueRef.current, stringValue)) {
|
|
2579
2594
|
return;
|
|
2580
2595
|
}
|
|
2581
|
-
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
2582
2596
|
if (formatOnBlur && isFocused) {
|
|
2583
|
-
|
|
2584
|
-
setDisplayValue(stringValue);
|
|
2597
|
+
setInputValues(stringValue, stringValue);
|
|
2585
2598
|
return;
|
|
2586
2599
|
}
|
|
2587
|
-
|
|
2588
|
-
|
|
2600
|
+
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
2601
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
2589
2602
|
}, [propValue, variant, currencyFormat, decimals, formatOnBlur, isFocused]);
|
|
2590
2603
|
const getInputProps = () => {
|
|
2591
2604
|
var _a2;
|
|
@@ -2607,6 +2620,7 @@ var Input = (_a) => {
|
|
|
2607
2620
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
2608
2621
|
align: "right",
|
|
2609
2622
|
type: "text",
|
|
2623
|
+
inputMode: "decimal",
|
|
2610
2624
|
value: displayValue
|
|
2611
2625
|
});
|
|
2612
2626
|
case "percentage":
|
|
@@ -2614,6 +2628,7 @@ var Input = (_a) => {
|
|
|
2614
2628
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
2615
2629
|
type: currencyFormat ? "text" : "number",
|
|
2616
2630
|
align: "right",
|
|
2631
|
+
inputMode: currencyFormat ? "decimal" : void 0,
|
|
2617
2632
|
value: currencyFormat ? displayValue : propValue
|
|
2618
2633
|
});
|
|
2619
2634
|
default:
|
|
@@ -2660,8 +2675,7 @@ var Input = (_a) => {
|
|
|
2660
2675
|
}
|
|
2661
2676
|
};
|
|
2662
2677
|
const handleSearchReset = () => {
|
|
2663
|
-
|
|
2664
|
-
setDisplayValue("");
|
|
2678
|
+
setInputValues("", "");
|
|
2665
2679
|
if (onChange) {
|
|
2666
2680
|
const syntheticEvent = {
|
|
2667
2681
|
target: { value: "" }
|
|
@@ -2678,8 +2692,7 @@ var Input = (_a) => {
|
|
|
2678
2692
|
if (variant === "currency") {
|
|
2679
2693
|
const raw = rawValue.replace(/,/g, "");
|
|
2680
2694
|
if (raw === "") {
|
|
2681
|
-
|
|
2682
|
-
setDisplayValue("");
|
|
2695
|
+
setInputValues("", "");
|
|
2683
2696
|
if (onChange) {
|
|
2684
2697
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2685
2698
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -2700,8 +2713,8 @@ var Input = (_a) => {
|
|
|
2700
2713
|
clamped.toString(),
|
|
2701
2714
|
currentDecimals
|
|
2702
2715
|
);
|
|
2703
|
-
|
|
2704
|
-
|
|
2716
|
+
setInputValues(
|
|
2717
|
+
formattedClamped,
|
|
2705
2718
|
formatOnBlur ? formattedClamped : formatCurrencyDisplay(formattedClamped)
|
|
2706
2719
|
);
|
|
2707
2720
|
if (onChange) {
|
|
@@ -2712,8 +2725,7 @@ var Input = (_a) => {
|
|
|
2712
2725
|
}
|
|
2713
2726
|
return;
|
|
2714
2727
|
}
|
|
2715
|
-
|
|
2716
|
-
setDisplayValue(formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
2728
|
+
setInputValues(raw, formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
2717
2729
|
if (!isNaN(asNumber) && onChange) {
|
|
2718
2730
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2719
2731
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -2725,8 +2737,7 @@ var Input = (_a) => {
|
|
|
2725
2737
|
if (variant === "uom" && currencyFormat) {
|
|
2726
2738
|
const raw = rawValue.replace(/,/g, "");
|
|
2727
2739
|
if (raw === "") {
|
|
2728
|
-
|
|
2729
|
-
setDisplayValue("");
|
|
2740
|
+
setInputValues("", "");
|
|
2730
2741
|
if (onChange) {
|
|
2731
2742
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2732
2743
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -2747,8 +2758,10 @@ var Input = (_a) => {
|
|
|
2747
2758
|
clamped.toString(),
|
|
2748
2759
|
currentDecimals
|
|
2749
2760
|
);
|
|
2750
|
-
|
|
2751
|
-
|
|
2761
|
+
setInputValues(
|
|
2762
|
+
formattedClamped,
|
|
2763
|
+
formatCurrencyDisplay(formattedClamped)
|
|
2764
|
+
);
|
|
2752
2765
|
if (onChange) {
|
|
2753
2766
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2754
2767
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -2757,8 +2770,7 @@ var Input = (_a) => {
|
|
|
2757
2770
|
}
|
|
2758
2771
|
return;
|
|
2759
2772
|
}
|
|
2760
|
-
|
|
2761
|
-
setDisplayValue(formatCurrencyDisplay(raw));
|
|
2773
|
+
setInputValues(raw, formatCurrencyDisplay(raw));
|
|
2762
2774
|
if (!isNaN(asNumber) && onChange) {
|
|
2763
2775
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2764
2776
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -2775,8 +2787,7 @@ var Input = (_a) => {
|
|
|
2775
2787
|
clamped.toString(),
|
|
2776
2788
|
decimals != null ? decimals : 0
|
|
2777
2789
|
);
|
|
2778
|
-
|
|
2779
|
-
setDisplayValue(formattedClamped);
|
|
2790
|
+
setInputValues(formattedClamped, formattedClamped);
|
|
2780
2791
|
if (typeof onChange === "function") {
|
|
2781
2792
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
2782
2793
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -2785,15 +2796,13 @@ var Input = (_a) => {
|
|
|
2785
2796
|
}
|
|
2786
2797
|
return;
|
|
2787
2798
|
}
|
|
2788
|
-
|
|
2789
|
-
setDisplayValue(rawValue);
|
|
2799
|
+
setInputValues(rawValue, rawValue);
|
|
2790
2800
|
if (typeof onChange === "function") {
|
|
2791
2801
|
onChange(e);
|
|
2792
2802
|
}
|
|
2793
2803
|
return;
|
|
2794
2804
|
}
|
|
2795
|
-
|
|
2796
|
-
setDisplayValue(rawValue);
|
|
2805
|
+
setInputValues(rawValue, rawValue);
|
|
2797
2806
|
if (typeof onChange === "function") {
|
|
2798
2807
|
onChange(e);
|
|
2799
2808
|
}
|
|
@@ -2806,8 +2815,7 @@ var Input = (_a) => {
|
|
|
2806
2815
|
}
|
|
2807
2816
|
if (variant === "currency") {
|
|
2808
2817
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
2809
|
-
|
|
2810
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
2818
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
2811
2819
|
const asNumber = Number(formatted);
|
|
2812
2820
|
if (!isNaN(asNumber) && onChange) {
|
|
2813
2821
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -2818,8 +2826,7 @@ var Input = (_a) => {
|
|
|
2818
2826
|
} else if (variant === "uom") {
|
|
2819
2827
|
if (currencyFormat) {
|
|
2820
2828
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
2821
|
-
|
|
2822
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
2829
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
2823
2830
|
const asNumber = Number(formatted);
|
|
2824
2831
|
if (!isNaN(asNumber) && onChange) {
|
|
2825
2832
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
MobileDataGrid
|
|
3
|
-
} from "../../chunk-
|
|
3
|
+
} from "../../chunk-3V5OMIYB.js";
|
|
4
4
|
import "../../chunk-3UPUZBP5.js";
|
|
5
5
|
import "../../chunk-7ZJIGTFN.js";
|
|
6
6
|
import "../../chunk-E3FOCECQ.js";
|
|
@@ -13,15 +13,15 @@ import "../../chunk-3PIDINTF.js";
|
|
|
13
13
|
import "../../chunk-BQNPOGD5.js";
|
|
14
14
|
import "../../chunk-YULGJORA.js";
|
|
15
15
|
import "../../chunk-Z2HPSFEQ.js";
|
|
16
|
-
import "../../chunk-
|
|
17
|
-
import "../../chunk-
|
|
16
|
+
import "../../chunk-HRPW6VXG.js";
|
|
17
|
+
import "../../chunk-JYECZBCJ.js";
|
|
18
18
|
import "../../chunk-5IFPG6TS.js";
|
|
19
19
|
import "../../chunk-7YA3TF73.js";
|
|
20
20
|
import "../../chunk-AJ5M6MVX.js";
|
|
21
21
|
import "../../chunk-7IPESTQS.js";
|
|
22
22
|
import "../../chunk-EWGHVZL5.js";
|
|
23
23
|
import "../../chunk-AT4AWD6B.js";
|
|
24
|
-
import "../../chunk-
|
|
24
|
+
import "../../chunk-4FUZDLWX.js";
|
|
25
25
|
import "../../chunk-CIYLALYO.js";
|
|
26
26
|
import "../../chunk-KBIEWFQS.js";
|
|
27
27
|
import "../../chunk-NSZTJ5R4.js";
|
|
@@ -38,15 +38,15 @@ import "../../chunk-UARCWLMD.js";
|
|
|
38
38
|
import "../../chunk-SJZNVG4N.js";
|
|
39
39
|
import "../../chunk-75USUR3I.js";
|
|
40
40
|
import "../../chunk-BWPNXY7T.js";
|
|
41
|
-
import "../../chunk-
|
|
41
|
+
import "../../chunk-QW4AJ5FK.js";
|
|
42
42
|
import "../../chunk-3JUIYULW.js";
|
|
43
43
|
import "../../chunk-OM7QLLI2.js";
|
|
44
44
|
import "../../chunk-PE3EZP56.js";
|
|
45
|
-
import "../../chunk-
|
|
46
|
-
import "../../chunk-
|
|
45
|
+
import "../../chunk-3DJWSTPS.js";
|
|
46
|
+
import "../../chunk-H5SHC4XZ.js";
|
|
47
47
|
import "../../chunk-4UGMSWWA.js";
|
|
48
48
|
import "../../chunk-WVUIIBRR.js";
|
|
49
|
-
import "../../chunk-
|
|
49
|
+
import "../../chunk-RN465M4S.js";
|
|
50
50
|
import "../../chunk-Z5YP2GI6.js";
|
|
51
51
|
import "../../chunk-ZRFXUER3.js";
|
|
52
52
|
import "../../chunk-WVGXD7HT.js";
|
|
@@ -376,6 +376,14 @@ Paragraph.displayName = "Paragraph";
|
|
|
376
376
|
|
|
377
377
|
// src/components/Input.tsx
|
|
378
378
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
379
|
+
function hasEquivalentNumericValue(currentValue, nextValue) {
|
|
380
|
+
if (!currentValue || !nextValue) {
|
|
381
|
+
return false;
|
|
382
|
+
}
|
|
383
|
+
const currentNumericValue = Number(currentValue.replace(/,/g, ""));
|
|
384
|
+
const nextNumericValue = Number(nextValue.replace(/,/g, ""));
|
|
385
|
+
return !Number.isNaN(currentNumericValue) && !Number.isNaN(nextNumericValue) && currentNumericValue === nextNumericValue;
|
|
386
|
+
}
|
|
379
387
|
var InputBase = (_a) => {
|
|
380
388
|
var _b = _a, {
|
|
381
389
|
id,
|
|
@@ -598,28 +606,33 @@ var Input = (_a) => {
|
|
|
598
606
|
const [internalValue, setInternalValue] = (0, import_react.useState)("");
|
|
599
607
|
const [displayValue, setDisplayValue] = (0, import_react.useState)("");
|
|
600
608
|
const [isFocused, setIsFocused] = (0, import_react.useState)(false);
|
|
609
|
+
const internalValueRef = (0, import_react.useRef)("");
|
|
610
|
+
const setInputValues = (nextInternalValue, nextDisplayValue) => {
|
|
611
|
+
internalValueRef.current = nextInternalValue;
|
|
612
|
+
setInternalValue(nextInternalValue);
|
|
613
|
+
setDisplayValue(nextDisplayValue);
|
|
614
|
+
};
|
|
601
615
|
(0, import_react.useEffect)(() => {
|
|
602
616
|
var _a2;
|
|
603
617
|
const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
|
|
604
618
|
const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
|
|
605
619
|
if (!stringValue) {
|
|
606
|
-
|
|
607
|
-
setDisplayValue("");
|
|
620
|
+
setInputValues("", "");
|
|
608
621
|
return;
|
|
609
622
|
}
|
|
610
623
|
if (!shouldUseThousandsFormatting) {
|
|
611
|
-
|
|
612
|
-
|
|
624
|
+
setInputValues(stringValue, stringValue);
|
|
625
|
+
return;
|
|
626
|
+
}
|
|
627
|
+
if (isFocused && hasEquivalentNumericValue(internalValueRef.current, stringValue)) {
|
|
613
628
|
return;
|
|
614
629
|
}
|
|
615
|
-
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
616
630
|
if (formatOnBlur && isFocused) {
|
|
617
|
-
|
|
618
|
-
setDisplayValue(stringValue);
|
|
631
|
+
setInputValues(stringValue, stringValue);
|
|
619
632
|
return;
|
|
620
633
|
}
|
|
621
|
-
|
|
622
|
-
|
|
634
|
+
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
635
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
623
636
|
}, [propValue, variant, currencyFormat, decimals, formatOnBlur, isFocused]);
|
|
624
637
|
const getInputProps = () => {
|
|
625
638
|
var _a2;
|
|
@@ -641,6 +654,7 @@ var Input = (_a) => {
|
|
|
641
654
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
642
655
|
align: "right",
|
|
643
656
|
type: "text",
|
|
657
|
+
inputMode: "decimal",
|
|
644
658
|
value: displayValue
|
|
645
659
|
});
|
|
646
660
|
case "percentage":
|
|
@@ -648,6 +662,7 @@ var Input = (_a) => {
|
|
|
648
662
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
649
663
|
type: currencyFormat ? "text" : "number",
|
|
650
664
|
align: "right",
|
|
665
|
+
inputMode: currencyFormat ? "decimal" : void 0,
|
|
651
666
|
value: currencyFormat ? displayValue : propValue
|
|
652
667
|
});
|
|
653
668
|
default:
|
|
@@ -694,8 +709,7 @@ var Input = (_a) => {
|
|
|
694
709
|
}
|
|
695
710
|
};
|
|
696
711
|
const handleSearchReset = () => {
|
|
697
|
-
|
|
698
|
-
setDisplayValue("");
|
|
712
|
+
setInputValues("", "");
|
|
699
713
|
if (onChange) {
|
|
700
714
|
const syntheticEvent = {
|
|
701
715
|
target: { value: "" }
|
|
@@ -712,8 +726,7 @@ var Input = (_a) => {
|
|
|
712
726
|
if (variant === "currency") {
|
|
713
727
|
const raw = rawValue.replace(/,/g, "");
|
|
714
728
|
if (raw === "") {
|
|
715
|
-
|
|
716
|
-
setDisplayValue("");
|
|
729
|
+
setInputValues("", "");
|
|
717
730
|
if (onChange) {
|
|
718
731
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
719
732
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -734,8 +747,8 @@ var Input = (_a) => {
|
|
|
734
747
|
clamped.toString(),
|
|
735
748
|
currentDecimals
|
|
736
749
|
);
|
|
737
|
-
|
|
738
|
-
|
|
750
|
+
setInputValues(
|
|
751
|
+
formattedClamped,
|
|
739
752
|
formatOnBlur ? formattedClamped : formatCurrencyDisplay(formattedClamped)
|
|
740
753
|
);
|
|
741
754
|
if (onChange) {
|
|
@@ -746,8 +759,7 @@ var Input = (_a) => {
|
|
|
746
759
|
}
|
|
747
760
|
return;
|
|
748
761
|
}
|
|
749
|
-
|
|
750
|
-
setDisplayValue(formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
762
|
+
setInputValues(raw, formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
751
763
|
if (!isNaN(asNumber) && onChange) {
|
|
752
764
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
753
765
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -759,8 +771,7 @@ var Input = (_a) => {
|
|
|
759
771
|
if (variant === "uom" && currencyFormat) {
|
|
760
772
|
const raw = rawValue.replace(/,/g, "");
|
|
761
773
|
if (raw === "") {
|
|
762
|
-
|
|
763
|
-
setDisplayValue("");
|
|
774
|
+
setInputValues("", "");
|
|
764
775
|
if (onChange) {
|
|
765
776
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
766
777
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -781,8 +792,10 @@ var Input = (_a) => {
|
|
|
781
792
|
clamped.toString(),
|
|
782
793
|
currentDecimals
|
|
783
794
|
);
|
|
784
|
-
|
|
785
|
-
|
|
795
|
+
setInputValues(
|
|
796
|
+
formattedClamped,
|
|
797
|
+
formatCurrencyDisplay(formattedClamped)
|
|
798
|
+
);
|
|
786
799
|
if (onChange) {
|
|
787
800
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
788
801
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -791,8 +804,7 @@ var Input = (_a) => {
|
|
|
791
804
|
}
|
|
792
805
|
return;
|
|
793
806
|
}
|
|
794
|
-
|
|
795
|
-
setDisplayValue(formatCurrencyDisplay(raw));
|
|
807
|
+
setInputValues(raw, formatCurrencyDisplay(raw));
|
|
796
808
|
if (!isNaN(asNumber) && onChange) {
|
|
797
809
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
798
810
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -809,8 +821,7 @@ var Input = (_a) => {
|
|
|
809
821
|
clamped.toString(),
|
|
810
822
|
decimals != null ? decimals : 0
|
|
811
823
|
);
|
|
812
|
-
|
|
813
|
-
setDisplayValue(formattedClamped);
|
|
824
|
+
setInputValues(formattedClamped, formattedClamped);
|
|
814
825
|
if (typeof onChange === "function") {
|
|
815
826
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
816
827
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -819,15 +830,13 @@ var Input = (_a) => {
|
|
|
819
830
|
}
|
|
820
831
|
return;
|
|
821
832
|
}
|
|
822
|
-
|
|
823
|
-
setDisplayValue(rawValue);
|
|
833
|
+
setInputValues(rawValue, rawValue);
|
|
824
834
|
if (typeof onChange === "function") {
|
|
825
835
|
onChange(e);
|
|
826
836
|
}
|
|
827
837
|
return;
|
|
828
838
|
}
|
|
829
|
-
|
|
830
|
-
setDisplayValue(rawValue);
|
|
839
|
+
setInputValues(rawValue, rawValue);
|
|
831
840
|
if (typeof onChange === "function") {
|
|
832
841
|
onChange(e);
|
|
833
842
|
}
|
|
@@ -840,8 +849,7 @@ var Input = (_a) => {
|
|
|
840
849
|
}
|
|
841
850
|
if (variant === "currency") {
|
|
842
851
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
843
|
-
|
|
844
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
852
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
845
853
|
const asNumber = Number(formatted);
|
|
846
854
|
if (!isNaN(asNumber) && onChange) {
|
|
847
855
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -852,8 +860,7 @@ var Input = (_a) => {
|
|
|
852
860
|
} else if (variant === "uom") {
|
|
853
861
|
if (currencyFormat) {
|
|
854
862
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
855
|
-
|
|
856
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
863
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
857
864
|
const asNumber = Number(formatted);
|
|
858
865
|
if (!isNaN(asNumber) && onChange) {
|
|
859
866
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -376,6 +376,14 @@ Paragraph.displayName = "Paragraph";
|
|
|
376
376
|
|
|
377
377
|
// src/components/Input.tsx
|
|
378
378
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
379
|
+
function hasEquivalentNumericValue(currentValue, nextValue) {
|
|
380
|
+
if (!currentValue || !nextValue) {
|
|
381
|
+
return false;
|
|
382
|
+
}
|
|
383
|
+
const currentNumericValue = Number(currentValue.replace(/,/g, ""));
|
|
384
|
+
const nextNumericValue = Number(nextValue.replace(/,/g, ""));
|
|
385
|
+
return !Number.isNaN(currentNumericValue) && !Number.isNaN(nextNumericValue) && currentNumericValue === nextNumericValue;
|
|
386
|
+
}
|
|
379
387
|
var InputBase = (_a) => {
|
|
380
388
|
var _b = _a, {
|
|
381
389
|
id,
|
|
@@ -598,28 +606,33 @@ var Input = (_a) => {
|
|
|
598
606
|
const [internalValue, setInternalValue] = (0, import_react.useState)("");
|
|
599
607
|
const [displayValue, setDisplayValue] = (0, import_react.useState)("");
|
|
600
608
|
const [isFocused, setIsFocused] = (0, import_react.useState)(false);
|
|
609
|
+
const internalValueRef = (0, import_react.useRef)("");
|
|
610
|
+
const setInputValues = (nextInternalValue, nextDisplayValue) => {
|
|
611
|
+
internalValueRef.current = nextInternalValue;
|
|
612
|
+
setInternalValue(nextInternalValue);
|
|
613
|
+
setDisplayValue(nextDisplayValue);
|
|
614
|
+
};
|
|
601
615
|
(0, import_react.useEffect)(() => {
|
|
602
616
|
var _a2;
|
|
603
617
|
const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
|
|
604
618
|
const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
|
|
605
619
|
if (!stringValue) {
|
|
606
|
-
|
|
607
|
-
setDisplayValue("");
|
|
620
|
+
setInputValues("", "");
|
|
608
621
|
return;
|
|
609
622
|
}
|
|
610
623
|
if (!shouldUseThousandsFormatting) {
|
|
611
|
-
|
|
612
|
-
|
|
624
|
+
setInputValues(stringValue, stringValue);
|
|
625
|
+
return;
|
|
626
|
+
}
|
|
627
|
+
if (isFocused && hasEquivalentNumericValue(internalValueRef.current, stringValue)) {
|
|
613
628
|
return;
|
|
614
629
|
}
|
|
615
|
-
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
616
630
|
if (formatOnBlur && isFocused) {
|
|
617
|
-
|
|
618
|
-
setDisplayValue(stringValue);
|
|
631
|
+
setInputValues(stringValue, stringValue);
|
|
619
632
|
return;
|
|
620
633
|
}
|
|
621
|
-
|
|
622
|
-
|
|
634
|
+
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
635
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
623
636
|
}, [propValue, variant, currencyFormat, decimals, formatOnBlur, isFocused]);
|
|
624
637
|
const getInputProps = () => {
|
|
625
638
|
var _a2;
|
|
@@ -641,6 +654,7 @@ var Input = (_a) => {
|
|
|
641
654
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
642
655
|
align: "right",
|
|
643
656
|
type: "text",
|
|
657
|
+
inputMode: "decimal",
|
|
644
658
|
value: displayValue
|
|
645
659
|
});
|
|
646
660
|
case "percentage":
|
|
@@ -648,6 +662,7 @@ var Input = (_a) => {
|
|
|
648
662
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
649
663
|
type: currencyFormat ? "text" : "number",
|
|
650
664
|
align: "right",
|
|
665
|
+
inputMode: currencyFormat ? "decimal" : void 0,
|
|
651
666
|
value: currencyFormat ? displayValue : propValue
|
|
652
667
|
});
|
|
653
668
|
default:
|
|
@@ -694,8 +709,7 @@ var Input = (_a) => {
|
|
|
694
709
|
}
|
|
695
710
|
};
|
|
696
711
|
const handleSearchReset = () => {
|
|
697
|
-
|
|
698
|
-
setDisplayValue("");
|
|
712
|
+
setInputValues("", "");
|
|
699
713
|
if (onChange) {
|
|
700
714
|
const syntheticEvent = {
|
|
701
715
|
target: { value: "" }
|
|
@@ -712,8 +726,7 @@ var Input = (_a) => {
|
|
|
712
726
|
if (variant === "currency") {
|
|
713
727
|
const raw = rawValue.replace(/,/g, "");
|
|
714
728
|
if (raw === "") {
|
|
715
|
-
|
|
716
|
-
setDisplayValue("");
|
|
729
|
+
setInputValues("", "");
|
|
717
730
|
if (onChange) {
|
|
718
731
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
719
732
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -734,8 +747,8 @@ var Input = (_a) => {
|
|
|
734
747
|
clamped.toString(),
|
|
735
748
|
currentDecimals
|
|
736
749
|
);
|
|
737
|
-
|
|
738
|
-
|
|
750
|
+
setInputValues(
|
|
751
|
+
formattedClamped,
|
|
739
752
|
formatOnBlur ? formattedClamped : formatCurrencyDisplay(formattedClamped)
|
|
740
753
|
);
|
|
741
754
|
if (onChange) {
|
|
@@ -746,8 +759,7 @@ var Input = (_a) => {
|
|
|
746
759
|
}
|
|
747
760
|
return;
|
|
748
761
|
}
|
|
749
|
-
|
|
750
|
-
setDisplayValue(formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
762
|
+
setInputValues(raw, formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
751
763
|
if (!isNaN(asNumber) && onChange) {
|
|
752
764
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
753
765
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -759,8 +771,7 @@ var Input = (_a) => {
|
|
|
759
771
|
if (variant === "uom" && currencyFormat) {
|
|
760
772
|
const raw = rawValue.replace(/,/g, "");
|
|
761
773
|
if (raw === "") {
|
|
762
|
-
|
|
763
|
-
setDisplayValue("");
|
|
774
|
+
setInputValues("", "");
|
|
764
775
|
if (onChange) {
|
|
765
776
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
766
777
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -781,8 +792,10 @@ var Input = (_a) => {
|
|
|
781
792
|
clamped.toString(),
|
|
782
793
|
currentDecimals
|
|
783
794
|
);
|
|
784
|
-
|
|
785
|
-
|
|
795
|
+
setInputValues(
|
|
796
|
+
formattedClamped,
|
|
797
|
+
formatCurrencyDisplay(formattedClamped)
|
|
798
|
+
);
|
|
786
799
|
if (onChange) {
|
|
787
800
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
788
801
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -791,8 +804,7 @@ var Input = (_a) => {
|
|
|
791
804
|
}
|
|
792
805
|
return;
|
|
793
806
|
}
|
|
794
|
-
|
|
795
|
-
setDisplayValue(formatCurrencyDisplay(raw));
|
|
807
|
+
setInputValues(raw, formatCurrencyDisplay(raw));
|
|
796
808
|
if (!isNaN(asNumber) && onChange) {
|
|
797
809
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
798
810
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -809,8 +821,7 @@ var Input = (_a) => {
|
|
|
809
821
|
clamped.toString(),
|
|
810
822
|
decimals != null ? decimals : 0
|
|
811
823
|
);
|
|
812
|
-
|
|
813
|
-
setDisplayValue(formattedClamped);
|
|
824
|
+
setInputValues(formattedClamped, formattedClamped);
|
|
814
825
|
if (typeof onChange === "function") {
|
|
815
826
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
816
827
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -819,15 +830,13 @@ var Input = (_a) => {
|
|
|
819
830
|
}
|
|
820
831
|
return;
|
|
821
832
|
}
|
|
822
|
-
|
|
823
|
-
setDisplayValue(rawValue);
|
|
833
|
+
setInputValues(rawValue, rawValue);
|
|
824
834
|
if (typeof onChange === "function") {
|
|
825
835
|
onChange(e);
|
|
826
836
|
}
|
|
827
837
|
return;
|
|
828
838
|
}
|
|
829
|
-
|
|
830
|
-
setDisplayValue(rawValue);
|
|
839
|
+
setInputValues(rawValue, rawValue);
|
|
831
840
|
if (typeof onChange === "function") {
|
|
832
841
|
onChange(e);
|
|
833
842
|
}
|
|
@@ -840,8 +849,7 @@ var Input = (_a) => {
|
|
|
840
849
|
}
|
|
841
850
|
if (variant === "currency") {
|
|
842
851
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
843
|
-
|
|
844
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
852
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
845
853
|
const asNumber = Number(formatted);
|
|
846
854
|
if (!isNaN(asNumber) && onChange) {
|
|
847
855
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -852,8 +860,7 @@ var Input = (_a) => {
|
|
|
852
860
|
} else if (variant === "uom") {
|
|
853
861
|
if (currencyFormat) {
|
|
854
862
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
855
|
-
|
|
856
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
863
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
857
864
|
const asNumber = Number(formatted);
|
|
858
865
|
if (!isNaN(asNumber) && onChange) {
|
|
859
866
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
3
|
Search
|
|
4
|
-
} from "../chunk-
|
|
5
|
-
import "../chunk-
|
|
4
|
+
} from "../chunk-3DJWSTPS.js";
|
|
5
|
+
import "../chunk-H5SHC4XZ.js";
|
|
6
6
|
import "../chunk-4UGMSWWA.js";
|
|
7
7
|
import "../chunk-5UH6QUFB.js";
|
|
8
8
|
import "../chunk-7MBRCM3M.js";
|