tp-react-elements-dev 1.4.13 → 1.4.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/Form/FormRender.d.ts +5 -0
  2. package/dist/index.esm.js +61 -20
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +61 -20
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -52102,24 +52102,27 @@ const PasswordField = ({ props }) => {
52102
52102
  const handleTogglePasswordVisibility = () => {
52103
52103
  setShowPassword((prevShowPassword) => !prevShowPassword);
52104
52104
  };
52105
- return (jsxRuntimeExports.jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [" ", jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ sx: { position: "relative" } }, { children: [" ", jsxRuntimeExports.jsx(TextField, Object.assign({ size: "small", type: showPassword ? "text" : "password", placeholder: props.item.placeholder || "" }, field, { label: `${props.item.label}${props.item.required ? ' *' : ''}`, sx: {
52106
- width: "100%",
52107
- "& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
52108
- top: "-8px",
52109
- },
52110
- }, value: field.value || null, disabled: props.item.disable })), jsxRuntimeExports.jsx(IconButton, Object.assign({ sx: {
52111
- position: "absolute",
52112
- right: "14px",
52113
- top: "50%",
52114
- transform: "translateY(-50%)",
52115
- width: '25px'
52116
- }, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
52117
- fontSize: "12px",
52118
- position: "absolute",
52119
- } })) : (jsxRuntimeExports.jsx(VisibilityOff, { sx: {
52120
- fontSize: "12px",
52105
+ return (jsxRuntimeExports.jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [" ", jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
52106
+ var _a, _b;
52107
+ return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ sx: { position: "relative" } }, { children: [" ", jsxRuntimeExports.jsx(TextField, Object.assign({ size: "small", type: showPassword ? "text" : "password", autoComplete: ((_b = (_a = props.item) === null || _a === void 0 ? void 0 : _a.InputProps) === null || _b === void 0 ? void 0 : _b.autoComplete) || 'off', placeholder: props.item.placeholder || "" }, field, { label: `${props.item.label}${props.item.required ? ' *' : ''}`, sx: {
52108
+ width: "100%",
52109
+ "& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
52110
+ top: "-8px",
52111
+ },
52112
+ }, value: field.value || null, disabled: props.item.disable })), jsxRuntimeExports.jsx(IconButton, Object.assign({ sx: {
52121
52113
  position: "absolute",
52122
- } })) }))] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) })] })));
52114
+ right: "14px",
52115
+ top: "50%",
52116
+ transform: "translateY(-50%)",
52117
+ width: '25px'
52118
+ }, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
52119
+ fontSize: "12px",
52120
+ position: "absolute",
52121
+ } })) : (jsxRuntimeExports.jsx(VisibilityOff, { sx: {
52122
+ fontSize: "12px",
52123
+ position: "absolute",
52124
+ } })) }))] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52125
+ } })] })));
52123
52126
  };
52124
52127
 
52125
52128
  const Monthpickerrender = ({ props }) => {
@@ -52888,9 +52891,9 @@ const FormRenderWrapper = ({ formArray, name, numberOfColumns = 3, form, }) => {
52888
52891
  // useEffect(() => {
52889
52892
  // // form.reset(initialValues, { resolver: yupResolver(validationSchema) });
52890
52893
  // }, [formArray, validationSchema, initialValues]);
52891
- return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
52892
- return (jsxRuntimeExports.jsx(Formitem, Object.assign({ container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns }, { children: jsxRuntimeExports.jsx(RenderForm, { item: item, register: form.register, control: form.control, errors: form.formState.errors, getValues: form.getValues, clearErrors: form.clearErrors, setValue: form.setValue }) }), i));
52893
- }) })) })));
52894
+ return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(Box, Object.assign({ component: 'form', autoComplete: "off" }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
52895
+ return (jsxRuntimeExports.jsx(Formitem, Object.assign({ container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns }, { children: jsxRuntimeExports.jsx(RenderForm, { item: item, register: form.register, control: form.control, errors: form.formState.errors, getValues: form.getValues, clearErrors: form.clearErrors, setValue: form.setValue }) }), i));
52896
+ }) })) })) })));
52894
52897
  };
