tp-react-elements-dev 1.5.0 → 1.5.2

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.
package/dist/index.js CHANGED
@@ -46971,7 +46971,7 @@ const extractValuesToArray = (inputString) => {
46971
46971
  };
46972
46972
  function MultiSelectV1({ props }) {
46973
46973
  var _a;
46974
- console.log(props, 'ksjh');
46974
+ console.log(props, "ksjh");
46975
46975
  const [personName, setPersonName] = React__namespace.useState(props.getValues(props.item.name)
46976
46976
  ? extractValuesToArray(props.getValues(props.item.name))
46977
46977
  : []);
@@ -47029,7 +47029,7 @@ function MultiSelectV1({ props }) {
47029
47029
  "& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
47030
47030
  top: "-10px",
47031
47031
  },
47032
- } }, { children: [jsxRuntimeExports.jsxs(InputLabel, Object.assign({ id: "demo-multiple-checkbox-label" }, { children: [props.item.label, props.item.required ? ' *' : ''] })), jsxRuntimeExports.jsxs(Select, Object.assign({ labelId: "demo-multiple-checkbox-label", id: "demo-multiple-checkbox", multiple: true, sx: {
47032
+ } }, { children: [jsxRuntimeExports.jsxs(InputLabel, Object.assign({ id: "demo-multiple-checkbox-label" }, { children: [props.item.label, props.item.required ? " *" : ""] })), jsxRuntimeExports.jsxs(Select, Object.assign({ labelId: "demo-multiple-checkbox-label", id: "demo-multiple-checkbox", multiple: true, sx: {
47033
47033
  "& .MuiTypography-root": {
47034
47034
  fontSize: "5px !important",
47035
47035
  },
@@ -47086,7 +47086,7 @@ function MultiSelectV1({ props }) {
47086
47086
  "& span": {
47087
47087
  fontSize: "12px !important",
47088
47088
  },
47089
- } })] }), option.value)))) : (jsxRuntimeExports.jsx(MenuItem, Object.assign({ disabled: true, value: "NA" }, { children: "No data Found" }), "NA"))] })), jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name, render: ({ message }) => (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: message })) })] })) }));
47089
+ } })] }), option.value)))) : (jsxRuntimeExports.jsx(MenuItem, Object.assign({ disabled: true, value: "NA" }, { children: "No data Found" }), "NA"))] })), jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name, render: ({ message }) => (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: message })) })] })) }, props.item.name));
47090
47090
  }
47091
47091
 
47092
47092
  var dayjs_min = {exports: {}};
@@ -52084,7 +52084,7 @@ const SingleSelect = ({ props }) => {
52084
52084
  }, getOptionLabel: (option) => option.label, renderInput: (params) => {
52085
52085
  return (jsxRuntimeExports.jsx(Tooltip, Object.assign({ title: params.inputProps.value && params.inputProps.value }, { children: jsxRuntimeExports.jsx(TextField, Object.assign({}, params, { placeholder: props.item.Placeholder, label: `${props.item.label}${props.item.required ? ' *' : ''}` })) })));
52086
52086
  }, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52087
- } }));
52087
+ } }, props.item.name));
52088
52088
  };
52089
52089
 
52090
52090
  var Visibility = createSvgIcon$1( /*#__PURE__*/jsxRuntimeExports.jsx("path", {
@@ -52227,23 +52227,66 @@ const DatepickerWrapperV2 = ({ props }) => {
52227
52227
  fontSize: "11px",
52228
52228
  color: "#3651d3",
52229
52229
  } }, { children: ["(", (_f = props === null || props === void 0 ? void 0 : props.item) === null || _f === void 0 ? void 0 : _f.helperText, ")"] }))), !(props === null || props === void 0 ? void 0 : props.getValues(props.item.name)) && (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) }))] }));
52230
- } }));
52230
+ } }, props.item.name));
52231
52231
  };
52232
52232
 
