@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
|
@@ -1430,6 +1430,14 @@ var import_react11 = require("react");
|
|
|
1430
1430
|
var import_react10 = require("react");
|
|
1431
1431
|
var import_clsx8 = __toESM(require("clsx"), 1);
|
|
1432
1432
|
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
1433
|
+
function hasEquivalentNumericValue(currentValue, nextValue) {
|
|
1434
|
+
if (!currentValue || !nextValue) {
|
|
1435
|
+
return false;
|
|
1436
|
+
}
|
|
1437
|
+
const currentNumericValue = Number(currentValue.replace(/,/g, ""));
|
|
1438
|
+
const nextNumericValue = Number(nextValue.replace(/,/g, ""));
|
|
1439
|
+
return !Number.isNaN(currentNumericValue) && !Number.isNaN(nextNumericValue) && currentNumericValue === nextNumericValue;
|
|
1440
|
+
}
|
|
1433
1441
|
var InputBase = (_a) => {
|
|
1434
1442
|
var _b = _a, {
|
|
1435
1443
|
id,
|
|
@@ -1652,28 +1660,33 @@ var Input = (_a) => {
|
|
|
1652
1660
|
const [internalValue, setInternalValue] = (0, import_react10.useState)("");
|
|
1653
1661
|
const [displayValue, setDisplayValue] = (0, import_react10.useState)("");
|
|
1654
1662
|
const [isFocused, setIsFocused] = (0, import_react10.useState)(false);
|
|
1663
|
+
const internalValueRef = (0, import_react10.useRef)("");
|
|
1664
|
+
const setInputValues = (nextInternalValue, nextDisplayValue) => {
|
|
1665
|
+
internalValueRef.current = nextInternalValue;
|
|
1666
|
+
setInternalValue(nextInternalValue);
|
|
1667
|
+
setDisplayValue(nextDisplayValue);
|
|
1668
|
+
};
|
|
1655
1669
|
(0, import_react10.useEffect)(() => {
|
|
1656
1670
|
var _a2;
|
|
1657
1671
|
const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
|
|
1658
1672
|
const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
|
|
1659
1673
|
if (!stringValue) {
|
|
1660
|
-
|
|
1661
|
-
setDisplayValue("");
|
|
1674
|
+
setInputValues("", "");
|
|
1662
1675
|
return;
|
|
1663
1676
|
}
|
|
1664
1677
|
if (!shouldUseThousandsFormatting) {
|
|
1665
|
-
|
|
1666
|
-
|
|
1678
|
+
setInputValues(stringValue, stringValue);
|
|
1679
|
+
return;
|
|
1680
|
+
}
|
|
1681
|
+
if (isFocused && hasEquivalentNumericValue(internalValueRef.current, stringValue)) {
|
|
1667
1682
|
return;
|
|
1668
1683
|
}
|
|
1669
|
-
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
1670
1684
|
if (formatOnBlur && isFocused) {
|
|
1671
|
-
|
|
1672
|
-
setDisplayValue(stringValue);
|
|
1685
|
+
setInputValues(stringValue, stringValue);
|
|
1673
1686
|
return;
|
|
1674
1687
|
}
|
|
1675
|
-
|
|
1676
|
-
|
|
1688
|
+
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
1689
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
1677
1690
|
}, [propValue, variant, currencyFormat, decimals, formatOnBlur, isFocused]);
|
|
1678
1691
|
const getInputProps = () => {
|
|
1679
1692
|
var _a2;
|
|
@@ -1695,6 +1708,7 @@ var Input = (_a) => {
|
|
|
1695
1708
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
1696
1709
|
align: "right",
|
|
1697
1710
|
type: "text",
|
|
1711
|
+
inputMode: "decimal",
|
|
1698
1712
|
value: displayValue
|
|
1699
1713
|
});
|
|
1700
1714
|
case "percentage":
|
|
@@ -1702,6 +1716,7 @@ var Input = (_a) => {
|
|
|
1702
1716
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
1703
1717
|
type: currencyFormat ? "text" : "number",
|
|
1704
1718
|
align: "right",
|
|
1719
|
+
inputMode: currencyFormat ? "decimal" : void 0,
|
|
1705
1720
|
value: currencyFormat ? displayValue : propValue
|
|
1706
1721
|
});
|
|
1707
1722
|
default:
|
|
@@ -1748,8 +1763,7 @@ var Input = (_a) => {
|
|
|
1748
1763
|
}
|
|
1749
1764
|
};
|
|
1750
1765
|
const handleSearchReset = () => {
|
|
1751
|
-
|
|
1752
|
-
setDisplayValue("");
|
|
1766
|
+
setInputValues("", "");
|
|
1753
1767
|
if (onChange) {
|
|
1754
1768
|
const syntheticEvent = {
|
|
1755
1769
|
target: { value: "" }
|
|
@@ -1766,8 +1780,7 @@ var Input = (_a) => {
|
|
|
1766
1780
|
if (variant === "currency") {
|
|
1767
1781
|
const raw = rawValue.replace(/,/g, "");
|
|
1768
1782
|
if (raw === "") {
|
|
1769
|
-
|
|
1770
|
-
setDisplayValue("");
|
|
1783
|
+
setInputValues("", "");
|
|
1771
1784
|
if (onChange) {
|
|
1772
1785
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1773
1786
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -1788,8 +1801,8 @@ var Input = (_a) => {
|
|
|
1788
1801
|
clamped.toString(),
|
|
1789
1802
|
currentDecimals
|
|
1790
1803
|
);
|
|
1791
|
-
|
|
1792
|
-
|
|
1804
|
+
setInputValues(
|
|
1805
|
+
formattedClamped,
|
|
1793
1806
|
formatOnBlur ? formattedClamped : formatCurrencyDisplay(formattedClamped)
|
|
1794
1807
|
);
|
|
1795
1808
|
if (onChange) {
|
|
@@ -1800,8 +1813,7 @@ var Input = (_a) => {
|
|
|
1800
1813
|
}
|
|
1801
1814
|
return;
|
|
1802
1815
|
}
|
|
1803
|
-
|
|
1804
|
-
setDisplayValue(formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
1816
|
+
setInputValues(raw, formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
1805
1817
|
if (!isNaN(asNumber) && onChange) {
|
|
1806
1818
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1807
1819
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -1813,8 +1825,7 @@ var Input = (_a) => {
|
|
|
1813
1825
|
if (variant === "uom" && currencyFormat) {
|
|
1814
1826
|
const raw = rawValue.replace(/,/g, "");
|
|
1815
1827
|
if (raw === "") {
|
|
1816
|
-
|
|
1817
|
-
setDisplayValue("");
|
|
1828
|
+
setInputValues("", "");
|
|
1818
1829
|
if (onChange) {
|
|
1819
1830
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1820
1831
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -1835,8 +1846,10 @@ var Input = (_a) => {
|
|
|
1835
1846
|
clamped.toString(),
|
|
1836
1847
|
currentDecimals
|
|
1837
1848
|
);
|
|
1838
|
-
|
|
1839
|
-
|
|
1849
|
+
setInputValues(
|
|
1850
|
+
formattedClamped,
|
|
1851
|
+
formatCurrencyDisplay(formattedClamped)
|
|
1852
|
+
);
|
|
1840
1853
|
if (onChange) {
|
|
1841
1854
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1842
1855
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -1845,8 +1858,7 @@ var Input = (_a) => {
|
|
|
1845
1858
|
}
|
|
1846
1859
|
return;
|
|
1847
1860
|
}
|
|
1848
|
-
|
|
1849
|
-
setDisplayValue(formatCurrencyDisplay(raw));
|
|
1861
|
+
setInputValues(raw, formatCurrencyDisplay(raw));
|
|
1850
1862
|
if (!isNaN(asNumber) && onChange) {
|
|
1851
1863
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1852
1864
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -1863,8 +1875,7 @@ var Input = (_a) => {
|
|
|
1863
1875
|
clamped.toString(),
|
|
1864
1876
|
decimals != null ? decimals : 0
|
|
1865
1877
|
);
|
|
1866
|
-
|
|
1867
|
-
setDisplayValue(formattedClamped);
|
|
1878
|
+
setInputValues(formattedClamped, formattedClamped);
|
|
1868
1879
|
if (typeof onChange === "function") {
|
|
1869
1880
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
1870
1881
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -1873,15 +1884,13 @@ var Input = (_a) => {
|
|
|
1873
1884
|
}
|
|
1874
1885
|
return;
|
|
1875
1886
|
}
|
|
1876
|
-
|
|
1877
|
-
setDisplayValue(rawValue);
|
|
1887
|
+
setInputValues(rawValue, rawValue);
|
|
1878
1888
|
if (typeof onChange === "function") {
|
|
1879
1889
|
onChange(e);
|
|
1880
1890
|
}
|
|
1881
1891
|
return;
|
|
1882
1892
|
}
|
|
1883
|
-
|
|
1884
|
-
setDisplayValue(rawValue);
|
|
1893
|
+
setInputValues(rawValue, rawValue);
|
|
1885
1894
|
if (typeof onChange === "function") {
|
|
1886
1895
|
onChange(e);
|
|
1887
1896
|
}
|
|
@@ -1894,8 +1903,7 @@ var Input = (_a) => {
|
|
|
1894
1903
|
}
|
|
1895
1904
|
if (variant === "currency") {
|
|
1896
1905
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
1897
|
-
|
|
1898
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
1906
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
1899
1907
|
const asNumber = Number(formatted);
|
|
1900
1908
|
if (!isNaN(asNumber) && onChange) {
|
|
1901
1909
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -1906,8 +1914,7 @@ var Input = (_a) => {
|
|
|
1906
1914
|
} else if (variant === "uom") {
|
|
1907
1915
|
if (currencyFormat) {
|
|
1908
1916
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
1909
|
-
|
|
1910
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
1917
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
1911
1918
|
const asNumber = Number(formatted);
|
|
1912
1919
|
if (!isNaN(asNumber) && onChange) {
|
|
1913
1920
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -4,12 +4,12 @@ import {
|
|
|
4
4
|
DataGridCell,
|
|
5
5
|
DragAlongCell,
|
|
6
6
|
DraggableCellHeader
|
|
7
|
-
} from "../chunk-
|
|
7
|
+
} from "../chunk-QW4AJ5FK.js";
|
|
8
8
|
import "../chunk-3JUIYULW.js";
|
|
9
9
|
import "../chunk-OM7QLLI2.js";
|
|
10
10
|
import "../chunk-PE3EZP56.js";
|
|
11
|
-
import "../chunk-
|
|
12
|
-
import "../chunk-
|
|
11
|
+
import "../chunk-3DJWSTPS.js";
|
|
12
|
+
import "../chunk-H5SHC4XZ.js";
|
|
13
13
|
import "../chunk-4UGMSWWA.js";
|
|
14
14
|
import "../chunk-WVUIIBRR.js";
|
|
15
15
|
import "../chunk-ZRFXUER3.js";
|
|
@@ -377,6 +377,14 @@ Paragraph.displayName = "Paragraph";
|
|
|
377
377
|
|
|
378
378
|
// src/components/Input.tsx
|
|
379
379
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
380
|
+
function hasEquivalentNumericValue(currentValue, nextValue) {
|
|
381
|
+
if (!currentValue || !nextValue) {
|
|
382
|
+
return false;
|
|
383
|
+
}
|
|
384
|
+
const currentNumericValue = Number(currentValue.replace(/,/g, ""));
|
|
385
|
+
const nextNumericValue = Number(nextValue.replace(/,/g, ""));
|
|
386
|
+
return !Number.isNaN(currentNumericValue) && !Number.isNaN(nextNumericValue) && currentNumericValue === nextNumericValue;
|
|
387
|
+
}
|
|
380
388
|
var InputBase = (_a) => {
|
|
381
389
|
var _b = _a, {
|
|
382
390
|
id,
|
|
@@ -599,28 +607,33 @@ var Input = (_a) => {
|
|
|
599
607
|
const [internalValue, setInternalValue] = (0, import_react.useState)("");
|
|
600
608
|
const [displayValue, setDisplayValue] = (0, import_react.useState)("");
|
|
601
609
|
const [isFocused, setIsFocused] = (0, import_react.useState)(false);
|
|
610
|
+
const internalValueRef = (0, import_react.useRef)("");
|
|
611
|
+
const setInputValues = (nextInternalValue, nextDisplayValue) => {
|
|
612
|
+
internalValueRef.current = nextInternalValue;
|
|
613
|
+
setInternalValue(nextInternalValue);
|
|
614
|
+
setDisplayValue(nextDisplayValue);
|
|
615
|
+
};
|
|
602
616
|
(0, import_react.useEffect)(() => {
|
|
603
617
|
var _a2;
|
|
604
618
|
const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
|
|
605
619
|
const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
|
|
606
620
|
if (!stringValue) {
|
|
607
|
-
|
|
608
|
-
setDisplayValue("");
|
|
621
|
+
setInputValues("", "");
|
|
609
622
|
return;
|
|
610
623
|
}
|
|
611
624
|
if (!shouldUseThousandsFormatting) {
|
|
612
|
-
|
|
613
|
-
|
|
625
|
+
setInputValues(stringValue, stringValue);
|
|
626
|
+
return;
|
|
627
|
+
}
|
|
628
|
+
if (isFocused && hasEquivalentNumericValue(internalValueRef.current, stringValue)) {
|
|
614
629
|
return;
|
|
615
630
|
}
|
|
616
|
-
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
617
631
|
if (formatOnBlur && isFocused) {
|
|
618
|
-
|
|
619
|
-
setDisplayValue(stringValue);
|
|
632
|
+
setInputValues(stringValue, stringValue);
|
|
620
633
|
return;
|
|
621
634
|
}
|
|
622
|
-
|
|
623
|
-
|
|
635
|
+
const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
|
|
636
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
624
637
|
}, [propValue, variant, currencyFormat, decimals, formatOnBlur, isFocused]);
|
|
625
638
|
const getInputProps = () => {
|
|
626
639
|
var _a2;
|
|
@@ -642,6 +655,7 @@ var Input = (_a) => {
|
|
|
642
655
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
643
656
|
align: "right",
|
|
644
657
|
type: "text",
|
|
658
|
+
inputMode: "decimal",
|
|
645
659
|
value: displayValue
|
|
646
660
|
});
|
|
647
661
|
case "percentage":
|
|
@@ -649,6 +663,7 @@ var Input = (_a) => {
|
|
|
649
663
|
return __spreadProps(__spreadValues({}, baseProps), {
|
|
650
664
|
type: currencyFormat ? "text" : "number",
|
|
651
665
|
align: "right",
|
|
666
|
+
inputMode: currencyFormat ? "decimal" : void 0,
|
|
652
667
|
value: currencyFormat ? displayValue : propValue
|
|
653
668
|
});
|
|
654
669
|
default:
|
|
@@ -695,8 +710,7 @@ var Input = (_a) => {
|
|
|
695
710
|
}
|
|
696
711
|
};
|
|
697
712
|
const handleSearchReset = () => {
|
|
698
|
-
|
|
699
|
-
setDisplayValue("");
|
|
713
|
+
setInputValues("", "");
|
|
700
714
|
if (onChange) {
|
|
701
715
|
const syntheticEvent = {
|
|
702
716
|
target: { value: "" }
|
|
@@ -713,8 +727,7 @@ var Input = (_a) => {
|
|
|
713
727
|
if (variant === "currency") {
|
|
714
728
|
const raw = rawValue.replace(/,/g, "");
|
|
715
729
|
if (raw === "") {
|
|
716
|
-
|
|
717
|
-
setDisplayValue("");
|
|
730
|
+
setInputValues("", "");
|
|
718
731
|
if (onChange) {
|
|
719
732
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
720
733
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -735,8 +748,8 @@ var Input = (_a) => {
|
|
|
735
748
|
clamped.toString(),
|
|
736
749
|
currentDecimals
|
|
737
750
|
);
|
|
738
|
-
|
|
739
|
-
|
|
751
|
+
setInputValues(
|
|
752
|
+
formattedClamped,
|
|
740
753
|
formatOnBlur ? formattedClamped : formatCurrencyDisplay(formattedClamped)
|
|
741
754
|
);
|
|
742
755
|
if (onChange) {
|
|
@@ -747,8 +760,7 @@ var Input = (_a) => {
|
|
|
747
760
|
}
|
|
748
761
|
return;
|
|
749
762
|
}
|
|
750
|
-
|
|
751
|
-
setDisplayValue(formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
763
|
+
setInputValues(raw, formatOnBlur ? raw : formatCurrencyDisplay(raw));
|
|
752
764
|
if (!isNaN(asNumber) && onChange) {
|
|
753
765
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
754
766
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -760,8 +772,7 @@ var Input = (_a) => {
|
|
|
760
772
|
if (variant === "uom" && currencyFormat) {
|
|
761
773
|
const raw = rawValue.replace(/,/g, "");
|
|
762
774
|
if (raw === "") {
|
|
763
|
-
|
|
764
|
-
setDisplayValue("");
|
|
775
|
+
setInputValues("", "");
|
|
765
776
|
if (onChange) {
|
|
766
777
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
767
778
|
target: __spreadProps(__spreadValues({}, e.target), { value: "" })
|
|
@@ -782,8 +793,10 @@ var Input = (_a) => {
|
|
|
782
793
|
clamped.toString(),
|
|
783
794
|
currentDecimals
|
|
784
795
|
);
|
|
785
|
-
|
|
786
|
-
|
|
796
|
+
setInputValues(
|
|
797
|
+
formattedClamped,
|
|
798
|
+
formatCurrencyDisplay(formattedClamped)
|
|
799
|
+
);
|
|
787
800
|
if (onChange) {
|
|
788
801
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
789
802
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -792,8 +805,7 @@ var Input = (_a) => {
|
|
|
792
805
|
}
|
|
793
806
|
return;
|
|
794
807
|
}
|
|
795
|
-
|
|
796
|
-
setDisplayValue(formatCurrencyDisplay(raw));
|
|
808
|
+
setInputValues(raw, formatCurrencyDisplay(raw));
|
|
797
809
|
if (!isNaN(asNumber) && onChange) {
|
|
798
810
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
799
811
|
target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
|
|
@@ -810,8 +822,7 @@ var Input = (_a) => {
|
|
|
810
822
|
clamped.toString(),
|
|
811
823
|
decimals != null ? decimals : 0
|
|
812
824
|
);
|
|
813
|
-
|
|
814
|
-
setDisplayValue(formattedClamped);
|
|
825
|
+
setInputValues(formattedClamped, formattedClamped);
|
|
815
826
|
if (typeof onChange === "function") {
|
|
816
827
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
817
828
|
target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
|
|
@@ -820,15 +831,13 @@ var Input = (_a) => {
|
|
|
820
831
|
}
|
|
821
832
|
return;
|
|
822
833
|
}
|
|
823
|
-
|
|
824
|
-
setDisplayValue(rawValue);
|
|
834
|
+
setInputValues(rawValue, rawValue);
|
|
825
835
|
if (typeof onChange === "function") {
|
|
826
836
|
onChange(e);
|
|
827
837
|
}
|
|
828
838
|
return;
|
|
829
839
|
}
|
|
830
|
-
|
|
831
|
-
setDisplayValue(rawValue);
|
|
840
|
+
setInputValues(rawValue, rawValue);
|
|
832
841
|
if (typeof onChange === "function") {
|
|
833
842
|
onChange(e);
|
|
834
843
|
}
|
|
@@ -841,8 +850,7 @@ var Input = (_a) => {
|
|
|
841
850
|
}
|
|
842
851
|
if (variant === "currency") {
|
|
843
852
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
844
|
-
|
|
845
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
853
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
846
854
|
const asNumber = Number(formatted);
|
|
847
855
|
if (!isNaN(asNumber) && onChange) {
|
|
848
856
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -853,8 +861,7 @@ var Input = (_a) => {
|
|
|
853
861
|
} else if (variant === "uom") {
|
|
854
862
|
if (currencyFormat) {
|
|
855
863
|
const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
|
|
856
|
-
|
|
857
|
-
setDisplayValue(formatCurrencyDisplay(formatted));
|
|
864
|
+
setInputValues(formatted, formatCurrencyDisplay(formatted));
|
|
858
865
|
const asNumber = Number(formatted);
|
|
859
866
|
if (!isNaN(asNumber) && onChange) {
|
|
860
867
|
const syntheticEvent = __spreadProps(__spreadValues({}, e), {
|
|
@@ -4421,7 +4428,7 @@ var Checkbox = (_a) => {
|
|
|
4421
4428
|
as: "span",
|
|
4422
4429
|
padded: true,
|
|
4423
4430
|
className: (0, import_clsx17.default)(
|
|
4424
|
-
"text-nowrap",
|
|
4431
|
+
!(paragraphClassName == null ? void 0 : paragraphClassName.includes("text-wrap")) && "text-nowrap",
|
|
4425
4432
|
disabled && !error && "!text-text-primary-disabled",
|
|
4426
4433
|
error && !disabled && !readOnly && "!text-text-primary-error",
|
|
4427
4434
|
paragraphClassName
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
DateInput
|
|
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), {
|
|
@@ -4448,7 +4455,7 @@ var Checkbox = (_a) => {
|
|
|
4448
4455
|
as: "span",
|
|
4449
4456
|
padded: true,
|
|
4450
4457
|
className: (0, import_clsx17.default)(
|
|
4451
|
-
"text-nowrap",
|
|
4458
|
+
!(paragraphClassName == null ? void 0 : paragraphClassName.includes("text-wrap")) && "text-nowrap",
|
|
4452
4459
|
disabled && !error && "!text-text-primary-disabled",
|
|
4453
4460
|
error && !disabled && !readOnly && "!text-text-primary-error",
|
|
4454
4461
|
paragraphClassName
|