52895
52898
 
52896
52899
  /**
@@ -55133,6 +55136,14 @@ create$3.prototype = ObjectSchema.prototype;
55133
55136
  const useFormValidatingContext = (formArray) => {
55134
55137
  const initialValues = {};
55135
55138
  const validationShape = {};
55139
+ console.log(formArray, 'formArrayformArray');
55140
+ const renderCustomError = (field) => {
55141
+ if (field.customErrorMessage) {
55142
+ validationShape[field.name] = validationShape[field.name].test("custom-check", field.customErrorMessage, // Use the actual custom message
55143
+ (value) => field.customErrorMessage && field.customErrorMessage > 0 // No additional validation logic required
55144
+ );
55145
+ }
55146
+ };
55136
55147
  formArray.forEach((field) => {
55137
55148
  var _a;
55138
55149
  switch (field.inputType) {
@@ -55142,7 +55153,9 @@ const useFormValidatingContext = (formArray) => {
55142
55153
  validationShape[field.name] = create$6()
55143
55154
  .typeError(field.errorMessage)
55144
55155
  .required(field.errorMessage);
55156
+ renderCustomError(field);
55145
55157
  }
55158
+ renderCustomError(field);
55146
55159
  break;
55147
55160
  case "password":
55148
55161
  initialValues[field.name] = "";
@@ -55150,7 +55163,9 @@ const useFormValidatingContext = (formArray) => {
55150
55163
  validationShape[field.name] = create$6()
55151
55164
  .typeError(field.errorMessage)
55152
55165
  .required(field.errorMessage);
55166
+ renderCustomError(field);
55153
55167
  }
55168
+ renderCustomError(field);
55154
55169
  break;
55155
55170
  case "email":
55156
55171
  initialValues[field.name] = "";
@@ -55161,6 +55176,7 @@ const useFormValidatingContext = (formArray) => {
55161
55176
  .test("valid-email", `Please enter valid Email`, (value) => {
55162
55177
  return /\@.*\..+/.test(value);
55163
55178
  });
55179
+ renderCustomError(field);
55164
55180
  }
55165
55181
  else {
55166
55182
  validationShape[field.name] = create$6()
@@ -55169,7 +55185,9 @@ const useFormValidatingContext = (formArray) => {
55169
55185
  // Custom validation to check for at least one period after '@'
55170
55186
  return !value || /\@.*\..+/.test(value);
55171
55187
  });
55188
+ renderCustomError(field);
55172
55189
  }
55190
+ renderCustomError(field);
55173
55191
  break;
55174
55192
  case "file":
55175
55193
  initialValues[field.name] = null;
@@ -55180,7 +55198,9 @@ const useFormValidatingContext = (formArray) => {
55180
55198
  (typeof value === "string" && value.trim() !== ""));
55181
55199
  })
55182
55200
  .required(field.errorMessage);
55201
+ renderCustomError(field);
55183
55202
  }
55203
+ renderCustomError(field);
55184
55204
  break;
55185
55205
  case "number":
55186
55206
  initialValues[field.name] = null;
@@ -55189,7 +55209,9 @@ const useFormValidatingContext = (formArray) => {
55189
55209
  .nullable()
55190
55210
  .typeError(field.errorMessage)
55191
55211
  .required(field.errorMessage);
55212
+ renderCustomError(field);
55192
55213
  }
55214
+ renderCustomError(field);
55193
55215
  break;
55194
55216
  case "pincode":
55195
55217
  initialValues[field.name] = null;
@@ -55205,7 +55227,9 @@ const useFormValidatingContext = (formArray) => {
55205
55227
  }
55206
55228
  return false;
55207
55229
  });
55230
+ renderCustomError(field);
55208
55231
  }
55232
+ renderCustomError(field);
55209
55233
  break;
55210
55234
  case "phoneNumber":
55211
55235
  initialValues[field.name] = null;
@@ -55221,6 +55245,7 @@ const useFormValidatingContext = (formArray) => {
55221
55245
  }
55222
55246
  return false;
55223
55247
  });
55248
+ renderCustomError(field);
55224
55249
  }
55225
55250
  else {
55226
55251
  validationShape[field.name] = create$5()
@@ -55229,6 +55254,7 @@ const useFormValidatingContext = (formArray) => {
55229
55254
  .test("is-two-digits", `Please enter a 10-digit Mobile Number`, (value) => {
55230
55255
  return !value || (value === null || value === void 0 ? void 0 : value.toString().length) === 2;
55231
55256
  });
55257
+ renderCustomError(field);
55232
55258
  }
55233
55259
  break;
55234
55260
  case "select":
@@ -55237,7 +55263,9 @@ const useFormValidatingContext = (formArray) => {
55237
55263
  validationShape[field.name] = create$6()
55238
55264
  .typeError(`Select ${field.label}`)
55239
55265
  .required(field.errorMessage);
55266
+ renderCustomError(field);
55240
55267
  }
55268
+ renderCustomError(field);
55241
55269
  break;
55242
55270
  case "multiselect":
55243
55271
  initialValues[field.name] = null;
@@ -55246,7 +55274,9 @@ const useFormValidatingContext = (formArray) => {
55246
55274
  create$6()
55247
55275
  .typeError(`Select atleast one ${field.label}`)
55248
55276
  .required(field.errorMessage);
55277
+ renderCustomError(field);
55249
55278
  }
55279
+ renderCustomError(field);
55250
55280
  break;
55251
55281
  case "datepicker":
55252
55282
  initialValues[field.name] = null;
@@ -55255,7 +55285,9 @@ const useFormValidatingContext = (formArray) => {
55255
55285
  create$6()
55256
55286
  .typeError(`Select ${field.label}`)
55257
55287
  .required(field.errorMessage);
55288
+ renderCustomError(field);
55258
55289
  }
55290
+ renderCustomError(field);
55259
55291
  break;
55260
55292
  case "yearpicker":
55261
55293
  initialValues[field.name] = null;
@@ -55264,7 +55296,9 @@ const useFormValidatingContext = (formArray) => {
55264
55296
  create$6()
55265
55297
  .typeError(`Select ${field.label}`)
55266
55298
  .required(field.errorMessage);
55299
+ renderCustomError(field);
55267
55300
  }
55301
+ renderCustomError(field);
55268
55302
  break;
55269
55303
  case "monthpicker":
55270
55304
  initialValues[field.name] = null;
@@ -55273,10 +55307,13 @@ const useFormValidatingContext = (formArray) => {
55273
55307
  create$6()
55274
55308
  .typeError(`Select ${field.label}`)
55275
55309
  .required(field.errorMessage);
55310
+ renderCustomError(field);
55276
55311
  }
55312
+ renderCustomError(field);
55277
55313
  break;
55278
55314
  case "toggleSwitch":
55279
55315
  initialValues[field.name] = true;
55316
+ renderCustomError(field);
55280
55317
  break;
55281
55318
  case "dateRangePicker":
55282
55319
  const today = new Date();
@@ -55297,13 +55334,17 @@ const useFormValidatingContext = (formArray) => {
55297
55334
  create$6()
55298
55335
  .typeError(`Select ${field.label}`)
55299
55336
  .required(field.errorMessage);
55337
+ renderCustomError(field);
55300
55338
  }
55339
+ renderCustomError(field);
55301
55340
  break;
55302
55341
  default:
55303
55342
  initialValues[field.name] = null; // default value if inputType is not recognized
55304
55343
  if (field.required && field.errorMessage) {
55305
55344
  validationShape[field.name] = create$8().required(field.errorMessage);
55345
+ renderCustomError(field);
55306
55346
  }
55347
+ renderCustomError(field);
55307
55348
  break;
55308
55349
  }
55309
55350
  });