52233
52233
  const FormRenderFileUpload = ({ props }) => {
52234
52234
  var _a, _b, _c;
52235
- // const getDocument:any=document;
52236
- // useEffect(()=>{
52237
- // if(props.getValues(props.item.name)===null || props.getValues(props.item.name)==undefined){
52238
- // // getDocument.getElementById(props.item.name)?.value=''
52239
- // }
52240
- // },[props.getValues(props.item.name)])
52241
- return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ paddingLeft: "4px" }, { children: [((_a = props.item) === null || _a === void 0 ? void 0 : _a.label) && jsxRuntimeExports.jsx(Box, Object.assign({ sx: { fontSize: "10px;" } }, { children: renderLabel((_b = props.item) === null || _b === void 0 ? void 0 : _b.label, (_c = props.item) === null || _c === void 0 ? void 0 : _c.required) })), jsxRuntimeExports.jsx(TextField, { type: "file", id: props.item.name, inputProps: { accept: props.item.fileType === 'excel' ? ".xls, .xlsx" : '' }, onChange: (event) => {
52242
- var _a, _b, _c;
52243
- const file = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files[0];
52235
+ React$1.useEffect(() => {
52236
+ if (props.getValues(props.item.name) === null ||
52237
+ props.getValues(props.item.name) === undefined) {
52238
+ const element = document.getElementById(props.item.name);
52239
+ console.log(element, "elementelement");
52240
+ if (element) {
52241
+ element.value = ""; // Ensure it's an input element
52242
+ }
52243
+ }
52244
+ }, [props.getValues(props.item.name)]);
52245
+ return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ paddingLeft: "4px" }, { children: [((_a = props.item) === null || _a === void 0 ? void 0 : _a.label) && (jsxRuntimeExports.jsx(Box, Object.assign({ sx: { fontSize: "10px;" } }, { children: renderLabel((_b = props.item) === null || _b === void 0 ? void 0 : _b.label, (_c = props.item) === null || _c === void 0 ? void 0 : _c.required) }))), jsxRuntimeExports.jsx(TextField, { type: "file", id: props.item.name, inputProps: {
52246
+ accept: props.item.fileType === "excel"
52247
+ ? ".xls, .xlsx"
52248
+ : props.item.fileType === "pdf"
52249
+ ? ".pdf"
52250
+ : props.item.fileType === "all"
52251
+ ? ".pdf,.jpg,.jpeg,.png,.xls,.xlsx,.doc,.docx"
52252
+ : "",
52253
+ }, onChange: (event) => {
52254
+ var _a, _b, _c, _d, _e, _f;
52255
+ const file = event.target.files[0];
52244
52256
  const fileName = file ? file.name : null;
52245
- props.setValue((_b = props.item) === null || _b === void 0 ? void 0 : _b.name, file);
52246
- props.setValue(((_c = props.item) === null || _c === void 0 ? void 0 : _c.name) + "Name", fileName);
52257
+ const allowedExtensions = {
52258
+ excel: ["xls", "xlsx"],
52259
+ pdf: ["pdf"],
52260
+ all: ["pdf", "jpg", "jpeg", "png", "xls", "xlsx", "doc", "docx"],
52261
+ };
52262
+ const fileExtension = fileName
52263
+ ? fileName.split(".").pop().toLowerCase()
52264
+ : null;
52265
+ const validExtensions = props.item.fileType === "excel"
52266
+ ? allowedExtensions.excel
52267
+ : props.item.fileType === "pdf"
52268
+ ? allowedExtensions.pdf
52269
+ : allowedExtensions.all;
52270
+ if (((_a = props.item) === null || _a === void 0 ? void 0 : _a.fileType) &&
52271
+ fileExtension &&
52272
+ !validExtensions.includes(fileExtension)) {
52273
+ ((_b = props.item) === null || _b === void 0 ? void 0 : _b.handleFileError) && ((_c = props.item) === null || _c === void 0 ? void 0 : _c.handleFileError(`Please upload ${allowedExtensions[props.item.fileType].join(",")} Files only`));
52274
+ event.target.value = ""; // Clear the file input
52275
+ return;
52276
+ }
52277
+ // Proceed if valid
52278
+ props.setValue((_d = props.item) === null || _d === void 0 ? void 0 : _d.name, file);
52279
+ props.setValue(((_e = props.item) === null || _e === void 0 ? void 0 : _e.name) + "Name", fileName);
52280
+ (_f = props === null || props === void 0 ? void 0 : props.item) === null || _f === void 0 ? void 0 : _f.onChangeInput({
52281
+ [props.item.name]: file,
52282
+ [props.item.name + "Name"]: fileName,
52283
+ });
52284
+ // props.setValue(props.item?.name, file);
52285
+ // props.setValue(props.item?.name + "Name", fileName);
52286
+ // props?.item?.onChangeInput({
52287
+ // [props.item.name]: file,
52288
+ // [props.item.name + "Name"]: fileName,
52289
+ // });
52247
52290
  }, sx: { width: "100%" } })] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52248
52291
  };
52249
52292
 
@@ -52263,14 +52306,14 @@ const SingleSelectNonAutoComplete = ({ props }) => {
52263
52306
  useStyles();
52264
52307
  return (jsxRuntimeExports.jsxs(FormControl, Object.assign({ fullWidth: true, sx: { position: "relative" } }, { children: [jsxRuntimeExports.jsx(InputLabel, Object.assign({ id: "demo-simple-select-label" }, { children: props.item.label })), jsxRuntimeExports.jsx(Select, Object.assign({ labelId: "demo-simple-select-label", id: "demo-simple-select",
52265
52308
  // {...props.register(props.item.name)}
52266
- value: props.getValues(props.item.name), label: `${props.item.label}${props.item.required ? ' *' : ''}`, onChange: (e) => props.setValue(props.item.name, e.target.value), onBlur: (e) => {
52309
+ value: props.getValues(props.item.name), label: `${props.item.label}${props.item.required ? " *" : ""}`, onChange: (e) => props.setValue(props.item.name, e.target.value), onBlur: (e) => {
52267
52310
  var _a, _b;
52268
52311
  ((_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));
52269
52312
  } }, { children: props.item.options.map((item) => (jsxRuntimeExports.jsx(MenuItem, Object.assign({ sx: {
52270
52313
  fontSize: "11px",
52271
52314
  fontFamily: "Roboto-Reg",
52272
52315
  zIndex: 2000,
52273
- }, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })));
52316
+ }, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }), props.item.name));
52274
52317
  };
52275
52318
 
52276
52319
  const FormActiveSwitch = ({ props }) => {
@@ -52367,7 +52410,7 @@ const RenderForm = (props) => {
52367
52410
  fontSize: "11px",
52368
52411
  color: "#3651d3",
52369
52412
  } }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52370
- } }) }));
52413
+ } }, props.item.name) }));
52371
52414
  case "register-number":
