@wavemaker/react-runtime 11.14.1-15.6409

package/components/input/text/index.js

@@ -0,0 +1,434 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _toNumber = _interopRequireDefault(require("lodash-es/toNumber"));
+var _debounce = _interopRequireDefault(require("lodash-es/debounce"));
+var _withBaseWrapper = require("@wavemaker/react-runtime/higherOrder/withBaseWrapper");
+var _withFormController = _interopRequireDefault(require("@wavemaker/react-runtime/components/data/form/form-controller/withFormController"));
+var _util = require("./util");
+var _delay = _interopRequireDefault(require("lodash/delay"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
+var __jsx = _react["default"].createElement;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_CLASS = "form-control app-textbox";
+var WmText = /*#__PURE__*/(0, _react.memo)(function (props) {
+  var _props$autocomplete = props.autocomplete,
+    autocomplete = _props$autocomplete === void 0 ? "true" : _props$autocomplete,
+    autofocus = props.autofocus,
+    disabled = props.disabled,
+    readonly = props.readonly,
+    placeholder = props.placeholder,
+    type = props.type,
+    maxchars = props.maxchars,
+    _props$styles = props.styles,
+    styles = _props$styles === void 0 ? {} : _props$styles,
+    className = props.className,
+    shortcutkey = props.shortcutkey,
+    _props$required = props.required,
+    required = _props$required === void 0 ? false : _props$required,
+    name = props.name,
+    arialabel = props.arialabel,
+    _props$datavalue = props.datavalue,
+    datavalue = _props$datavalue === void 0 ? "" : _props$datavalue,
+    hint = props.hint,
+    listener = props.listener,
+    displayformat = props.displayformat,
+    _props$showdisplayfor = props.showdisplayformaton,
+    showdisplayformaton = _props$showdisplayfor === void 0 ? "keypress" : _props$showdisplayfor,
+    _props$updatedelay = props.updatedelay,
+    updatedelay = _props$updatedelay === void 0 ? "0" : _props$updatedelay,
+    tabindex = props.tabindex,
+    regexp = props.regexp,
+    _props$updateon = props.updateon,
+    updateon = _props$updateon === void 0 ? "blur" : _props$updateon,
+    autocapitalize = props.autocapitalize,
+    autotrim = props.autotrim,
+    onChange = props.onChange,
+    onBlur = props.onBlur,
+    onFocus = props.onFocus,
+    onKeydown = props.onKeydown,
+    onKeypress = props.onKeypress,
+    onKeyup = props.onKeyup,
+    onMouseEnter = props.onMouseEnter,
+    id = props.id,
+    error = props.error;
+
+  // Use a single state for the raw input value
+  var _useState = (0, _react.useState)(datavalue),
+    rawValue = _useState[0],
+    setRawValue = _useState[1];
+
+  // Compute formatted display value based on raw value
+  var displayValue = displayformat ? (0, _util.formatInput)(rawValue, displayformat) : rawValue;
+  var _useState2 = (0, _react.useState)(false),
+    showError = _useState2[0],
+    setShowError = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    isDirty = _useState3[0],
+    setIsDirty = _useState3[1];
+  var _useState4 = (0, _react.useState)(false),
+    isTouched = _useState4[0],
+    setIsTouched = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    isAutofilled = _useState5[0],
+    setIsAutofilled = _useState5[1];
+  var ref = (0, _react.useRef)(null);
+  var cursorPositionRef = (0, _react.useRef)(0);
+  var displayError = error || isDirty && showError;
+
+  // Track if changes are coming from internal user input
+  var isInternalChange = (0, _react.useRef)(false);
+  // Store previous value for onChange callbacks
+  var prevValueRef = (0, _react.useRef)(datavalue);
+
+  // Sync state with prop changes
+  (0, _react.useEffect)(function () {
+    // Only update state from props if it's not from an internal change
+    if (!isInternalChange.current && datavalue !== rawValue) {
+      setRawValue(datavalue);
+      prevValueRef.current = datavalue;
+    } else if (datavalue !== rawValue) {
+      setRawValue(datavalue);
+    }
+    // Reset the flag
+    isInternalChange.current = false;
+
+    // Reset autofill state when value is reset externally
+    if (datavalue === "" || datavalue === null || datavalue === undefined) {
+      setIsAutofilled(false);
+    }
+  }, [datavalue]);
+  var validateInput = (0, _react.useCallback)(function (value) {
+    if (displayformat) {
+      value = (0, _util.removeDisplayFormat)(value, displayformat);
+    }
+    if (!value.trim() && required) {
+      return {
+        isValid: false,
+        type: "required",
+        message: "This field is required"
+      };
+    }
+    if (type === "email" && value && value.trim()) {
+      var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+      if (!emailRegex.test(value.trim())) {
+        return {
+          isValid: false,
+          type: "email",
+          message: "Please enter a valid email address"
+        };
+      }
+    }
+    if (regexp && value && !new RegExp(regexp || ".*", "g").test(value)) {
+      return {
+        isValid: false,
+        type: "regexp",
+        message: "Invalid format"
+      };
+    }
+    if (maxchars && value.length > maxchars) {
+      return {
+        isValid: false,
+        type: "maxchars",
+        message: "Maximum ".concat(maxchars, " characters allowed")
+      };
+    }
+    if (props.type === "number") {
+      if (props.minvalue && (0, _toNumber["default"])(value) < props.minvalue) {
+        return {
+          isValid: false,
+          type: "minvalue",
+          message: "Minimum ".concat(props.minvalue, " characters allowed")
+        };
+      }
+      if (props.maxvalue && (0, _toNumber["default"])(value) > props.maxvalue) {
+        return {
+          isValid: false,
+          type: "maxvalue",
+          message: "Maximum ".concat(props.maxvalue, " characters allowed")
+        };
+      }
+    }
+    return {
+      isValid: true,
+      message: "",
+      type: ""
+    };
+  }, [required, regexp, maxchars]);
+
+  // Debounced update function for delayed updates
+  var debouncedUpdateValue = (0, _react.useMemo)(function () {
+    return (0, _debounce["default"])(function (value) {
+      if (autotrim) {
+        value = value.trim();
+      }
+      var validation = validateInput(value);
+      setShowError(!validation.isValid);
+      if (onChange || listener !== null && listener !== void 0 && listener.onChange) {
+        isInternalChange.current = true;
+
+        // Remove display format before processing the value
+        var unformattedValue = displayformat ? (0, _util.removeDisplayFormat)(value, displayformat) : value;
+        var _datavalue = props.type === "number" ? (0, _toNumber["default"])(unformattedValue) : unformattedValue;
+        if (listener !== null && listener !== void 0 && listener.onChange) {
+          listener.onChange(props.fieldName || name, {
+            datavalue: _datavalue,
+            value: value,
+            charlength: value.length
+          });
+        }
+        if (onChange) {
+          var syntheticEvent = {
+            target: {
+              value: _datavalue,
+              name: name
+            },
+            currentTarget: ref.current
+          };
+          // onChange expects string | null, so convert number to string if needed
+          var onChangeValue = typeof _datavalue === "number" ? String(_datavalue) : _datavalue;
+          var prevValue = typeof prevValueRef.current === "number" ? String(prevValueRef.current) : prevValueRef.current;
+          onChange(syntheticEvent, props, onChangeValue, prevValue);
+        }
+        prevValueRef.current = _datavalue;
+      }
+    }, parseInt(updatedelay) || 0, {
+      leading: parseInt(updatedelay) === 0
+    });
+  }, [onChange, name, validateInput, autotrim, displayformat]);
+
+  // Shortcut key handler
+  (0, _react.useEffect)(function () {
+    if (!shortcutkey) return;
+    var handleGlobalKeyDown = function handleGlobalKeyDown(e) {
+      if (e.altKey && e.key.toLowerCase() === shortcutkey.toLowerCase()) {
+        var _ref$current;
+        e.preventDefault();
+        (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.focus();
+      }
+    };
+    window.addEventListener("keydown", handleGlobalKeyDown);
+    return function () {
+      return window.removeEventListener("keydown", handleGlobalKeyDown);
+    };
+  }, [shortcutkey]);
+
+  // Autofill detection using mui-auto-fill animation event
+  (0, _react.useEffect)(function () {
+    var input = ref.current;
+    function handleAnimationStart(e) {
+      if (e.animationName === "mui-auto-fill") {
+        setIsAutofilled(true);
+      }
+    }
+    if (input) {
+      input.addEventListener("animationstart", handleAnimationStart);
+    }
+    return function () {
+      if (input) {
+        input.removeEventListener("animationstart", handleAnimationStart);
+      }
+    };
+  }, []);
+  var handleInputChange = function handleInputChange(e) {
+    isInternalChange.current = true;
+    var inputEl = e.target;
+    var newValue = inputEl.value;
+    cursorPositionRef.current = inputEl.selectionStart || 0;
+
+    // Extract digits for validation if displayformat is present
+    var digitsOnly = displayformat ? newValue.replace(/\D/g, "") : newValue;
+
+    // Enforce maxchars constraint BEFORE setting state
+    if (maxchars && digitsOnly.length > maxchars) {
+      // Prevent input that exceeds maxchars
+      return;
+    }
+
+    // Enforce displayformat digit limit
+    if (displayformat) {
+      var formatDigits = displayformat.replace(/[^9]/g, "");
+      var maxDigits = formatDigits.length;
+      if (digitsOnly.length > maxDigits) {
+        // Prevent input that exceeds format digit limit
+        return;
+      }
+    }
+
+    // Enforce min/max value constraints for number type
+    if (props.type === "number") {
+      var numValue = (0, _toNumber["default"])(digitsOnly);
+      if (props.maxvalue !== undefined && numValue > props.maxvalue) {
+        // Prevent input that exceeds maxvalue
+        return;
+      }
+      if (props.minvalue !== undefined && numValue < props.minvalue && digitsOnly.length >= String(props.minvalue).length) {
+        // Only prevent if the number length is complete and still below minvalue
+        // This allows typing "1" when minvalue is 10
+        var minLength = String(props.minvalue).length;
+        if (digitsOnly.length >= minLength) {
+          return;
+        }
+      }
+    }
+    setRawValue(newValue);
+
+    // Handle cursor position for formatted input
+    if (displayformat && showdisplayformaton === "keypress") {
+      setTimeout(function () {
+        if (ref.current) {
+          var formatted = (0, _util.formatInput)(newValue, displayformat);
+          var digitsBefore = newValue.substring(0, cursorPositionRef.current).replace(/\D/g, "").length;
+          var newPos = formatted.split("").reduce(function (pos, _char, index) {
+            if (pos !== -1) return pos;
+            var digitsSoFar = formatted.substring(0, index).replace(/\D/g, "").length;
+            return digitsSoFar >= digitsBefore ? index : -1;
+          }, -1);
+          if (newPos !== -1) {
+            ref.current.setSelectionRange(newPos, newPos);
+          }
+        }
+      }, 0);
+    }
+    var validation = validateInput(newValue);
+    setShowError(!validation.isValid);
+
+    // Set isDirty based on validation and whether user has typed
+    if (updateon === "keypress") {
+      if (!validation.isValid && (newValue.trim() || required)) {
+        setIsDirty(true);
+      } else if (validation.isValid && !required) {
+        // Reset isDirty when field becomes valid (except for required fields which need blur)
+        setIsDirty(false);
+      }
+    }
+    if (updateon === "keypress" || isAutofilled) {
+      debouncedUpdateValue(newValue);
+    }
+  };
+  var handleBlur = function handleBlur(e) {
+    if (readonly || disabled) {
+      return;
+    }
+    var validation = validateInput(rawValue);
+    if (!validation.isValid && (required || validation.type === "regexp")) {
+      setIsDirty(true);
+    } else {
+      setIsDirty(false);
+    }
+    setShowError(!validation.isValid);
+    if (updateon === "blur") {
+      debouncedUpdateValue(rawValue);
+    }
+    if (!validation.isValid && regexp != ".*") {
+      setIsTouched(true);
+      setIsDirty(true);
+    }
+    onBlur === null || onBlur === void 0 || onBlur(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+  };
+  var handleFocus = function handleFocus(e) {
+    onFocus === null || onFocus === void 0 || onFocus(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+  };
+  var handleKeyDown = function handleKeyDown(e) {
+    (0, _delay["default"])(function () {
+      onKeydown === null || onKeydown === void 0 || onKeydown(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+      if (e.key === "Enter") {
+        debouncedUpdateValue(rawValue);
+      }
+    }, 0);
+  };
+  var handleKeyPress = function handleKeyPress(e) {
+    (0, _delay["default"])(function () {
+      onKeypress === null || onKeypress === void 0 || onKeypress(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+    }, 0);
+  };
+  var handleKeyUp = function handleKeyUp(e) {
+    (0, _delay["default"])(function () {
+      onKeyup === null || onKeyup === void 0 || onKeyup(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+    }, 0);
+  };
+  var handleMouseEnter = function handleMouseEnter(e) {
+    onMouseEnter === null || onMouseEnter === void 0 || onMouseEnter(e, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
+    setIsTouched(true);
+  };
+  var events = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
+    onChange: handleInputChange
+  }, onFocus ? {
+    onFocus: handleFocus
+  } : {}), onKeydown ? {
+    onKeyDown: handleKeyDown
+  } : {}), onKeyup ? {
+    onKeyUp: handleKeyUp
+  } : {}), onKeypress ? {
+    onKeyPress: handleKeyPress
+  } : {}), props.onClick ? {
+    onClick: props.onClick
+  } : {}), updateon === "blur" || onBlur ? {
+    onBlur: handleBlur
+  } : {}), props.onMouseEnter ? {
+    onMouseEnter: handleMouseEnter
+  } : {}), props.onMouseLeave ? {
+    onMouseLeave: props.onMouseLeave
+  } : {});
+  return __jsx(_TextField["default"], (0, _extends2["default"])({}, events, {
+    title: hint || "Text Input",
+    name: name,
+    id: id || name,
+    variant: "standard",
+    autoComplete: (autocomplete === null || autocomplete === void 0 ? void 0 : autocomplete.toString()) === "true" ? "on" : "off",
+    autoFocus: autofocus,
+    disabled: disabled,
+    required: required,
+    placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "Enter text",
+    value: displayValue,
+    type: type,
+    inputRef: ref,
+    error: displayError,
+    "aria-readonly": readonly,
+    className: (0, _clsx["default"])("app-input-wrapper", isTouched ? "ng-touched" : "ng-untouched", displayError && "ng-invalid"),
+    slotProps: {
+      htmlInput: {
+        tabIndex: tabindex,
+        readOnly: readonly,
+        className: (0, _clsx["default"])(DEFAULT_CLASS, className, isTouched ? "ng-touched" : "ng-untouched", displayError && "ng-invalid"),
+        style: styles,
+        "aria-label": arialabel,
+        maxLength: maxchars,
+        pattern: new RegExp(regexp || ".*", "g"),
+        min: props.minvalue,
+        max: props.maxvalue,
+        step: props.step
+      }
+    },
+    sx: {
+      "& .MuiInputBase-input.Mui-disabled": {
+        WebkitTextFillColor: "inherit"
+      },
+      "& .MuiFormHelperText-root": {
+        marginLeft: 0,
+        "&.Mui-error": {
+          color: "#ee5f5b"
+        }
+      },
+      width: "100%"
+    }
+  }));
+}, function (prev, current) {
+  var keys = ["datavalue", "disabled", "required", "readonly", "placeholder", "maxchars", "tabindex", "shortcutkey", "autofocus", "arialabel", "error", "className"];
+  return keys.every(function (key) {
+    return prev[key] === current[key];
+  });
+});
+WmText.displayName = "WmText";
+var _default = exports["default"] = (0, _withBaseWrapper.withBaseWrapper)((0, _withFormController["default"])(WmText));

