tp-react-elements-dev 1.5.0 → 1.5.1

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 +1 -1
  2. package/dist/index.esm.js +40 -44
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +40 -44
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
package/dist/components/Form/FormRender.d.ts CHANGED
@@ -26,7 +26,7 @@ export interface FormSectionPropsItem {
26
26
  maxDate?: string;
27
27
  placeholder?: string;
28
28
  minRows?: string | number;
29
- CustomProps?: string;
29
+ CustomProps?: any;
30
30
  numberOfColumns?: number;
31
31
  monthSpan?: number;
32
32
  variant?: string;
package/dist/index.esm.js CHANGED
@@ -46951,7 +46951,7 @@ const extractValuesToArray = (inputString) => {
46951
46951
  };
46952
46952
  function MultiSelectV1({ props }) {
46953
46953
  var _a;
46954
- console.log(props, 'ksjh');
46954
+ console.log(props, "ksjh");
46955
46955
  const [personName, setPersonName] = React$1.useState(props.getValues(props.item.name)
46956
46956
  ? extractValuesToArray(props.getValues(props.item.name))
46957
46957
  : []);
@@ -47009,7 +47009,7 @@ function MultiSelectV1({ props }) {
47009
47009
  "& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
47010
47010
  top: "-10px",
47011
47011
  },
47012
- } }, { 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: {
47012
+ } }, { 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: {
47013
47013
  "& .MuiTypography-root": {
47014
47014
  fontSize: "5px !important",
47015
47015
  },
@@ -47066,7 +47066,7 @@ function MultiSelectV1({ props }) {
47066
47066
  "& span": {
47067
47067
  fontSize: "12px !important",
47068
47068
  },
47069
- } })] }), 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 })) })] })) }));
47069
+ } })] }), 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));
47070
47070
  }
47071
47071
 
47072
47072
  var dayjs_min = {exports: {}};
