tp-react-elements-dev 1.4.14 → 1.4.16

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 +4 -0
  2. package/dist/index.esm.js +53 -32
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +53 -32
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
package/dist/components/Form/FormRender.d.ts CHANGED
@@ -1,3 +1,5 @@
1
+ import { Theme } from "@emotion/react";
2
+ import { SxProps } from "@mui/material";
1
3
  export declare const renderLabel: (label: string, isRequired?: boolean, alignRight?: boolean) => import("react/jsx-runtime").JSX.Element;
2
4
  export declare function formatDateMonthAndYear(date: any): string;
3
5
  interface OptionsProps {
@@ -29,6 +31,8 @@ export interface FormSectionPropsItem {
29
31
  variant?: string;
30
32
  allowSpecialChars?: boolean;
31
33
  InputProps?: TextFieldInputProps;
34
+ customErrorMessage?: string | null;
35
+ sx?: SxProps<Theme>;
32
36
  }
33
37
  export interface FormRenderProps {
34
38
  item: FormSectionPropsItem;
package/dist/index.esm.js CHANGED
@@ -52040,14 +52040,11 @@ const SingleSelect = ({ props }) => {
52040
52040
  }, onBlur: (e) => {
52041
52041
  var _a, _b;
52042
52042
  ((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onBlurFn) && ((_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.onBlurFn(e));
52043
- }, size: "small", sx: {
52044
- "& .MuiAutocomplete-input": {
52043
+ }, size: "small", sx: Object.assign({ "& .MuiAutocomplete-input": {
52045
52044
  padding: "0px 0px 0px 5px !important",
52046
- },
52047
- "& .css-erkti9-MuiFormLabel-root-MuiInputLabel-root,.css-8edmr2-MuiFormLabel-root-MuiInputLabel-root": {
52045
+ }, "& .css-erkti9-MuiFormLabel-root-MuiInputLabel-root,.css-8edmr2-MuiFormLabel-root-MuiInputLabel-root": {
52048
52046
  top: "-3px",
52049
- },
52050
- }, ListboxProps: {
52047
+ } }, props.item.sx), ListboxProps: {
52051
52048
  onScroll: (event) => {
52052
52049
  const listboxNode = event.currentTarget;
52053
52050
  if (listboxNode.scrollTop + listboxNode.clientHeight ===
@@ -52301,28 +52298,21 @@ const RenderForm = (props) => {
52301
52298
  fontFamily: "Roboto-Reg",
52302
52299
  border: "none",
52303
52300
  },
52304
- }, sx: {
52305
- fontFamily: "Roboto-Reg",
52306
- "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52301
+ }, sx: Object.assign({ fontFamily: "Roboto-Reg", "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52307
52302
  top: "-10px",
52308
52303
  // fontSize:'14px !important'
52309
- },
52310
- "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52304
+ }, "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52311
52305
  top: "-10px",
52312
52306
  fontFamily: "Roboto-Reg",
52313
- },
52314
- "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52307
+ }, "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52315
52308
  fontFamily: "Roboto-Reg",
52316
- },
52317
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52309
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52318
52310
  outline: "none",
52319
52311
  border: "1px solid #ced4da", // Add this line to set border to none
52320
- },
52321
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52312
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52322
52313
  outline: "none",
52323
52314
  border: "none", // Set border to none when input is focused
52324
- },
52325
- },
52315
+ } }, props.item.sx),
52326
52316
  // classes={{ option: { color: "red !important" } }}
52327
52317
  value: field.value || "", size: "small", disabled: props.item.disable, onBlur: (e) => {
52328
52318
  var _a, _b;
@@ -52361,28 +52351,21 @@ const RenderForm = (props) => {
52361
52351
  e.target.value = e.target.value
52362
52352
  .replace(/\s/g, "")
52363
52353
  .replace(/[^a-zA-Z0-9!@#$%^&*()_+{}\[\]:;<>,.?/~`|\\-]/g, "");
52364
- }, sx: {
52365
- fontFamily: "Roboto-Reg",
52366
- "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52354
+ }, sx: Object.assign({ fontFamily: "Roboto-Reg", "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52367
52355
  top: "-10px",
52368
52356
  // fontSize:'14px !important'
52369
- },
52370
- "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52357
+ }, "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52371
52358
  top: "-10px",
52372
52359
  fontFamily: "Roboto-Reg",
52373
- },
52374
- "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52360
+ }, "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52375
52361
  fontFamily: "Roboto-Reg",
52376
- },
52377
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52362
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52378
52363
  outline: "none",
