@etsoo/materialui 1.4.41 → 1.4.43

package/lib/InputField.js

@@ -10,12 +10,14 @@ import { MUGlobal } from "./MUGlobal";
  */
 export const InputField = React.forwardRef((props, ref) => {
     // Destruct
-    const { changeDelay, InputLabelProps = {}, InputProps = {}, onChange, onChangeDelay, readOnly, size = MUGlobal.inputFieldSize, variant = MUGlobal.inputFieldVariant, minChars = 0, ...rest } = props;
+    const { changeDelay, InputLabelProps = {}, InputProps = {}, inputProps = {}, onChange, onChangeDelay, readOnly, size = MUGlobal.inputFieldSize, variant = MUGlobal.inputFieldVariant, minChars = 0, ...rest } = props;
     // Shrink
     InputLabelProps.shrink ??= MUGlobal.searchFieldShrink;
     // Read only
     if (readOnly != null)
         InputProps.readOnly = readOnly;
+    // Min characters
+    inputProps["data-min-chars"] = minChars;
     const isMounted = React.useRef(true);
     const createDelayed = () => {
         if (changeDelay != null && changeDelay >= 1) {
@@ -42,5 +44,5 @@ export const InputField = React.forwardRef((props, ref) => {
         };
     }, []);
     // Layout
-    return (_jsx(TextField, { ref: ref, InputLabelProps: InputLabelProps, InputProps: InputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
+    return (_jsx(TextField, { ref: ref, InputLabelProps: InputLabelProps, InputProps: InputProps, inputProps: inputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
 });

package/lib/SearchBar.js

@@ -47,6 +47,21 @@ const setChildState = (child, enabled) => {
         input.disabled = !enabled;
     }
 };
+function checkFormEvent(event) {
+    if (event.nativeEvent.cancelable && !event.nativeEvent.composed)
+        return true;
+    if (event.target instanceof HTMLInputElement ||
+        event.target instanceof HTMLTextAreaElement) {
+        const minChars = NumberUtils.parse(event.target.dataset.minChars);
+        if (minChars != null && minChars > 0) {
+            const len = event.target.value.length;
+            if (len > 0 && len < minChars) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
 /**
  * Search bar
  * @param props Props
@@ -172,7 +187,7 @@ export function SearchBar(props) {
     const hasMoreItems = moreItems.length > 0;
     // Handle main form
     const handleForm = (event) => {
-        if (event.nativeEvent.cancelable && !event.nativeEvent.composed)
+        if (checkFormEvent(event))
             return;
         if (state.form == null)
             state.form = event.currentTarget;
@@ -184,18 +199,8 @@ export function SearchBar(props) {
     };
     // More form change
     const moreFormChange = (event) => {
-        if (event.nativeEvent.cancelable && !event.nativeEvent.composed)
+        if (checkFormEvent(event))
             return;
-        if (event.target instanceof HTMLInputElement ||
-            event.target instanceof HTMLTextAreaElement) {
-            const minChars = NumberUtils.parse(event.target.dataset.minChars);
-            if (minChars != null && minChars > 0) {
-                const len = event.target.value.length;
-                if (len > 0 && len < minChars) {
-                    return;
-                }
-            }
-        }
         if (state.moreForm == null)
             state.moreForm = event.currentTarget;
         delayed.call();

package/lib/SearchField.js

@@ -10,12 +10,14 @@ import { MUGlobal } from "./MUGlobal";
  */
 export function SearchField(props) {
     // Destruct
-    const { changeDelay, InputLabelProps = {}, InputProps = {}, onChange, readOnly, size = MUGlobal.searchFieldSize, variant = MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
+    const { changeDelay, InputLabelProps = {}, InputProps = {}, inputProps = {}, onChange, readOnly, size = MUGlobal.searchFieldSize, variant = MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
     // Shrink
     InputLabelProps.shrink ??= MUGlobal.searchFieldShrink;
     // Read only
     if (readOnly != null)
         InputProps.readOnly = readOnly;
+    // Min characters
+    inputProps["data-min-chars"] = minChars;
     const isMounted = React.useRef(true);
     const delayed = onChange != null && changeDelay != null && changeDelay >= 1
         ? useDelayedExecutor(onChange, changeDelay)
@@ -40,5 +42,5 @@ export function SearchField(props) {
         };
     }, []);
     // Layout
-    return (_jsx(TextField, { InputLabelProps: InputLabelProps, InputProps: InputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
+    return (_jsx(TextField, { InputLabelProps: InputLabelProps, InputProps: InputProps, inputProps: inputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.4.41",
+  "version": "1.4.43",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "type": "module",

package/src/InputField.tsx

@@ -42,6 +42,7 @@ export const InputField = React.forwardRef<HTMLDivElement, InputFieldProps>(
       changeDelay,
       InputLabelProps = {},
       InputProps = {},
+      inputProps = {},
       onChange,
       onChangeDelay,
       readOnly,
@@ -57,6 +58,9 @@ export const InputField = React.forwardRef<HTMLDivElement, InputFieldProps>(
     // Read only
     if (readOnly != null) InputProps.readOnly = readOnly;
 
+    // Min characters
+    inputProps["data-min-chars"] = minChars;
+
     const isMounted = React.useRef(true);
     const createDelayed = () => {
       if (changeDelay != null && changeDelay >= 1) {
@@ -93,6 +97,7 @@ export const InputField = React.forwardRef<HTMLDivElement, InputFieldProps>(
         ref={ref}
         InputLabelProps={InputLabelProps}
         InputProps={InputProps}
+        inputProps={inputProps}
         onChange={onChangeEx}
         size={size}
         variant={variant}

package/src/SearchBar.tsx

@@ -81,6 +81,25 @@ const setChildState = (child: Element, enabled: boolean) => {
   }
 };
 
+function checkFormEvent(event: React.FormEvent<HTMLFormElement>) {
+  if (event.nativeEvent.cancelable && !event.nativeEvent.composed) return true;
+
+  if (
+    event.target instanceof HTMLInputElement ||
+    event.target instanceof HTMLTextAreaElement
+  ) {
+    const minChars = NumberUtils.parse(event.target.dataset.minChars);
+    if (minChars != null && minChars > 0) {
+      const len = event.target.value.length;
+      if (len > 0 && len < minChars) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+}
+
 /**
  * Search bar
  * @param props Props
@@ -243,7 +262,7 @@ export function SearchBar(props: SearchBarProps) {
 
   // Handle main form
   const handleForm = (event: React.FormEvent<HTMLFormElement>) => {
-    if (event.nativeEvent.cancelable && !event.nativeEvent.composed) return;
+    if (checkFormEvent(event)) return;
 
     if (state.form == null) state.form = event.currentTarget;
 
@@ -257,20 +276,7 @@ export function SearchBar(props: SearchBarProps) {
 
   // More form change
   const moreFormChange = (event: React.FormEvent<HTMLFormElement>) => {
-    if (event.nativeEvent.cancelable && !event.nativeEvent.composed) return;
-
-    if (
-      event.target instanceof HTMLInputElement ||
-      event.target instanceof HTMLTextAreaElement
-    ) {
-      const minChars = NumberUtils.parse(event.target.dataset.minChars);
-      if (minChars != null && minChars > 0) {
-        const len = event.target.value.length;
-        if (len > 0 && len < minChars) {
-          return;
-        }
-      }
-    }
+    if (checkFormEvent(event)) return;
 
     if (state.moreForm == null) state.moreForm = event.currentTarget;
 

package/src/SearchField.tsx

@@ -34,6 +34,7 @@ export function SearchField(props: SearchFieldProps) {
     changeDelay,
     InputLabelProps = {},
     InputProps = {},
+    inputProps = {},
     onChange,
     readOnly,
     size = MUGlobal.searchFieldSize,
@@ -48,6 +49,9 @@ export function SearchField(props: SearchFieldProps) {
   // Read only
   if (readOnly != null) InputProps.readOnly = readOnly;
 
+  // Min characters
+  inputProps["data-min-chars"] = minChars;
+
   const isMounted = React.useRef(true);
   const delayed =
     onChange != null && changeDelay != null && changeDelay >= 1
@@ -83,6 +87,7 @@ export function SearchField(props: SearchFieldProps) {
     <TextField
       InputLabelProps={InputLabelProps}
       InputProps={InputProps}
+      inputProps={inputProps}
       onChange={onChangeEx}
       size={size}
       variant={variant}