@asaleh37/ui-base 25.9.5-1 → 25.9.5-3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asaleh37/ui-base",
-  "version": "25.9.5-1",
+  "version": "25.9.5-3",
   "description": "",
   "license": "ISC",
   "author": "Ahmed Saleh Mohamed",

package/src/components/templates/DataEntryTemplates/TemplateDataForm/FormElementField.tsx

@@ -50,7 +50,6 @@ const FormElementField: React.FC<FormElementFieldProps> = (
             fullWidth
             type={fieldType}
             disabled={element.disabledFields.includes(fieldName)}
-            hidden={element.hiddenFields.includes(fieldName)}
             label={getFieldLabel()}
             value={formValues[fieldName]}
             onChange={(event) => {
@@ -81,6 +80,9 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 height: "100% !important", // forces full height usage
               },
               ...props?.formProps?.style,
+              display: element.hiddenFields.includes(fieldName)
+                ? "none"
+                : undefined,
             }}
             error={formManager.formState.errors[fieldName] != undefined}
             helperText={formManager?.formState?.errors[

package/src/components/templates/DataEntryTemplates/TemplateDataForm/FormFields/TemplateTextField.tsx

@@ -8,6 +8,7 @@ const TemplateTextField: React.FC<Omit<TextFieldProps, "outlined">> = (
   return (
     <TextField
       {...props}
+      hidden={true}
       slotProps={{ inputLabel: { shrink: true, sx: { fontWeight: "bold" } } }}
       label={<>{props?.label ? t(props.label) : ""}</>}
       helperText={props?.helperText ? t(props.helperText) : undefined}

package/src/components/templates/DataEntryTemplates/TemplateDataForm/TemplateForm.tsx

@@ -46,22 +46,9 @@ const TemplateForm: React.FC<TemplateFormProps> = (
     useState<boolean>(true);
   const { t } = useTranslation();
   const fields = getAllFields(props.elements);
-  const initiallyHiddenFields = [];
-  const initiallyDisabledFields = [];
-  for (const field of fields) {
-    if (field?.hidden) {
-      initiallyHiddenFields.push(field.fieldName);
-    }
-    if (field?.disabled) {
-      initiallyDisabledFields.push(field.fieldName);
-    }
-  }
-  const [disabledFields, setDisabledFields] = useState<string[]>(
-    initiallyDisabledFields
-  );
-  const [hiddenFields, setHiddenFields] = useState<string[]>(
-    initiallyHiddenFields
-  );
+
+  const [disabledFields, setDisabledFields] = useState<string[]>([]);
+  const [hiddenFields, setHiddenFields] = useState<string[]>([]);
   const initialValues: any = {};
   for (const element of props.elements) {
     if (
@@ -186,6 +173,20 @@ const TemplateForm: React.FC<TemplateFormProps> = (
     },
   };
 
+  useEffect(() => {
+    const initiallyHiddenFields = [];
+    const initiallyDisabledFields = [];
+    for (const field of fields) {
+      if (field?.hidden) {
+        initiallyHiddenFields.push(field.fieldName);
+      }
+      if (field?.disabled) {
+        initiallyDisabledFields.push(field.fieldName);
+      }
+    }
+    setHiddenFields(initiallyHiddenFields);
+    setDisabledFields(initiallyDisabledFields);
+  }, [props.elements]);
   useEffect(() => {
     loadRecord();
   }, [props?.recordIdToEdit]);