52372
52415
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
52373
52416
  var _a, _b;
@@ -52405,9 +52448,9 @@ const RenderForm = (props) => {
52405
52448
  fontSize: "11px",
52406
52449
  color: "#3651d3",
52407
52450
  } }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52408
- } }) }));
52451
+ } }, props.item.name) }));
52409
52452
  case "password":
52410
- return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) })));
52453
+ return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) }), props.item.name));
52411
52454
  case "select":
52412
52455
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(SingleSelect, { props: props }) }));
52413
52456
  case "select-v2":
@@ -52458,7 +52501,7 @@ const RenderForm = (props) => {
52458
52501
  props.item.onInputProps && props.item.onInputProps(e);
52459
52502
  },
52460
52503
  }, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52461
- } }) }));
52504
+ } }, props.item.name) }));
52462
52505
  case "decimal":
52463
52506
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { name: props.item.name, control: props.control, disabled: (_b = props.item) === null || _b === void 0 ? void 0 : _b.disable, render: ({ field }) => (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({ type: "text", size: "small", label: `${props.item.label}${props.item.required ? " *" : ""}` }, field, { onChange: (e) => (props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors(props.item.name)), sx: {
52464
52507
  "& input": {
@@ -52488,7 +52531,7 @@ const RenderForm = (props) => {
52488
52531
  pattern: "[1-9]",
52489
52532
  maxLength: 7,
52490
52533
  },
52491
- } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52534
+ } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52492
52535
  // case "alpha-numerical":
52493
52536
  // return (
52494
52537
  // <>
@@ -52702,7 +52745,7 @@ const RenderForm = (props) => {
52702
52745
  textField: (textFieldProps) => (jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
52703
52746
  shrink: true,
52704
52747
  } }))),
52705
- } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52748
+ } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52706
52749
  case "dateRangePicker":