52379
52364
  border: "1px solid #ced4da", // Add this line to set border to none
52380
- },
52381
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52365
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52382
52366
  outline: "none",
52383
52367
  border: "none", // Set border to none when input is focused
52384
- },
52385
- },
52368
+ } }, props.item.sx),
52386
52369
  // classes={{ option: { color: "red !important" } }}
52387
52370
  value: field.value || "", disabled: props.item.disable })), ((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.helperText) && (jsxRuntimeExports.jsxs("span", Object.assign({ style: {
52388
52371
  fontFamily: "Roboto-Reg",
@@ -55116,6 +55099,14 @@ create$3.prototype = ObjectSchema.prototype;
55116
55099
  const useFormValidatingContext = (formArray) => {
55117
55100
  const initialValues = {};
55118
55101
  const validationShape = {};
55102
+ console.log(formArray, 'formArrayformArray');
55103
+ const renderCustomError = (field) => {
55104
+ if (field.customErrorMessage) {
55105
+ validationShape[field.name] = validationShape[field.name].test("custom-check", field.customErrorMessage, // Use the actual custom message
55106
+ (value) => field.customErrorMessage && field.customErrorMessage > 0 // No additional validation logic required
55107
+ );
55108
+ }
55109
+ };
55119
55110
  formArray.forEach((field) => {
55120
55111
  var _a;
55121
55112
  switch (field.inputType) {
@@ -55125,7 +55116,9 @@ const useFormValidatingContext = (formArray) => {
55125
55116
  validationShape[field.name] = create$6()
55126
55117
  .typeError(field.errorMessage)
55127
55118
  .required(field.errorMessage);
55119
+ renderCustomError(field);
55128
55120
  }
55121
+ renderCustomError(field);
55129
55122
  break;
55130
55123
  case "password":
55131
55124
  initialValues[field.name] = "";
@@ -55133,7 +55126,9 @@ const useFormValidatingContext = (formArray) => {
55133
55126
  validationShape[field.name] = create$6()
55134
55127
  .typeError(field.errorMessage)
55135
55128
  .required(field.errorMessage);
55129
+ renderCustomError(field);
55136
55130
  }
55131
+ renderCustomError(field);
55137
55132
  break;
55138
55133
  case "email":
55139
55134
  initialValues[field.name] = "";
@@ -55144,6 +55139,7 @@ const useFormValidatingContext = (formArray) => {
55144
55139
  .test("valid-email", `Please enter valid Email`, (value) => {
55145
55140
  return /\@.*\..+/.test(value);
55146
55141
  });
55142
+ renderCustomError(field);
55147
55143
  }
55148
55144
  else {
55149
55145
  validationShape[field.name] = create$6()
@@ -55152,7 +55148,9 @@ const useFormValidatingContext = (formArray) => {
55152
55148
  // Custom validation to check for at least one period after '@'
55153
55149
  return !value || /\@.*\..+/.test(value);
55154
55150
  });
55151
+ renderCustomError(field);
55155
55152
  }
55153
+ renderCustomError(field);
55156
55154
  break;
55157
55155
  case "file":
55158
55156
  initialValues[field.name] = null;
@@ -55163,7 +55161,9 @@ const useFormValidatingContext = (formArray) => {
55163
55161
  (typeof value === "string" && value.trim() !== ""));
55164
55162
  })
55165
55163
  .required(field.errorMessage);
55164
+ renderCustomError(field);
55166
55165
  }
55166
+ renderCustomError(field);
55167
55167
  break;
55168
55168
  case "number":
55169
55169
  initialValues[field.name] = null;
@@ -55172,7 +55172,9 @@ const useFormValidatingContext = (formArray) => {
55172
55172
  .nullable()
55173
55173
  .typeError(field.errorMessage)
55174
55174
  .required(field.errorMessage);
55175
+ renderCustomError(field);
55175
55176
  }
55177
+ renderCustomError(field);
55176
55178
  break;
55177
55179
  case "pincode":
55178
55180
  initialValues[field.name] = null;
@@ -55188,7 +55190,9 @@ const useFormValidatingContext = (formArray) => {
55188
55190
  }
55189
55191
  return false;
55190
55192
  });
55193
+ renderCustomError(field);
55191
55194
  }
55195
+ renderCustomError(field);
55192
55196
  break;
55193
55197
  case "phoneNumber":
55194
55198
  initialValues[field.name] = null;
@@ -55204,6 +55208,7 @@ const useFormValidatingContext = (formArray) => {
55204
55208
  }
55205
55209
  return false;
55206
55210
  });
55211
+ renderCustomError(field);
55207
55212
  }
