@etsoo/materialui
Version:
TypeScript Material-UI Implementation
59 lines (58 loc) • 2.37 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.InputField = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("@etsoo/react");
const react_2 = __importDefault(require("react"));
const MUGlobal_1 = require("./MUGlobal");
const TextField_1 = __importDefault(require("@mui/material/TextField"));
/**
* Input field
* @param props Props
* @returns Component
*/
exports.InputField = react_2.default.forwardRef((props, ref) => {
// Destruct
const { changeDelay, InputLabelProps = {}, InputProps = {}, inputProps = {}, onChange, onChangeDelay, readOnly, size = MUGlobal_1.MUGlobal.inputFieldSize, variant = MUGlobal_1.MUGlobal.inputFieldVariant, minChars = 0, ...rest } = props;
// Shrink
InputLabelProps.shrink ??= MUGlobal_1.MUGlobal.searchFieldShrink;
// Read only
if (readOnly != null)
InputProps.readOnly = readOnly;
// Min characters
inputProps["data-min-chars"] = minChars;
const isMounted = react_2.default.useRef(true);
const createDelayed = () => {
if (changeDelay != null && changeDelay >= 1) {
const changeHandler = onChangeDelay ?? onChange;
if (changeHandler)
return (0, react_1.useDelayedExecutor)(changeHandler, changeDelay);
}
return undefined;
};
const delayed = createDelayed();
const onChangeEx = (event) => {
// Min characters check
const len = event.target.value.length;
if (len > 0 && len < minChars) {
// Avoid to trigger the form change event
event.stopPropagation();
event.preventDefault();
return;
}
if (onChange && (delayed == null || onChangeDelay != null))
onChange(event);
delayed?.call(undefined, event);
};
react_2.default.useEffect(() => {
return () => {
isMounted.current = false;
delayed?.clear();
};
}, []);
// Layout
return ((0, jsx_runtime_1.jsx)(TextField_1.default, { ref: ref, InputLabelProps: InputLabelProps, InputProps: InputProps, inputProps: inputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
});