52707
52750
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(DateRangePickerComponent, { props: props }) }));
52708
52751
  case "monthpicker":
@@ -52717,39 +52760,31 @@ const RenderForm = (props) => {
52717
52760
  fontFamily: "Roboto-Reg",
52718
52761
  border: "none",
52719
52762
  },
52720
- }, sx: {
52721
- fontFamily: "Roboto-Reg",
52722
- "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52763
+ }, sx: Object.assign({ fontFamily: "Roboto-Reg", "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52723
52764
  top: "-10px",
52724
- },
52725
- "& input": {
52765
+ }, "& input": {
52726
52766
  fontSize: "11px",
52727
52767
  // textTransform:'uppercase'
52728
- },
52729
- "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52768
+ }, "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52730
52769
  top: "-10px",
52731
52770
  fontFamily: "Roboto-Reg",
52732
- },
52733
- "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52771
+ }, "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52734
52772
  fontFamily: "Roboto-Reg",
52735
- },
52736
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52773
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52737
52774
  outline: "none",
52738
52775
  border: "1px solid #ced4da", // Add this line to set border to none
52739
- },
52740
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52776
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52741
52777
  outline: "none",
52742
52778
  border: "none", // Set border to none when input is focused
52743
- },
52744
- "& .css-1y03twt-MuiInputBase-root-MuiOutlinedInput-root": {
52779
+ }, "& .css-1y03twt-MuiInputBase-root-MuiOutlinedInput-root": {
52745
52780
  padding: "5px 5px",
52746
52781
  fontSize: "11px",
52747
- },
52748
- "& textarea": {
52782
+ }, "& textarea": {
52749
52783
  fontSize: "11px",
52750
52784
  // textTransform:'uppercase'
52751
- },
52752
- }, minRows: props.item.minRows || 1,
52785
+ maxHeight: "500px !important",
52786
+ overflow: "auto",
52787
+ } }, props.item.sx), minRows: props.item.minRows || 1,
52753
52788
  // maxRows={2}
52754
52789
  placeholder: props.item.placeholder || "Type Something..." }, field, { label: `${props.item.label}${props.item.required ? " *" : ""}`, value: field.value || "", disabled: props.item.disable, inputProps: {
52755
52790
  onInput: (e) => {
@@ -52763,7 +52798,7 @@ const RenderForm = (props) => {
52763
52798
  e.target.value = "";
52764
52799
  }
52765
52800
  },
52766
- } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52801
+ } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52767
52802
  // case "textarea-normal":
52768
52803
  // return (
52769
52804
  // <>
@@ -52800,7 +52835,7 @@ const RenderForm = (props) => {
52800
52835
  // </>
52801
52836
  // );
52802
52837
  case "toggleSwitch":
52803
- return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(FormActiveSwitch, { props: props }) }));
52838
+ return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(FormActiveSwitch, { props: props }, props.item.name) }));
52804
52839
  // case "percentage-number":
52805
52840
  // return (
52806
52841
  // <>
@@ -52908,9 +52943,9 @@ const FormRenderWrapper = ({ formArray, name, numberOfColumns = 3, form, }) => {
52908
52943
  // useEffect(() => {
52909
52944
  // // form.reset(initialValues, { resolver: yupResolver(validationSchema) });
52910
52945
  // }, [formArray, validationSchema, initialValues]);
52911
- 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) => {
52912
- 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));
52913
- }) })) })) })));
52946
+ return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
52947
+ 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));
52948
+ }) })) })));
52914
52949
  };
52915
52950
 
52916
52951
  /**