@dmsi/wedgekit-react 0.0.1010 → 0.0.1011

package/dist/components/Time.cjs

@@ -569,6 +569,7 @@ var Input = (_a) => {
     variant = "default",
     decimals,
     uom,
+    currencyFormat = false,
     removeSearchIcon,
     value: propValue,
     onChange,
@@ -581,6 +582,7 @@ var Input = (_a) => {
     "variant",
     "decimals",
     "uom",
+    "currencyFormat",
     "removeSearchIcon",
     "value",
     "onChange",
@@ -595,22 +597,21 @@ var Input = (_a) => {
   (0, import_react.useEffect)(() => {
     var _a2;
     const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
-    setInternalValue(stringValue);
-    setDisplayValue(stringValue);
-  }, [propValue]);
-  (0, import_react.useEffect)(() => {
-    var _a2;
-    if (variant !== "currency") {
+    const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
+    if (!stringValue) {
+      setInternalValue("");
+      setDisplayValue("");
       return;
     }
-    const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
-    if (!stringValue) {
+    if (!shouldUseThousandsFormatting) {
+      setInternalValue(stringValue);
+      setDisplayValue(stringValue);
       return;
     }
     const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
     setInternalValue(formatted);
     setDisplayValue(formatCurrencyDisplay(formatted));
-  }, []);
+  }, [propValue, variant, currencyFormat, decimals]);
   const getInputProps = () => {
     var _a2;
     const baseProps = __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, props), {
@@ -636,8 +637,9 @@ var Input = (_a) => {
       case "percentage":
       case "uom":
         return __spreadProps(__spreadValues({}, baseProps), {
-          type: "number",
-          align: "right"
+          type: currencyFormat ? "text" : "number",
+          align: "right",
+          value: currencyFormat ? displayValue : propValue
         });
       default:
         return baseProps;
@@ -650,6 +652,8 @@ var Input = (_a) => {
         return !removeSearchIcon ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { name: "search" }) }) : null;
       case "currency":
         return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { name: "attach_money" }) });
+      case "uom":
+        return currencyFormat ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { name: "attach_money" }) }) : null;
       default:
         return null;
     }
@@ -741,6 +745,51 @@ var Input = (_a) => {
       }
       return;
     }
+    if (variant === "uom" && currencyFormat) {
+      const raw = rawValue.replace(/,/g, "");
+      if (raw === "") {
+        setInternalValue("");
+        setDisplayValue("");
+        if (onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: "" })
+          });
+          onChange(syntheticEvent);
+        }
+        return;
+      }
+      const regex = /^\d*\.?\d*$/;
+      if (!regex.test(raw)) return;
+      const parts = raw.split(".");
+      const currentDecimals = decimals != null ? decimals : 2;
+      if (parts.length === 2 && parts[1].length > currentDecimals) return;
+      const asNumber = Number(raw);
+      if (!isNaN(asNumber) && maxNumber != null && asNumber > maxNumber) {
+        const clamped = maxNumber;
+        const formattedClamped = formatDecimalValue(
+          clamped.toString(),
+          currentDecimals
+        );
+        setInternalValue(formattedClamped);
+        setDisplayValue(formatCurrencyDisplay(formattedClamped));
+        if (onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
+          });
+          onChange(syntheticEvent);
+        }
+        return;
+      }
+      setInternalValue(raw);
+      setDisplayValue(formatCurrencyDisplay(raw));
+      if (!isNaN(asNumber) && onChange) {
+        const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+          target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
+        });
+        onChange(syntheticEvent);
+      }
+      return;
+    }
     if (variant === "uom" && e.target.type === "number") {
       const numeric = Number(rawValue);
       if (!isNaN(numeric) && maxNumber != null && numeric > maxNumber) {
@@ -789,8 +838,21 @@ var Input = (_a) => {
         onChange(syntheticEvent);
       }
     } else if (variant === "uom") {
-      const formattedValue = formatDecimalValue(e.target.value, decimals);
-      e.target.value = formattedValue;
+      if (currencyFormat) {
+        const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
+        setInternalValue(formatted);
+        setDisplayValue(formatCurrencyDisplay(formatted));
+        const asNumber = Number(formatted);
+        if (!isNaN(asNumber) && onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
+          });
+          onChange(syntheticEvent);
+        }
+      } else {
+        const formattedValue = formatDecimalValue(e.target.value, decimals);
+        e.target.value = formattedValue;
+      }
     }
     onBlur == null ? void 0 : onBlur(e);
   };

package/dist/components/Time.js

