tp-react-elements-dev 1.4.4 → 1.4.5
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/README.md +96 -46
- package/dist/components/Form/FormRender.d.ts +2 -1
- package/dist/index.esm.js +38 -16
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +38 -16
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -41055,11 +41055,11 @@ styled$1(Button)(() => ({
|
|
|
41055
41055
|
backgroundColor: ' #343a40',
|
|
41056
41056
|
borderColor: '#343a40'
|
|
41057
41057
|
}));
|
|
41058
|
-
styled$1(Grid)(() => ({
|
|
41058
|
+
const LabelComponent = styled$1(Grid)(() => ({
|
|
41059
41059
|
alignItems: 'start',
|
|
41060
41060
|
gap: '1px'
|
|
41061
41061
|
}));
|
|
41062
|
-
styled$1('text')(() => ({
|
|
41062
|
+
const ImportantMark = styled$1('text')(() => ({
|
|
41063
41063
|
color: 'red'
|
|
41064
41064
|
}));
|
|
41065
41065
|
styled$1(Box)(() => ({
|
|
@@ -50397,6 +50397,9 @@ const SingleSelect = ({ props }) => {
|
|
|
50397
50397
|
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50398
50398
|
((_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.onChangeFn(newValue === null || newValue === void 0 ? void 0 : newValue.value));
|
|
50399
50399
|
(props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors((_c = props === null || props === void 0 ? void 0 : props.item) === null || _c === void 0 ? void 0 : _c.name));
|
|
50400
|
+
}, onBlur: (e) => {
|
|
50401
|
+
var _a, _b;
|
|
50402
|
+
((_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));
|
|
50400
50403
|
}, size: "small", sx: {
|
|
50401
50404
|
"& .MuiAutocomplete-input": {
|
|
50402
50405
|
padding: "0px 0px 0px 5px !important",
|
|
@@ -50540,6 +50543,10 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
50540
50543
|
// style: { input: { cursor: "pointer" } },
|
|
50541
50544
|
onClick: () => handleToggle(),
|
|
50542
50545
|
inputRef: inputTextRef,
|
|
50546
|
+
onBlur: (e) => {
|
|
50547
|
+
var _a, _b;
|
|
50548
|
+
((_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));
|
|
50549
|
+
}
|
|
50543
50550
|
// onFocus: () => inputTextRef.current?.blur(),
|
|
50544
50551
|
},
|
|
50545
50552
|
}, sx: {
|
|
@@ -50558,23 +50565,20 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
50558
50565
|
};
|
|
50559
50566
|
|
|
50560
50567
|
const FormRenderFileUpload = ({ props }) => {
|
|
50568
|
+
var _a, _b, _c;
|
|
50561
50569
|
// const getDocument:any=document;
|
|
50562
50570
|
// useEffect(()=>{
|
|
50563
50571
|
// if(props.getValues(props.item.name)===null || props.getValues(props.item.name)==undefined){
|
|
50564
50572
|
// // getDocument.getElementById(props.item.name)?.value=''
|
|
50565
50573
|
// }
|
|
50566
50574
|
// },[props.getValues(props.item.name)])
|
|
50567
|
-
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.
|
|
50568
|
-
|
|
50569
|
-
|
|
50570
|
-
|
|
50571
|
-
|
|
50572
|
-
|
|
50573
|
-
|
|
50574
|
-
// [props.item.name]: file,
|
|
50575
|
-
// [props.item.name + "Name"]: fileName,
|
|
50576
|
-
// });
|
|
50577
|
-
}, sx: { width: "100%" } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
50575
|
+
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) => {
|
|
50576
|
+
var _a, _b, _c;
|
|
50577
|
+
const file = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files[0];
|
|
50578
|
+
const fileName = file ? file.name : null;
|
|
50579
|
+
props.setValue((_b = props.item) === null || _b === void 0 ? void 0 : _b.name, file);
|
|
50580
|
+
props.setValue(((_c = props.item) === null || _c === void 0 ? void 0 : _c.name) + "Name", fileName);
|
|
50581
|
+
}, sx: { width: "100%" } })] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
50578
50582
|
};
|
|
50579
50583
|
|
|
50580
50584
|
const useStyles = makeStyles((theme) => ({
|
|
@@ -50593,7 +50597,10 @@ const SingleSelectNonAutoComplete = ({ props }) => {
|
|
|
50593
50597
|
useStyles();
|
|
50594
50598
|
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",
|
|
50595
50599
|
// {...props.register(props.item.name)}
|
|
50596
|
-
value: props.getValues(props.item.name), label: `${props.item.label}${props.item.required ? ' *' : ''}`, onChange: (e) => props.setValue(props.item.name, e.target.value)
|
|
50600
|
+
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) => {
|
|
50601
|
+
var _a, _b;
|
|
50602
|
+
((_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));
|
|
50603
|
+
} }, { children: props.item.options.map((item) => (jsxRuntimeExports.jsx(MenuItem, Object.assign({ sx: {
|
|
50597
50604
|
fontSize: "11px",
|
|
50598
50605
|
fontFamily: "Roboto-Reg",
|
|
50599
50606
|
zIndex: 2000,
|
|
@@ -50611,6 +50618,9 @@ const FormActiveSwitch = ({ props }) => {
|
|
|
50611
50618
|
return (jsxRuntimeExports.jsx("div", { children: jsxRuntimeExports.jsxs("div", Object.assign({ className: "m-form__input" }, { children: [props.item.label && jsxRuntimeExports.jsx("span", Object.assign({ style: { fontSize: "12px", fontWeight: 400, paddingRight: 10 } }, { children: props.item.label })), jsxRuntimeExports.jsxs("span", Object.assign({ className: "switch prestashop-switch fixed-width-lg" }, { children: [jsxRuntimeExports.jsx("input", { checked: active, id: props.item.name + '_on', name: props.item.name, type: "radio", value: "Active", onChange: handleSwitchChange }), jsxRuntimeExports.jsx("label", Object.assign({ htmlFor: props.item.name + '_on', style: { fontFamily: "Roboto-Reg", textTransform: "none" } }, { children: props.item.label1 ? props.item.label1 : 'Active' })), jsxRuntimeExports.jsx("input", { id: props.item.name + '_off', checked: !active, name: props.item.name, type: "radio", value: "In Active", onChange: handleSwitchChange }), jsxRuntimeExports.jsx("label", Object.assign({ htmlFor: props.item.name + '_off', style: { fontFamily: "Roboto-Reg", textTransform: "none" } }, { children: props.item.label2 ? props.item.label2 : 'In Active' })), jsxRuntimeExports.jsx("a", { className: "slide-button btn" })] }))] })) }));
|
|
50612
50619
|
};
|
|
50613
50620
|
|
|
50621
|
+
const renderLabel = (label, isRequired, alignRight) => {
|
|
50622
|
+
return (jsxRuntimeExports.jsx(LabelComponent, Object.assign({ container: true, style: { justifyContent: "normal" } }, { children: jsxRuntimeExports.jsxs(Box, Object.assign({ fontSize: "12px", fontFamily: "Roboto-Reg" }, { children: [label, isRequired ? jsxRuntimeExports.jsx(ImportantMark, { children: " *" }) : ""] })) })));
|
|
50623
|
+
};
|
|
50614
50624
|
function formatDateMonthAndYear(date) {
|
|
50615
50625
|
// Check if date is a string
|
|
50616
50626
|
if (typeof date !== 'string') {
|
|
@@ -50659,7 +50669,10 @@ const RenderForm = (props) => {
|
|
|
50659
50669
|
},
|
|
50660
50670
|
},
|
|
50661
50671
|
// classes={{ option: { color: "red !important" } }}
|
|
50662
|
-
value: field.value || "", size: "small", disabled: props.item.disable
|
|
50672
|
+
value: field.value || "", size: "small", disabled: props.item.disable, onBlur: (e) => {
|
|
50673
|
+
var _a, _b;
|
|
50674
|
+
((_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));
|
|
50675
|
+
} })), ((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.helperText) && (jsxRuntimeExports.jsxs("span", Object.assign({ style: {
|
|
50663
50676
|
fontFamily: "Roboto-Reg",
|
|
50664
50677
|
fontSize: "11px",
|
|
50665
50678
|
color: "#3651d3",
|
|
@@ -50668,7 +50681,10 @@ const RenderForm = (props) => {
|
|
|
50668
50681
|
case "register-number":
|
|
50669
50682
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
|
|
50670
50683
|
var _a, _b;
|
|
50671
|
-
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({}, field, { fullWidth: true,
|
|
50684
|
+
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({}, field, { fullWidth: true, onBlur: (e) => {
|
|
50685
|
+
var _a, _b;
|
|
50686
|
+
((_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));
|
|
50687
|
+
}, label: `${props.item.label}${props.item.required ? ' *' : ''}`, InputProps: {
|
|
50672
50688
|
style: {
|
|
50673
50689
|
fontFamily: "Roboto-Reg",
|
|
50674
50690
|
border: "none",
|
|
@@ -50726,6 +50742,9 @@ const RenderForm = (props) => {
|
|
|
50726
50742
|
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50727
50743
|
((_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.onChangeFn(e.target.value));
|
|
50728
50744
|
(props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors(props.item.name));
|
|
50745
|
+
}, onBlur: (e) => {
|
|
50746
|
+
var _a, _b;
|
|
50747
|
+
((_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));
|
|
50729
50748
|
}, sx: {
|
|
50730
50749
|
"& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
50731
50750
|
top: "-10px",
|
|
@@ -50743,6 +50762,9 @@ const RenderForm = (props) => {
|
|
|
50743
50762
|
"& .css-16hdwvj,.css-1idq7r3-MuiFormLabel-root-MuiInputLabel-root": {
|
|
50744
50763
|
top: "-5px",
|
|
50745
50764
|
},
|
|
50765
|
+
}, onBlur: (e) => {
|
|
50766
|
+
var _a, _b;
|
|
50767
|
+
((_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));
|
|
50746
50768
|
}, onInput: (e) => {
|
|
50747
50769
|
// Allow numbers, a single decimal point, and negation in the input
|
|
50748
50770
|
e.target.value = e.target.value.replace(/[^0-9.-]/g, "");
|