@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.
Files changed (78) hide show
  1. package/dist/{chunk-MOBFZ672.js → chunk-3DJWSTPS.js} +1 -1
  2. package/dist/{chunk-5UPADXVU.js → chunk-3V5OMIYB.js} +6 -6
  3. package/dist/{chunk-EA6Y4HXQ.js → chunk-4FUZDLWX.js} +1 -1
  4. package/dist/{chunk-PABII472.js → chunk-H5SHC4XZ.js} +40 -33
  5. package/dist/{chunk-MAEVKATN.js → chunk-HRPW6VXG.js} +1 -1
  6. package/dist/{chunk-OG2PGA3X.js → chunk-JYECZBCJ.js} +1 -1
  7. package/dist/{chunk-PBJ2MEHM.js → chunk-QW4AJ5FK.js} +1 -1
  8. package/dist/{chunk-I3W5K76C.js → chunk-RN465M4S.js} +1 -1
  9. package/dist/components/CalendarRange.cjs +41 -34
  10. package/dist/components/CalendarRange.css +3 -0
  11. package/dist/components/CalendarRange.js +8 -8
  12. package/dist/components/Checkbox.cjs +1 -1
  13. package/dist/components/Checkbox.js +1 -1
  14. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.cjs +41 -34
  15. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.css +3 -0
  16. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.js +8 -8
  17. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs +41 -34
  18. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.css +3 -0
  19. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js +8 -8
  20. package/dist/components/DataGrid/PinnedColumns.cjs +41 -34
  21. package/dist/components/DataGrid/PinnedColumns.css +3 -0
  22. package/dist/components/DataGrid/PinnedColumns.js +8 -8
  23. package/dist/components/DataGrid/TableBody/LoadingCell.cjs +41 -34
  24. package/dist/components/DataGrid/TableBody/LoadingCell.css +3 -0
  25. package/dist/components/DataGrid/TableBody/LoadingCell.js +8 -8
  26. package/dist/components/DataGrid/TableBody/TableBodyRow.cjs +41 -34
  27. package/dist/components/DataGrid/TableBody/TableBodyRow.css +3 -0
  28. package/dist/components/DataGrid/TableBody/TableBodyRow.js +8 -8
  29. package/dist/components/DataGrid/TableBody/index.cjs +41 -34
  30. package/dist/components/DataGrid/TableBody/index.css +3 -0
  31. package/dist/components/DataGrid/TableBody/index.js +8 -8
  32. package/dist/components/DataGrid/index.cjs +41 -34
  33. package/dist/components/DataGrid/index.css +3 -0
  34. package/dist/components/DataGrid/index.js +8 -8
  35. package/dist/components/DataGrid/utils.cjs +41 -34
  36. package/dist/components/DataGrid/utils.css +3 -0
  37. package/dist/components/DataGrid/utils.js +8 -8
  38. package/dist/components/DataGridCell.cjs +40 -33
  39. package/dist/components/DataGridCell.js +3 -3
  40. package/dist/components/DateInput.cjs +41 -34
  41. package/dist/components/DateInput.css +3 -0
  42. package/dist/components/DateInput.js +8 -8
  43. package/dist/components/DateRangeInput.cjs +41 -34
  44. package/dist/components/DateRangeInput.css +3 -0
  45. package/dist/components/DateRangeInput.js +8 -8
  46. package/dist/components/FilterGroup.cjs +41 -34
  47. package/dist/components/FilterGroup.js +3 -3
  48. package/dist/components/Input.cjs +40 -33
  49. package/dist/components/Input.js +1 -1
  50. package/dist/components/MobileDataGrid/ColumnList.cjs +1 -1
  51. package/dist/components/MobileDataGrid/ColumnList.css +3 -0
  52. package/dist/components/MobileDataGrid/ColumnList.js +3 -3
  53. package/dist/components/MobileDataGrid/ColumnSelector/index.cjs +41 -34
  54. package/dist/components/MobileDataGrid/ColumnSelector/index.css +3 -0
  55. package/dist/components/MobileDataGrid/ColumnSelector/index.js +8 -8
  56. package/dist/components/MobileDataGrid/MobileDataGridCard/index.cjs +1 -1
  57. package/dist/components/MobileDataGrid/MobileDataGridCard/index.js +2 -2
  58. package/dist/components/MobileDataGrid/MobileDataGridHeader.cjs +41 -34
  59. package/dist/components/MobileDataGrid/MobileDataGridHeader.css +3 -0
  60. package/dist/components/MobileDataGrid/MobileDataGridHeader.js +8 -8
  61. package/dist/components/MobileDataGrid/index.cjs +41 -34
  62. package/dist/components/MobileDataGrid/index.css +3 -0
  63. package/dist/components/MobileDataGrid/index.js +8 -8
  64. package/dist/components/Password.cjs +40 -33
  65. package/dist/components/Password.js +1 -1
  66. package/dist/components/Search.cjs +40 -33
  67. package/dist/components/Search.js +2 -2
  68. package/dist/components/Select.cjs +40 -33
  69. package/dist/components/Select.js +2 -2
  70. package/dist/components/Stepper.cjs +40 -33
  71. package/dist/components/Stepper.js +1 -1
  72. package/dist/components/Time.cjs +40 -33
  73. package/dist/components/Time.js +1 -1
  74. package/dist/components/index.cjs +41 -34
  75. package/dist/components/index.css +3 -0
  76. package/dist/components/index.js +8 -8
  77. package/dist/index.css +3 -0
  78. 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
