Merge pull request #402 from AkshataKatwal16/relese-changes

Issue feat: Add custom  number widget for rjsf form

src/components/CustomNumberWidget.tsx

@@ -0,0 +1,32 @@
+import TextField from '@mui/material/TextField';
+
+interface NumberWidgetProps {
+  value: any;
+  onChange: (value: any) => void;
+}
+
+const CustomNumberWidget: React.FC<NumberWidgetProps> = ({
+  value,
+  onChange,
+  ...rest
+}) => {
+  const handleWheel = (event: any) => {
+    if (event.target instanceof HTMLInputElement) {
+      event.target.blur();
+    }
+  };
+
+  return (
+    <TextField
+      type="number"
+      value={value || ''}
+      onChange={(e) =>
+        onChange(e.target.value ? Number(e.target.value) : undefined)
+      }
+      onWheel={handleWheel}
+      {...rest}
+    />
+  );
+};
+
+export default CustomNumberWidget;

src/components/DynamicForm.tsx

@@ -10,6 +10,7 @@ import MultiSelectCheckboxes from "./form/MultiSelectCheckboxes";
 import MultiSelectDropdown from "./form/MultiSelectDropdown";
 const FormWithMaterialUI = withTheme(MaterialUITheme);
 import { getCurrentYearPattern } from "@/utils/Helper";
+import CustomNumberWidget from './CustomNumberWidget';
 
 interface DynamicFormProps {
   schema: any;
@@ -61,6 +62,8 @@ const DynamicForm: React.FC<DynamicFormProps> = ({
     MultiSelectDropdown: MultiSelectDropdown,
     MultiSelectCheckboxes: MultiSelectCheckboxes,
     CustomRadioWidget: CustomRadioWidget,
+    CustomNumberWidget: CustomNumberWidget,
+
   };
 
   const handleError = (errors: any) => {

src/components/GeneratedSchemas.ts

@@ -68,6 +68,8 @@ export const GenerateSchemaAndUiSchema = (
         if (field?.minLength !== undefined && field?.minLength !== null) {
           fieldSchema.minimum = Number(field.minLength);
         }
+        fieldUiSchema['ui:widget'] = 'CustomNumberWidget';
+
         // fieldUiSchema['ui:field'] = 'NumberInputField';
         break;
       case "drop_down":
@@ -107,7 +109,7 @@ export const GenerateSchemaAndUiSchema = (
               ? opt.label
               : t(`FORM.${opt.label}`),
         }));
-        fieldUiSchema["ui:widget"] = "CustomRadioWidget";
+         fieldUiSchema["ui:widget"] = "CustomRadioWidget";
         break;
       default:
         break;