55208
55213
  else {
55209
55214
  validationShape[field.name] = create$5()
@@ -55212,6 +55217,7 @@ const useFormValidatingContext = (formArray) => {
55212
55217
  .test("is-two-digits", `Please enter a 10-digit Mobile Number`, (value) => {
55213
55218
  return !value || (value === null || value === void 0 ? void 0 : value.toString().length) === 2;
55214
55219
  });
55220
+ renderCustomError(field);
55215
55221
  }
55216
55222
  break;
55217
55223
  case "select":
@@ -55220,7 +55226,9 @@ const useFormValidatingContext = (formArray) => {
55220
55226
  validationShape[field.name] = create$6()
55221
55227
  .typeError(`Select ${field.label}`)
55222
55228
  .required(field.errorMessage);
55229
+ renderCustomError(field);
55223
55230
  }
55231
+ renderCustomError(field);
55224
55232
  break;
55225
55233
  case "multiselect":
55226
55234
  initialValues[field.name] = null;
@@ -55229,7 +55237,9 @@ const useFormValidatingContext = (formArray) => {
55229
55237
  create$6()
55230
55238
  .typeError(`Select atleast one ${field.label}`)
55231
55239
  .required(field.errorMessage);
55240
+ renderCustomError(field);
55232
55241
  }
55242
+ renderCustomError(field);
55233
55243
  break;
55234
55244
  case "datepicker":
55235
55245
  initialValues[field.name] = null;
@@ -55238,7 +55248,9 @@ const useFormValidatingContext = (formArray) => {
55238
55248
  create$6()
55239
55249
  .typeError(`Select ${field.label}`)
55240
55250
  .required(field.errorMessage);
55251
+ renderCustomError(field);
55241
55252
  }
55253
+ renderCustomError(field);
55242
55254
  break;
55243
55255
  case "yearpicker":
55244
55256
  initialValues[field.name] = null;
@@ -55247,7 +55259,9 @@ const useFormValidatingContext = (formArray) => {
55247
55259
  create$6()
55248
55260
  .typeError(`Select ${field.label}`)
55249
55261
  .required(field.errorMessage);
55262
+ renderCustomError(field);
55250
55263
  }
55264
+ renderCustomError(field);
55251
55265
  break;
55252
55266
  case "monthpicker":
55253
55267
  initialValues[field.name] = null;
@@ -55256,10 +55270,13 @@ const useFormValidatingContext = (formArray) => {
55256
55270
  create$6()
55257
55271
  .typeError(`Select ${field.label}`)
55258
55272
  .required(field.errorMessage);
55273
+ renderCustomError(field);
55259
55274
  }
55275
+ renderCustomError(field);
55260
55276
  break;
55261
55277
  case "toggleSwitch":
55262
55278
  initialValues[field.name] = true;
55279
+ renderCustomError(field);
55263
55280
  break;
55264
55281
  case "dateRangePicker":
55265
55282
  const today = new Date();
@@ -55280,13 +55297,17 @@ const useFormValidatingContext = (formArray) => {
55280
55297
  create$6()
55281
55298
  .typeError(`Select ${field.label}`)
55282
55299
  .required(field.errorMessage);
55300
+ renderCustomError(field);
55283
55301
  }
55302
+ renderCustomError(field);
55284
55303
  break;
55285
55304
  default:
55286
55305
  initialValues[field.name] = null; // default value if inputType is not recognized
55287
55306
  if (field.required && field.errorMessage) {
55288
55307
  validationShape[field.name] = create$8().required(field.errorMessage);
55308
+ renderCustomError(field);
55289
55309
  }
55310
+ renderCustomError(field);
55290
55311
  break;
55291
55312
  }
55292
55313
  });