@@ -1,6 +1,6 @@
 import {
   InputBase
-} from "../chunk-7T5RGDCN.js";
+} from "../chunk-NEMOTB6U.js";
 import "../chunk-HXGJVYGQ.js";
 import {
   findDocumentRoot

package/dist/components/index.cjs

@@ -2139,6 +2139,7 @@ var Input = (_a) => {
     variant = "default",
     decimals,
     uom,
+    currencyFormat = false,
     removeSearchIcon,
     value: propValue,
     onChange,
@@ -2151,6 +2152,7 @@ var Input = (_a) => {
     "variant",
     "decimals",
     "uom",
+    "currencyFormat",
     "removeSearchIcon",
     "value",
     "onChange",
@@ -2165,22 +2167,21 @@ var Input = (_a) => {
   (0, import_react10.useEffect)(() => {
     var _a2;
     const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
-    setInternalValue(stringValue);
-    setDisplayValue(stringValue);
-  }, [propValue]);
-  (0, import_react10.useEffect)(() => {
-    var _a2;
-    if (variant !== "currency") {
+    const shouldUseThousandsFormatting = variant === "currency" || variant === "uom" && currencyFormat;
+    if (!stringValue) {
+      setInternalValue("");
+      setDisplayValue("");
       return;
     }
-    const stringValue = (_a2 = propValue == null ? void 0 : propValue.toString()) != null ? _a2 : "";
-    if (!stringValue) {
+    if (!shouldUseThousandsFormatting) {
+      setInternalValue(stringValue);
+      setDisplayValue(stringValue);
       return;
     }
     const formatted = formatDecimalValue(stringValue, decimals != null ? decimals : 2);
     setInternalValue(formatted);
     setDisplayValue(formatCurrencyDisplay(formatted));
-  }, []);
+  }, [propValue, variant, currencyFormat, decimals]);
   const getInputProps = () => {
     var _a2;
     const baseProps = __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, props), {
@@ -2206,8 +2207,9 @@ var Input = (_a) => {
       case "percentage":
       case "uom":
         return __spreadProps(__spreadValues({}, baseProps), {
-          type: "number",
-          align: "right"
+          type: currencyFormat ? "text" : "number",
+          align: "right",
+          value: currencyFormat ? displayValue : propValue
         });
       default:
         return baseProps;
@@ -2220,6 +2222,8 @@ var Input = (_a) => {
         return !removeSearchIcon ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { name: "search" }) }) : null;
       case "currency":
         return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { name: "attach_money" }) });
+      case "uom":
+        return currencyFormat ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { name: "attach_money" }) }) : null;
       default:
         return null;
     }
@@ -2311,6 +2315,51 @@ var Input = (_a) => {
       }
       return;
     }
+    if (variant === "uom" && currencyFormat) {
+      const raw = rawValue.replace(/,/g, "");
+      if (raw === "") {
+        setInternalValue("");
+        setDisplayValue("");
+        if (onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: "" })
+          });
+          onChange(syntheticEvent);
+        }
+        return;
+      }
+      const regex = /^\d*\.?\d*$/;
+      if (!regex.test(raw)) return;
+      const parts = raw.split(".");
+      const currentDecimals = decimals != null ? decimals : 2;
+      if (parts.length === 2 && parts[1].length > currentDecimals) return;
+      const asNumber = Number(raw);
+      if (!isNaN(asNumber) && maxNumber != null && asNumber > maxNumber) {
+        const clamped = maxNumber;
+        const formattedClamped = formatDecimalValue(
+          clamped.toString(),
+          currentDecimals
+        );
+        setInternalValue(formattedClamped);
+        setDisplayValue(formatCurrencyDisplay(formattedClamped));
+        if (onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: clamped.toString() })
+          });
+          onChange(syntheticEvent);
+        }
+        return;
+      }
+      setInternalValue(raw);
+      setDisplayValue(formatCurrencyDisplay(raw));
+      if (!isNaN(asNumber) && onChange) {
+        const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+          target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
+        });
+        onChange(syntheticEvent);
+      }
+      return;
+    }
     if (variant === "uom" && e.target.type === "number") {
       const numeric = Number(rawValue);
       if (!isNaN(numeric) && maxNumber != null && numeric > maxNumber) {
@@ -2359,8 +2408,21 @@ var Input = (_a) => {
         onChange(syntheticEvent);
       }
     } else if (variant === "uom") {
-      const formattedValue = formatDecimalValue(e.target.value, decimals);
-      e.target.value = formattedValue;
+      if (currencyFormat) {
+        const formatted = formatDecimalValue(internalValue, decimals != null ? decimals : 2);
+        setInternalValue(formatted);
+        setDisplayValue(formatCurrencyDisplay(formatted));
+        const asNumber = Number(formatted);
+        if (!isNaN(asNumber) && onChange) {
+          const syntheticEvent = __spreadProps(__spreadValues({}, e), {
+            target: __spreadProps(__spreadValues({}, e.target), { value: asNumber.toString() })
+          });
+          onChange(syntheticEvent);
+        }
+      } else {
+        const formattedValue = formatDecimalValue(e.target.value, decimals);
+        e.target.value = formattedValue;
+      }
     }
     onBlur == null ? void 0 : onBlur(e);
   };

package/dist/components/index.js

@@ -2,7 +2,7 @@ import {
   DataGrid,
   DateInput,
   MobileDataGrid
-} from "../chunk-RLJU65SD.js";
+} from "../chunk-PJQHRERH.js";
 import "../chunk-2UNLVJU5.js";
 import "../chunk-POZD6R3P.js";
 import "../chunk-M7INAUAJ.js";
@@ -33,7 +33,7 @@ import "../chunk-AT4AWD6B.js";
 import "../chunk-EWGHVZL5.js";
 import {
   Select
-} from "../chunk-FZ2TEKOE.js";
+} from "../chunk-IEKZBWVL.js";
 import {
   SimpleTable
 } from "../chunk-I57U5THY.js";
@@ -71,7 +71,7 @@ import {
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "../chunk-5NRKL5CJ.js";
+} from "../chunk-FFCSDPXR.js";
 import {
   Menu
 } from "../chunk-OM7QLLI2.js";
@@ -81,10 +81,10 @@ import {
 } from "../chunk-X3NDEFVA.js";
 import {
   Search
-} from "../chunk-FHXCCVOG.js";
+} from "../chunk-72WLEGGU.js";
 import {
   Input
-} from "../chunk-7T5RGDCN.js";
+} from "../chunk-NEMOTB6U.js";
 import {
   Label
 } from "../chunk-HXGJVYGQ.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dmsi/wedgekit-react",
   "private": false,
-  "version": "0.0.1010",
+  "version": "0.0.1011",
   "type": "module",
   "scripts": {
     "build": "tsup",