- setInternalValue("");
1661
- setDisplayValue("");
1674
+ setInputValues("", "");
1662
1675
  return;
1663
1676
  }
1664
1677
  if (!shouldUseThousandsFormatting) {
1665
- setInternalValue(stringValue);
1666
- setDisplayValue(stringValue);
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
- setInternalValue(stringValue);
1672
- setDisplayValue(stringValue);
1685
+ setInputValues(stringValue, stringValue);
1673
1686
  return;
1674
1687
  }
1675
- setInternalValue(formatted);
1676
- setDisplayValue(formatCurrencyDisplay(formatted));
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
- setInternalValue("");
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
1792
- setDisplayValue(
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
- setInternalValue(raw);
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
1839
- setDisplayValue(formatCurrencyDisplay(formattedClamped));
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
- setInternalValue(raw);
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
- setInternalValue(formattedClamped);
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
- setInternalValue(rawValue);
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
- setInternalValue(rawValue);
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
- setInternalValue(formatted);
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
- setInternalValue(formatted);
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-PBJ2MEHM.js";
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-MOBFZ672.js";
12
- import "../chunk-PABII472.js";
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
- setInternalValue("");
608
- setDisplayValue("");
621
+ setInputValues("", "");
609
622
  return;
610
623
  }
611
624
  if (!shouldUseThousandsFormatting) {
612
- setInternalValue(stringValue);
613
- setDisplayValue(stringValue);
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
- setInternalValue(stringValue);
619
- setDisplayValue(stringValue);
632
+ setInputValues(stringValue, stringValue);
620
633
  return;
621
634
  }
622
- setInternalValue(formatted);
623
- setDisplayValue(formatCurrencyDisplay(formatted));
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
- setInternalValue("");
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
739
- setDisplayValue(
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
- setInternalValue(raw);
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
786
- setDisplayValue(formatCurrencyDisplay(formattedClamped));
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
- setInternalValue(raw);
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
- setInternalValue(formattedClamped);
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
- setInternalValue(rawValue);
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
- setInternalValue(rawValue);
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
- setInternalValue(formatted);
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
- setInternalValue(formatted);
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
@@ -2327,6 +2327,9 @@
2327
2327
  .text-nowrap {
2328
2328
  text-wrap: nowrap;
2329
2329
  }
2330
+ .text-wrap {
2331
+ text-wrap: wrap;
2332
+ }
2330
2333
  .text-ellipsis {
2331
2334
  text-overflow: ellipsis;
2332
2335
  }
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DateInput
3
- } from "../chunk-5UPADXVU.js";
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-MAEVKATN.js";
17
- import "../chunk-OG2PGA3X.js";
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-EA6Y4HXQ.js";
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-PBJ2MEHM.js";
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-MOBFZ672.js";
46
- import "../chunk-PABII472.js";
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-I3W5K76C.js";
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
- setInternalValue("");
607
- setDisplayValue("");
620
+ setInputValues("", "");
608
621
  return;
609
622
  }
610
623
  if (!shouldUseThousandsFormatting) {
611
- setInternalValue(stringValue);
612
- setDisplayValue(stringValue);
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
- setInternalValue(stringValue);
618
- setDisplayValue(stringValue);
631
+ setInputValues(stringValue, stringValue);
619
632
  return;
620
633
  }
621
- setInternalValue(formatted);
622
- setDisplayValue(formatCurrencyDisplay(formatted));
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
- setInternalValue("");
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
738
- setDisplayValue(
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
- setInternalValue(raw);
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
- setInternalValue("");
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
- setInternalValue(formattedClamped);
785
- setDisplayValue(formatCurrencyDisplay(formattedClamped));
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
- setInternalValue(raw);
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
- setInternalValue(formattedClamped);
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
- setInternalValue(rawValue);
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
- setInternalValue(rawValue);
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
- setInternalValue(formatted);
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
- setInternalValue(formatted);
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
@@ -2327,6 +2327,9 @@
2327
2327
  .text-nowrap {
2328
2328
  text-wrap: nowrap;
2329
2329
  }
2330
+ .text-wrap {
2331
+ text-wrap: wrap;
2332
+ }
2330
2333
  .text-ellipsis {
2331
2334
  text-overflow: ellipsis;
2332
2335
  }