@@ -52064,7 +52064,7 @@ const SingleSelect = ({ props }) => {
52064
52064
  }, getOptionLabel: (option) => option.label, renderInput: (params) => {
52065
52065
  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 ? ' *' : ''}` })) })));
52066
52066
  }, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52067
- } }));
52067
+ } }, props.item.name));
52068
52068
  };
52069
52069
 
52070
52070
  var Visibility = createSvgIcon$1( /*#__PURE__*/jsxRuntimeExports.jsx("path", {
@@ -52207,23 +52207,27 @@ const DatepickerWrapperV2 = ({ props }) => {
52207
52207
  fontSize: "11px",
52208
52208
  color: "#3651d3",
52209
52209
  } }, { 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 }) }))] }));
52210
- } }));
52210
+ } }, props.item.name));
52211
52211
  };
52212
52212
 
52213
52213
  const FormRenderFileUpload = ({ props }) => {
52214
52214
  var _a, _b, _c;
52215
- // const getDocument:any=document;
52216
- // useEffect(()=>{
52217
- // if(props.getValues(props.item.name)===null || props.getValues(props.item.name)==undefined){
52218
- // // getDocument.getElementById(props.item.name)?.value=''
52219
- // }
52220
- // },[props.getValues(props.item.name)])
52215
+ useEffect(() => {
52216
+ if (props.getValues(props.item.name) === null || props.getValues(props.item.name) === undefined) {
52217
+ const element = document.getElementById(props.item.name);
52218
+ console.log(element, 'elementelement');
52219
+ if (element) {
52220
+ element.value = ''; // Ensure it's an input element
52221
+ }
52222
+ }
52223
+ }, [props.getValues(props.item.name)]);
52221
52224
  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) => {
52222
- var _a, _b, _c;
52225
+ var _a, _b, _c, _d, _e;
52223
52226
  const file = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files[0];
52224
52227
  const fileName = file ? file.name : null;
52225
52228
  props.setValue((_b = props.item) === null || _b === void 0 ? void 0 : _b.name, file);
52226
52229
  props.setValue(((_c = props.item) === null || _c === void 0 ? void 0 : _c.name) + "Name", fileName);
52230
+ ((_d = props.item) === null || _d === void 0 ? void 0 : _d.onInputProps) && ((_e = props.item) === null || _e === void 0 ? void 0 : _e.onInputProps(event));
52227
52231
  }, sx: { width: "100%" } })] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52228
52232
  };
52229
52233
 
@@ -52243,14 +52247,14 @@ const SingleSelectNonAutoComplete = ({ props }) => {
52243
52247
  useStyles();
52244
52248
  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",
52245
52249
  // {...props.register(props.item.name)}
52246
- 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) => {
52250
+ 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) => {
52247
52251
  var _a, _b;
52248
52252
  ((_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));
52249
52253
  } }, { children: props.item.options.map((item) => (jsxRuntimeExports.jsx(MenuItem, Object.assign({ sx: {
52250
52254
  fontSize: "11px",
52251
52255
  fontFamily: "Roboto-Reg",
52252
52256
  zIndex: 2000,
52253
- }, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })));
52257
+ }, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }), props.item.name));
52254
52258
  };
52255
52259
 
52256
52260
  const FormActiveSwitch = ({ props }) => {
@@ -52347,7 +52351,7 @@ const RenderForm = (props) => {
52347
52351
  fontSize: "11px",
52348
52352
  color: "#3651d3",
52349
52353
  } }, { 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 }) })] }));
52350
- } }) }));
52354
+ } }, props.item.name) }));
52351
52355
  case "register-number":
52352
52356
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
52353
52357
  var _a, _b;
@@ -52385,9 +52389,9 @@ const RenderForm = (props) => {
52385
52389
  fontSize: "11px",
52386
52390
  color: "#3651d3",
52387
52391
  } }, { 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 }) })] }));
52388
- } }) }));
52392
+ } }, props.item.name) }));
52389
52393
  case "password":
52390
- return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) })));
52394
+ return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) }), props.item.name));
52391
52395
  case "select":
52392
52396
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(SingleSelect, { props: props }) }));
52393
52397
  case "select-v2":
@@ -52438,7 +52442,7 @@ const RenderForm = (props) => {
52438
52442
  props.item.onInputProps && props.item.onInputProps(e);
52439
52443
  },
52440
52444
  }, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
52441
- } }) }));
52445
+ } }, props.item.name) }));
52442
52446
  case "decimal":
52443
52447
  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: {
52444
52448
  "& input": {
@@ -52468,7 +52472,7 @@ const RenderForm = (props) => {
52468
52472
  pattern: "[1-9]",
52469
52473
  maxLength: 7,
52470
52474
  },
52471
- } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52475
+ } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52472
52476
  // case "alpha-numerical":
52473
52477
  // return (
52474
52478
  // <>
@@ -52682,7 +52686,7 @@ const RenderForm = (props) => {
52682
52686
  textField: (textFieldProps) => (jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
52683
52687
  shrink: true,
52684
52688
  } }))),
52685
- } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52689
+ } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52686
52690
  case "dateRangePicker":
52687
52691
  return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(DateRangePickerComponent, { props: props }) }));
52688
52692
  case "monthpicker":
@@ -52697,39 +52701,31 @@ const RenderForm = (props) => {
52697
52701
  fontFamily: "Roboto-Reg",
52698
52702
  border: "none",
52699
52703
  },
52700
- }, sx: {
52701
- fontFamily: "Roboto-Reg",
52702
- "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52704
+ }, sx: Object.assign({ fontFamily: "Roboto-Reg", "& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
52703
52705
  top: "-10px",
52704
- },
52705
- "& input": {
52706
+ }, "& input": {
52706
52707
  fontSize: "11px",
52707
52708
  // textTransform:'uppercase'
52708
- },
52709
- "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52709
+ }, "& .css-2rul56-MuiFormLabel-root-MuiInputLabel-root": {
52710
52710
  top: "-10px",
52711
52711
  fontFamily: "Roboto-Reg",
52712
- },
52713
- "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52712
+ }, "& .css-12ciryo-MuiFormLabel-root-MuiInputLabel-root ": {
52714
52713
  fontFamily: "Roboto-Reg",
52715
- },
52716
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52714
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input ": {
52717
52715
  outline: "none",
52718
52716
  border: "1px solid #ced4da", // Add this line to set border to none
52719
- },
52720
- "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52717
+ }, "& .css-1gq5vhi-MuiInputBase-root-MuiOutlinedInput-root input:focus ": {
52721
52718
  outline: "none",
52722
52719
  border: "none", // Set border to none when input is focused
52723
- },
52724
- "& .css-1y03twt-MuiInputBase-root-MuiOutlinedInput-root": {
52720
+ }, "& .css-1y03twt-MuiInputBase-root-MuiOutlinedInput-root": {
52725
52721
  padding: "5px 5px",
52726
52722
  fontSize: "11px",
52727
- },
52728
- "& textarea": {
52723
+ }, "& textarea": {
52729
52724
  fontSize: "11px",
52730
52725
  // textTransform:'uppercase'
52731
- },
52732
- }, minRows: props.item.minRows || 1,
52726
+ maxHeight: "500px !important",
52727
+ overflow: "auto",
52728
+ } }, props.item.sx), minRows: props.item.minRows || 1,
52733
52729
  // maxRows={2}
52734
52730
  placeholder: props.item.placeholder || "Type Something..." }, field, { label: `${props.item.label}${props.item.required ? " *" : ""}`, value: field.value || "", disabled: props.item.disable, inputProps: {
52735
52731
  onInput: (e) => {
@@ -52743,7 +52739,7 @@ const RenderForm = (props) => {
52743
52739
  e.target.value = "";
52744
52740
  }
52745
52741
  },
52746
- } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
52742
+ } })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }, props.item.name) }));
52747
52743
  // case "textarea-normal":
52748
52744
  // return (
52749
52745
  // <>
@@ -52780,7 +52776,7 @@ const RenderForm = (props) => {
52780
52776
  // </>
52781
52777
  // );
52782
52778
  case "toggleSwitch":
52783
- return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(FormActiveSwitch, { props: props }) }));
52779
+ return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(FormActiveSwitch, { props: props }, props.item.name) }));
52784
52780
  // case "percentage-number":
52785
52781
  // return (
52786
52782
  // <>
@@ -52888,9 +52884,9 @@ const FormRenderWrapper = ({ formArray, name, numberOfColumns = 3, form, }) => {
52888
52884
  // useEffect(() => {
52889
52885
  // // form.reset(initialValues, { resolver: yupResolver(validationSchema) });
52890
52886
  // }, [formArray, validationSchema, initialValues]);
52891
- 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) => {
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
- }) })) })) })));
52887
+ return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
52888
+ 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));
52889
+ }) })) })));
52894
52890
  };
52895
52891
 
52896
52892
  /**