@asaleh37/ui-base 25.8.1 → 25.8.2-1

package/package.json

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

package/src/components/index.ts

@@ -1,6 +1,5 @@
 export * from "./BaseApp";
 export * from "@mui/material";
-export * from "zod";
 export * from "@mui/lab";
 export { toast } from "react-toastify";
 export { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

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

@@ -46,7 +46,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 ? true
                 : false
             }
-            hidden={props?.hidden || false}
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             label={props?.fieldLabel}
             value={formValues[fieldName]}
             onChange={(event) => {
@@ -90,6 +94,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 ? true
                 : false
             }
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             label={props?.fieldLabel}
             onChangeCallBack={(v: any) => {
               formManager.setValue(fieldName, v);
@@ -127,6 +136,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 );
               }
             }}
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             value={formValues[fieldName]}
             error={formManager.formState.errors[fieldName] != undefined}
             errorMessage={formManager?.formState?.errors[
@@ -146,6 +160,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 );
               }
             }}
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             value={formValues[fieldName]}
             checkedValue={props?.checkedValue || true}
             unCheckedValue={props?.unCheckedValue || false}
@@ -165,6 +184,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 ? true
                 : false
             }
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             onChangeCallBack={(v: any, selectedRecord: any) => {
               let newValue = null;
               if (v) {
@@ -197,6 +221,11 @@ const FormElementField: React.FC<FormElementFieldProps> = (
                 ? true
                 : false
             }
+            hidden={
+              props?.hidden || element.hiddenFields.includes(fieldName)
+                ? true
+                : false
+            }
             onChangeCallBack={(v: any, selectedRecord: any) => {
               let newValue = null;
               if (v) {

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

@@ -5,6 +5,7 @@ interface CheckBoxProps {
   value: any;
   disabled?: boolean;
   required?: boolean;
+  hidden?: boolean;
   label: string;
   checkedValue?: any;
   unCheckedValue?: any;
@@ -17,6 +18,7 @@ const CheckBox: React.FC<CheckBoxProps> = (props) => {
   return (
     <FormControlLabel
       sx={props.sx}
+      hidden={props?.hidden || false}
       disabled={props.disabled || false}
       required={props.required || false}
       control={

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

@@ -10,6 +10,7 @@ interface ComboBoxProps {
   required?: boolean;
   options: Array<any>;
   errorMessage?: any;
+  hidden?: boolean;
   displayField: string;
   valueField: string;
   sx?: any;
@@ -32,6 +33,7 @@ const ComboBox: React.FC<ComboBoxProps> = (props) => {
       value={getValue(props.value)}
       options={props.options}
       disabled={props.disabled}
+      hidden={props?.hidden || false}
       onChange={(event, newValue) => {
         if (
           props.onChangeCallBack !== undefined &&

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

@@ -3,12 +3,14 @@ import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
 import moment from "moment";
 import { DATE_FORMAT } from "../../../../../util/constants";
 import { useTranslation } from "react-i18next";
+import TemplateTextField from "./TemplateTextField";
 
 interface DatefieldProps {
   value: string | null;
   label: string;
   disabled?: boolean;
   required?: boolean;
+  hidden?: boolean;
   sx?: any;
   format?: string;
   errorMessage?: any;
@@ -18,6 +20,9 @@ interface DatefieldProps {
 
 const Datefield: React.FC<DatefieldProps> = (props) => {
   const { t } = useTranslation();
+  if (props?.hidden) {
+    return <></>;
+  }
   return (
     <LocalizationProvider dateAdapter={AdapterMoment}>
       <DatePicker

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

@@ -3,12 +3,15 @@ import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
 import moment from "moment";
 import { useTranslation } from "react-i18next";
 import { DATE_TIME_FORMAT } from "../../../../../util/constants";
+import TemplateTextField from "./TemplateTextField";
+import { Hidden, TextField } from "@mui/material";
 
 interface DatetimeFieldProps {
   value: string | null;
   label: string;
   disabled?: boolean;
   required?: boolean;
+  hidden?: boolean;
   format?: string;
   sx?: any;
   errorMessage?: any;
@@ -18,6 +21,9 @@ interface DatetimeFieldProps {
 
 const DatetimeField: React.FC<DatetimeFieldProps> = (props) => {
   const { t } = useTranslation();
+  if (props?.hidden) {
+    return <></>;
+  }
   return (
     <LocalizationProvider dateAdapter={AdapterMoment}>
       <DateTimePicker
@@ -44,6 +50,7 @@ const DatetimeField: React.FC<DatetimeFieldProps> = (props) => {
         }}
         slotProps={{
           textField: {
+            InputLabelProps: { shrink: true },
             variant: "outlined",
             required: props.required,
             error:

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

@@ -10,6 +10,7 @@ type SystemLookupListProps = {
   label: string;
   disabled?: boolean;
   required?: boolean;
+  hidden?: boolean;
   errorMessage?: any;
   sx?: any;
 };

package/src/components/templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid.tsx

@@ -140,7 +140,7 @@ const TemplateGrid: React.FC<TemplateGridProps> = (props) => {
   }
 
   const themeDirection = useSelector(
-    (state: any) => state.AppLayout.appDirection
+    (state: any) =>   state.AppLayout.appDirection
   );
 
   const clearGridState = () => {

package/src/components/templates/index.ts

@@ -29,5 +29,7 @@ export { default as TemplatePieChart } from "./visuals/charts/TemplatePieChart";
 export { default as DashboardRouteView } from "./visuals/DashboardRouteView";
 export { default as DashboardViewer } from "./visuals/DashboardViewer";
 
+export { default as FormElement } from "./DataEntryTemplates/TemplateDataForm/FormElementField";
+
 export type * from "./DataEntryTemplates/DataEntryTypes";
 export type { TransferListProps } from "./TransferList";

package/src/hooks/index.ts

@@ -1,3 +1,9 @@
+import { useTranslation } from "react-i18next";
+import { useForm } from "react-hook-form";
+import { useParams } from "react-router-dom";
+import { zodResolver } from "@hookform/resolvers/zod";
+import * as z from "zod";
+import { useDispatch, useSelector } from "react-redux";
 export { default as useAxios } from "./useAxios";
 export { useConfirmationWindow } from "./UseConfirmationWindow";
 export { default as useLoadingMask } from "./useLoadingMask";
@@ -5,3 +11,8 @@ export { useIsMobile } from "./UseMobile";
 export { default as useSession } from "./UseSession";
 export { useWindow } from "./UseWindow";
 export { default as useApiActions } from "./useApiActions";
+export { useDispatch };
+export { useSelector };
+export { useParams };
+export { useForm, zodResolver, z as ZodLib };
+export { useTranslation };