tp-react-elements-dev 1.12.35 → 1.13.0

package/dist/components/Form/FormConstants.esm.js

@@ -12,6 +12,7 @@ const useFormValidatingContext = (formArray) => {
     formArray.forEach((field) => {
         switch (field.inputType) {
             case 'text':
+            case 'input-select':
                 initialValues[field.name] = '';
                 if (field.required && field.errorMessage) {
                     validationShape[field.name] = (validationShape[field.name] || Yup.string())

package/dist/components/Form/FormRenderWrapper.esm.js

@@ -21,7 +21,7 @@ const FormRenderWrapper = ({ formArray, name = '', numberOfColumns = 3, form, va
      * Maps through the form array and renders each item with appropriate configuration
      */
     return (jsx(FormComponent, { container: true, margin: 'auto', children: formArray.map((item, i) => {
-            return (item.inputType && (jsx(Formitem, { container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns, children: item.inputType === 'custom' ? (item.FormElement || jsx(Fragment, {})) : (jsx(RenderForm, { item: item, register: form.register, control: form.control, errors: errors, getValues: form.getValues, clearErrors: form.clearErrors, setValue: form.setValue, variant: variant, fieldError: fieldError })) }, `${name}_${i}`)));
+            return (item.inputType && (jsx(Formitem, { container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns, children: item.inputType === 'custom' ? (item.FormElement || jsx(Fragment, {})) : (jsx(RenderForm, { item: item, register: form.register, control: form.control, errors: errors, getValues: form.getValues, clearErrors: form.clearErrors, setValue: form.setValue, watch: form.watch, variant: variant, fieldError: fieldError })) }, `${name}_${i}`)));
         }) }));
 };
 /**

package/dist/components/FormComponents/FormTextFieldWithSelect/FormTextFieldWithSelect.esm.js

@@ -46,11 +46,10 @@ const FormTextFieldWithSelect = ({ props, variant, }) => {
      * For non-standard variants, appends an asterisk if the field is required
      */
     const label = variant !== 'standard' ? `${props.item.label}${props.item.required ? ' *' : ''}` : '';
-    const SelectValue = props.getValues(props.item.name + 'SelectValue');
     /**
      * Handles input events with various text restrictions
      *
-     * @param {any} e - The input event object
+     * @param {React.ChangeEvent<HTMLInputElement>} e - The input event object
      *
      * @remarks
      * - Removes spaces if donotAllowSpace is true
@@ -88,19 +87,16 @@ const FormTextFieldWithSelect = ({ props, variant, }) => {
                                 'aria-labelledby': `${props.item.name}-label`,
                                 'aria-describedby': `${props.item.name}-helper ${props.item.name}-error`,
                                 'aria-required': props.item.required ? true : undefined,
-                            } }), jsx(Select, { value: SelectValue, onChange: (_, newValue) => {
-                                // eslint-disable-next-line react/prop-types
-                                props.setValue(props.item.name + 'SelectValue', newValue);
-                            }, size: "small", sx: {
-                                // '& .MuiOutlinedInput-root': {
-                                borderTopLeftRadius: 0,
-                                borderBottomLeftRadius: 0,
-                                minWidth: '120px',
-                                borderLeft: 'none',
-                                // },
-                            }, disabled: props.item.disable, error: !!fieldState.error, children: props?.item?.options?.map((item) => {
-                                return jsx(MenuItem, { value: item.value, children: item.label });
-                            }) })] }), jsx(FormBottomField, { ...props })] })) }, props.item.name));
+                            } }), jsx(Controller, { control: props.control, name: `${props.item.name}SelectValue`, render: ({ field: selectField }) => (jsx(Select, { ...selectField, value: selectField.value || '', size: "small", sx: {
+                                    // '& .MuiOutlinedInput-root': {
+                                    borderTopLeftRadius: 0,
+                                    borderBottomLeftRadius: 0,
+                                    minWidth: '120px',
+                                    borderLeft: 'none',
+                                    // },
+                                }, disabled: props.item.disable, error: !!fieldState.error, children: props?.item?.options?.map((item) => {
+                                    return (jsx(MenuItem, { value: item.value, children: item.label }, item.value));
+                                }) })) })] }), jsx(FormBottomField, { ...props })] })) }, props.item.name));
 };
 
 export { FormTextFieldWithSelect as default };

package/dist/utils/Interface/FormInterface.d.ts

@@ -73,6 +73,7 @@ export interface FormRenderProps {
     getValues: any;
     clearErrors: any;
     setValue: any;
+    watch?: any;
     variant?: VariantProps;
     fieldError?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tp-react-elements-dev",
-  "version": "1.12.35",
+  "version": "1.13.0",
   "private": false,
   "type": "module",
   "description": "React form components library built with React Hook Form and Yup",