package/components/input/text/props.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/components/input/text/util.js

@@ -0,0 +1,179 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.autoCapitalize = autoCapitalize;
+exports.removeDisplayFormat = exports.formatInput = void 0;
+var formatInput = exports.formatInput = function formatInput(value, format) {
+  if (!format || !value) return value;
+  var digitsOnly = value.replace(/\D/g, "");
+  var formatDigits = format.replace(/[^9]/g, "");
+  var maxDigits = formatDigits.length;
+  if (format === "999-99-9999") {
+    if (digitsOnly.length === 0) return "";
+    var result = digitsOnly.substring(0, Math.min(3, digitsOnly.length));
+    if (digitsOnly.length > 3) {
+      result += "-" + digitsOnly.substring(3, Math.min(5, digitsOnly.length));
+    }
+    if (digitsOnly.length > 5) {
+      result += "-" + digitsOnly.substring(5, Math.min(9, digitsOnly.length));
+    }
+    return result;
+  }
+  if (format === "(999) 999-9999") {
+    if (digitsOnly.length === 0) return "";
+    var _result = "(" + digitsOnly.substring(0, Math.min(3, digitsOnly.length));
+    if (digitsOnly.length > 3) {
+      _result += ") " + digitsOnly.substring(3, Math.min(6, digitsOnly.length));
+    }
+    if (digitsOnly.length > 6) {
+      _result += "-" + digitsOnly.substring(6, Math.min(10, digitsOnly.length));
+    }
+    return _result;
+  }
+  if (format === "(999) 999-9999 ext. 999") {
+    if (digitsOnly.length === 0) return "";
+    var _result2 = "(" + digitsOnly.substring(0, Math.min(3, digitsOnly.length));
+    if (digitsOnly.length > 3) {
+      _result2 += ") " + digitsOnly.substring(3, Math.min(6, digitsOnly.length));
+    }
+    if (digitsOnly.length > 6) {
+      _result2 += "-" + digitsOnly.substring(6, Math.min(10, digitsOnly.length));
+    }
+    if (digitsOnly.length > 10) {
+      _result2 += " ext. " + digitsOnly.substring(10);
+    }
+    return _result2;
+  }
+  if (format === "(9?9?9?) 9?9?9?-9?9?9?9?9?9?") {
+    var _result3 = "";
+    var areaCode = "";
+    var prefix = "";
+    var number = "";
+    if (digitsOnly.length > 0) {
+      areaCode = "(" + digitsOnly.substring(0, Math.min(3, digitsOnly.length));
+      if (digitsOnly.length < 3) {
+        return areaCode;
+      }
+      areaCode += ") ";
+    }
+    if (digitsOnly.length > 3) {
+      prefix = digitsOnly.substring(3, Math.min(6, digitsOnly.length));
+      if (digitsOnly.length < 6) {
+        return areaCode + prefix;
+      }
+      prefix += "-";
+    }
+    if (digitsOnly.length > 6) {
+      number = digitsOnly.substring(6);
+    }
+    _result3 = areaCode + prefix + number;
+    return _result3;
+  }
+  if (format === "9999 9999 9999 9999") {
+    // Credit card format
+    var _result4 = "";
+    for (var i = 0; i < digitsOnly.length && i < 16; i += 4) {
+      if (i > 0) _result4 += " ";
+      _result4 += digitsOnly.substring(i, Math.min(i + 4, digitsOnly.length));
+    }
+    return _result4;
+  }
+  if (format === "AA-9999") {
+    var _value$match;
+    // Alpha-numeric format
+    var _result5 = "";
+    var alphaOnly = ((_value$match = value.match(/[A-Za-z]*/g)) === null || _value$match === void 0 ? void 0 : _value$match.join("")) || "";
+    if (alphaOnly.length > 0) {
+      _result5 = alphaOnly.substring(0, Math.min(2, alphaOnly.length)).toUpperCase();
+    }
+    if (digitsOnly.length > 0 && _result5.length > 0) {
+      _result5 += "-";
+    }
+    if (digitsOnly.length > 0) {
+      _result5 += digitsOnly.substring(0, Math.min(4, digitsOnly.length));
+    }
+    return _result5;
+  }
+  if (format === "(***: AAA-999)") {
+    var _value$match2;
+    // Special format with asterisks
+    var _result6 = "(";
+    _result6 += "***";
+    _result6 += ": ";
+    var _alphaOnly = ((_value$match2 = value.match(/[A-Za-z]*/g)) === null || _value$match2 === void 0 ? void 0 : _value$match2.join("")) || "";
+    if (_alphaOnly.length > 0) {
+      _result6 += _alphaOnly.substring(0, Math.min(3, _alphaOnly.length)).toUpperCase();
+    }
+    if (digitsOnly.length > 0) {
+      _result6 += "-";
+      _result6 += digitsOnly.substring(0, Math.min(3, digitsOnly.length));
+    }
+    _result6 += ")";
+    return _result6;
+  }
+
+  // Generic formatter for other patterns
+  if (format.includes("9")) {
+    var _result7 = "";
+    var digitIndex = 0;
+    var _formatDigits = format.replace(/[^9]/g, "");
+    var _maxDigits = _formatDigits.length;
+
+    // Limit digitsOnly to maxDigits from format
+    var limitedDigits = digitsOnly.substring(0, _maxDigits);
+    for (var _i2 = 0; _i2 < format.length && digitIndex < limitedDigits.length; _i2++) {
+      if (format[_i2] === "9") {
+        _result7 += limitedDigits[digitIndex++] || "";
+      } else {
+        // Only add separator if there are more digits to come
+        if (digitIndex < limitedDigits.length) {
+          _result7 += format[_i2];
+        }
+      }
+    }
+    return _result7;
+  }
+
+  // Fallback: return original value
+  return value;
+};
+
+/**
+ * Removes display format characters from the value
+ * Keeps only alphanumeric characters based on the format type
+ */
+var removeDisplayFormat = exports.removeDisplayFormat = function removeDisplayFormat(value, format) {
+  if (!format || !value) return value;
+
+  // For alphanumeric formats (like AA-9999), keep both letters and numbers
+  if (format.includes("A")) {
+    return value.replace(/[^A-Za-z0-9]/g, "");
+  }
+
+  // For numeric-only formats, keep only digits
+  if (format.includes("9")) {
+    return value.replace(/\D/g, "");
+  }
+
+  // Default: return the value as-is
+  return value;
+};
+function autoCapitalize(value, type) {
+  if (!value) return value;
+  switch (type) {
+    case "characters":
+      return value.toUpperCase();
+    case "words":
+      return value.split(" ").map(function (word) {
+        return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+      }).join(" ");
+    case "sentences":
+      return value.toLowerCase().replace(/(^\w|\.\s+\w)/g, function (letter) {
+        return letter.toUpperCase();
+      });
+    default:
+      return value;
+  }
+}