@paro.io/expert-shared-components 1.14.1 → 1.14.3
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/LICENSE +21 -21
- package/README.md +2 -2
- package/lib/components/ClientReferencesSection/DeleteButton.js +11 -11
- package/lib/components/ClientReferencesSection/ParoError.js +10 -10
- package/lib/components/ClientReferencesSection/TagsSection.js +2 -2
- package/lib/components/ClientReferencesSection/styles/BrandedTypography.js +2 -2
- package/lib/components/ClientReferencesSection/styles/Buttons.js +15 -15
- package/lib/components/ClientReferencesSection/styles/Name.js +5 -5
- package/lib/components/ClientReferencesSection/styles/NullContentConditionalColor.js +4 -4
- package/lib/components/ClientReferencesSection/styles/SectionBody.js +11 -11
- package/lib/components/ClientReferencesSection/styles/SectionTitle.js +6 -6
- package/lib/components/ClientReferencesSection/styles/Tags.js +2 -2
- package/lib/components/DiscussionThread/chat.d.ts +22 -22
- package/lib/components/DiscussionThread/chat.js +106 -106
- package/lib/components/DocumentCenter/DocumentTable.d.ts +15 -15
- package/lib/components/DocumentCenter/DocumentTable.js +350 -350
- package/lib/components/DocumentCenter/UploadFilesButton.d.ts +6 -6
- package/lib/components/DocumentCenter/UploadFilesButton.js +29 -29
- package/lib/components/EarningsTracker/ActiveProjectCard.d.ts +52 -52
- package/lib/components/EarningsTracker/ActiveProjectCard.js +161 -161
- package/lib/components/EarningsTracker/CenterCardUI.d.ts +13 -13
- package/lib/components/EarningsTracker/CenterCardUI.js +134 -134
- package/lib/components/EarningsTracker/EarningsTracker.d.ts +52 -52
- package/lib/components/EarningsTracker/EarningsTracker.js +508 -508
- package/lib/components/EarningsTracker/EditDateModal.d.ts +22 -22
- package/lib/components/EarningsTracker/EditDateModal.js +149 -149
- package/lib/components/EarningsTracker/EmailModal.d.ts +14 -14
- package/lib/components/EarningsTracker/EmailModal.js +79 -79
- package/lib/components/EarningsTracker/EndProjectModal.d.ts +56 -56
- package/lib/components/EarningsTracker/EndProjectModal.js +221 -221
- package/lib/components/EarningsTracker/LeftCardUI.d.ts +18 -18
- package/lib/components/EarningsTracker/LeftCardUI.js +189 -189
- package/lib/components/EarningsTracker/LogTimeModalAuthenticated.d.ts +52 -52
- package/lib/components/EarningsTracker/LogTimeModalAuthenticated.js +358 -358
- package/lib/components/EarningsTracker/ProgressBar.d.ts +4 -4
- package/lib/components/EarningsTracker/ProgressBar.js +66 -66
- package/lib/components/EarningsTracker/ReviewRequestModal.d.ts +17 -17
- package/lib/components/EarningsTracker/ReviewRequestModal.js +135 -135
- package/lib/components/EarningsTracker/RightCardUI.d.ts +46 -46
- package/lib/components/EarningsTracker/RightCardUI.js +231 -231
- package/lib/components/EarningsTracker/index.d.ts +1 -1
- package/lib/components/EarningsTracker/index.js +5 -5
- package/lib/components/Escalations/CustomTag.d.ts +3 -3
- package/lib/components/Escalations/CustomTag.js +25 -25
- package/lib/components/Escalations/ViewReponseModal.d.ts +8 -8
- package/lib/components/Escalations/ViewReponseModal.js +27 -27
- package/lib/components/ExpertProfileHeader/ActionButtonSection.js +6 -6
- package/lib/components/ExpertProfileHeader/NetworkSection.js +1 -1
- package/lib/components/ExpertProfileHeader/ProfileSection.js +7 -7
- package/lib/components/Invoices/TestDecisionSection.d.ts +1 -1
- package/lib/components/Invoices/TestDecisionSection.js +126 -126
- package/lib/components/OrganizationChart/OrganizationChart.d.ts +15 -15
- package/lib/components/OrganizationChart/OrganizationChart.js +312 -312
- package/lib/components/OrganizationChart/PersonCard.js +5 -5
- package/lib/components/OrganizationChart/utils.js +79 -79
- package/lib/components/ProjectCard/ProgressBar.js +4 -4
- package/lib/components/ProjectCard/ReviewRequestModal.js +5 -5
- package/lib/components/ProjectIntelligence/EngagementHeader/index.js +1 -1
- package/lib/components/ProjectIntelligence/FocusAreas/index.js +4 -4
- package/lib/components/ProjectIntelligence/KeyMetrics/index.js +4 -4
- package/lib/components/ProjectIntelligence/MissingInformation/index.d.ts +1 -0
- package/lib/components/ProjectIntelligence/MissingInformation/index.js +25 -16
- package/lib/components/ProjectIntelligence/ProgressTracker/index.js +1 -1
- package/lib/components/ProjectIntelligence/ProjectHealth/index.js +2 -2
- package/lib/components/ProjectIntelligence/TeamSection/index.js +3 -3
- package/lib/components/ProjectIntelligence/index.d.ts +1 -0
- package/lib/components/ProjectIntelligence/index.js +3 -3
- package/lib/components/Reviews/Pagination.js +6 -6
- package/lib/components/ReviewsTab/RatingHeader.js +6 -6
- package/lib/components/ReviewsTab/expert-shared-components.code-workspace +20 -20
- package/lib/components/ReviewsTab/reviewRequestModal.js +5 -5
- package/lib/components/shared/Image.js +13 -13
- package/lib/components/shared/ProfileTextField.d.ts +18 -18
- package/lib/components/shared/ProfileTextField.js +16 -16
- package/lib/components/shared/StyledActionButtons.d.ts +7 -7
- package/lib/components/shared/StyledActionButtons.js +15 -15
- package/lib/components/shared/ToastNotification.d.ts +10 -10
- package/lib/components/shared/ToastNotification.js +63 -63
- package/package.json +67 -67
|
@@ -34,11 +34,11 @@ const react_hot_toast_1 = __importDefault(require("react-hot-toast"));
|
|
|
34
34
|
const ReviewRequestModal = ({ project, requestModal, setRequestModal, expertName, freelancerId, setRequestStatus, selectedProject, setSelectedProject, clientId, refetchParoProjects, setHighlightedRatings, createOrUpdateRatingRequestMutation, getParoProjectsDocument, }) => {
|
|
35
35
|
var _a;
|
|
36
36
|
const [showError, setShowError] = (0, react_1.useState)(false);
|
|
37
|
-
const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name},
|
|
38
|
-
I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated!
|
|
39
|
-
|
|
40
|
-
Thank you in advance for your time and feedback.
|
|
41
|
-
Best regards,
|
|
37
|
+
const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name},
|
|
38
|
+
I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated!
|
|
39
|
+
|
|
40
|
+
Thank you in advance for your time and feedback.
|
|
41
|
+
Best regards,
|
|
42
42
|
${expertName}`);
|
|
43
43
|
const handleTextArea = (e) => {
|
|
44
44
|
setTextareaValue(e.target.value);
|
|
@@ -31,20 +31,20 @@ const react_1 = __importStar(require("react"));
|
|
|
31
31
|
const core_1 = require("@material-ui/core");
|
|
32
32
|
const styled_components_1 = __importDefault(require("styled-components"));
|
|
33
33
|
const cdn_1 = require("./constants/cdn");
|
|
34
|
-
const ProfilePhotoPreview = styled_components_1.default.img `
|
|
35
|
-
height: 86px;
|
|
36
|
-
width: 86px;
|
|
37
|
-
border: 4px solid #F8FAFC;
|
|
38
|
-
border-radius: 10px;
|
|
39
|
-
object-fit: cover;
|
|
40
|
-
object-position: top;
|
|
34
|
+
const ProfilePhotoPreview = styled_components_1.default.img `
|
|
35
|
+
height: 86px;
|
|
36
|
+
width: 86px;
|
|
37
|
+
border: 4px solid #F8FAFC;
|
|
38
|
+
border-radius: 10px;
|
|
39
|
+
object-fit: cover;
|
|
40
|
+
object-position: top;
|
|
41
41
|
`;
|
|
42
|
-
const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
|
|
43
|
-
text-decoration: underline;
|
|
44
|
-
cursor: pointer;
|
|
45
|
-
:active {
|
|
46
|
-
text-decoration: none !important;
|
|
47
|
-
}
|
|
42
|
+
const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
|
|
43
|
+
text-decoration: underline;
|
|
44
|
+
cursor: pointer;
|
|
45
|
+
:active {
|
|
46
|
+
text-decoration: none !important;
|
|
47
|
+
}
|
|
48
48
|
`;
|
|
49
49
|
exports.defaultAvatar = cdn_1.CDN_URL + 'defaultAvatar.png';
|
|
50
50
|
const Image = ({ imageUrl, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, legacyFreelancerId, }) => {
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { FieldError } from 'react-hook-form/dist/types/form';
|
|
2
|
-
type SectionContents = {
|
|
3
|
-
defaultValue?: string | number;
|
|
4
|
-
error?: boolean;
|
|
5
|
-
helperText: string | undefined | (FieldError | undefined)[];
|
|
6
|
-
inputRef?: ((instance: any) => void) | null | undefined;
|
|
7
|
-
label?: string;
|
|
8
|
-
multiline?: boolean;
|
|
9
|
-
name?: string;
|
|
10
|
-
placeholder?: string;
|
|
11
|
-
props?: unknown;
|
|
12
|
-
size?: 'small' | 'medium' | undefined;
|
|
13
|
-
onChange?: ((value: any) => void) | undefined;
|
|
14
|
-
width?: boolean;
|
|
15
|
-
InputProps?: any;
|
|
16
|
-
};
|
|
17
|
-
declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
|
|
18
|
-
export default ProfileTextField;
|
|
1
|
+
import { FieldError } from 'react-hook-form/dist/types/form';
|
|
2
|
+
type SectionContents = {
|
|
3
|
+
defaultValue?: string | number;
|
|
4
|
+
error?: boolean;
|
|
5
|
+
helperText: string | undefined | (FieldError | undefined)[];
|
|
6
|
+
inputRef?: ((instance: any) => void) | null | undefined;
|
|
7
|
+
label?: string;
|
|
8
|
+
multiline?: boolean;
|
|
9
|
+
name?: string;
|
|
10
|
+
placeholder?: string;
|
|
11
|
+
props?: unknown;
|
|
12
|
+
size?: 'small' | 'medium' | undefined;
|
|
13
|
+
onChange?: ((value: any) => void) | undefined;
|
|
14
|
+
width?: boolean;
|
|
15
|
+
InputProps?: any;
|
|
16
|
+
};
|
|
17
|
+
declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
|
|
18
|
+
export default ProfileTextField;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const react_1 = __importDefault(require("react"));
|
|
7
|
-
const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
|
|
8
|
-
const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
|
|
9
|
-
return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
|
|
10
|
-
shrink: true
|
|
11
|
-
}, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
|
|
12
|
-
react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
|
|
13
|
-
shrink: true
|
|
14
|
-
}, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
|
|
15
|
-
};
|
|
16
|
-
exports.default = ProfileTextField;
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
|
|
8
|
+
const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
|
|
9
|
+
return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
|
|
10
|
+
shrink: true
|
|
11
|
+
}, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
|
|
12
|
+
react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
|
|
13
|
+
shrink: true
|
|
14
|
+
}, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
|
|
15
|
+
};
|
|
16
|
+
exports.default = ProfileTextField;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
|
|
2
|
-
closeOnClick: () => void;
|
|
3
|
-
isDisabled: boolean;
|
|
4
|
-
isLoading: boolean;
|
|
5
|
-
handleSubmit?: () => void;
|
|
6
|
-
}) => JSX.Element;
|
|
7
|
-
export default StyledActionButtons;
|
|
1
|
+
declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
|
|
2
|
+
closeOnClick: () => void;
|
|
3
|
+
isDisabled: boolean;
|
|
4
|
+
isLoading: boolean;
|
|
5
|
+
handleSubmit?: () => void;
|
|
6
|
+
}) => JSX.Element;
|
|
7
|
+
export default StyledActionButtons;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const react_1 = __importDefault(require("react"));
|
|
7
|
-
const core_1 = require("@material-ui/core");
|
|
8
|
-
const Button_1 = __importDefault(require("@material-ui/core/Button"));
|
|
9
|
-
const Loader_1 = __importDefault(require("./Loader"));
|
|
10
|
-
const StyledActionButtons = ({ closeOnClick, isDisabled, isLoading, handleSubmit }) => {
|
|
11
|
-
return (react_1.default.createElement(core_1.DialogActions, null,
|
|
12
|
-
react_1.default.createElement(Button_1.default, { variant: 'outlined', onClick: closeOnClick, color: 'primary' }, "Close"),
|
|
13
|
-
react_1.default.createElement(Button_1.default, { color: 'default', disabled: isDisabled, key: String(isDisabled), onClick: handleSubmit, variant: 'contained' }, isLoading ? react_1.default.createElement(Loader_1.default, { key: String(isLoading) }) : 'Save')));
|
|
14
|
-
};
|
|
15
|
-
exports.default = StyledActionButtons;
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const core_1 = require("@material-ui/core");
|
|
8
|
+
const Button_1 = __importDefault(require("@material-ui/core/Button"));
|
|
9
|
+
const Loader_1 = __importDefault(require("./Loader"));
|
|
10
|
+
const StyledActionButtons = ({ closeOnClick, isDisabled, isLoading, handleSubmit }) => {
|
|
11
|
+
return (react_1.default.createElement(core_1.DialogActions, null,
|
|
12
|
+
react_1.default.createElement(Button_1.default, { variant: 'outlined', onClick: closeOnClick, color: 'primary' }, "Close"),
|
|
13
|
+
react_1.default.createElement(Button_1.default, { color: 'default', disabled: isDisabled, key: String(isDisabled), onClick: handleSubmit, variant: 'contained' }, isLoading ? react_1.default.createElement(Loader_1.default, { key: String(isLoading) }) : 'Save')));
|
|
14
|
+
};
|
|
15
|
+
exports.default = StyledActionButtons;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
interface ToastModalProps {
|
|
3
|
-
color: 'success' | 'info' | 'warning' | 'danger';
|
|
4
|
-
icon: string;
|
|
5
|
-
message: string;
|
|
6
|
-
duration?: number;
|
|
7
|
-
position?: 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';
|
|
8
|
-
}
|
|
9
|
-
declare const ToastModal: React.FC<ToastModalProps>;
|
|
10
|
-
export default ToastModal;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface ToastModalProps {
|
|
3
|
+
color: 'success' | 'info' | 'warning' | 'danger';
|
|
4
|
+
icon: string;
|
|
5
|
+
message: string;
|
|
6
|
+
duration?: number;
|
|
7
|
+
position?: 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';
|
|
8
|
+
}
|
|
9
|
+
declare const ToastModal: React.FC<ToastModalProps>;
|
|
10
|
+
export default ToastModal;
|
|
@@ -1,63 +1,63 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
const react_1 = __importStar(require("react"));
|
|
27
|
-
const core_1 = require("@material-ui/core");
|
|
28
|
-
const base_ui_1 = require("@paro.io/base-ui");
|
|
29
|
-
const ToastModal = ({ color, icon, message, duration = 6000, // Default duration is 6 seconds
|
|
30
|
-
position = 'bottom-right', }) => {
|
|
31
|
-
const [open, setOpen] = (0, react_1.useState)(false);
|
|
32
|
-
// Automatically open the modal on mount
|
|
33
|
-
(0, react_1.useEffect)(() => {
|
|
34
|
-
setOpen(true);
|
|
35
|
-
// Automatically close the modal after the specified duration
|
|
36
|
-
const timer = setTimeout(() => {
|
|
37
|
-
setOpen(false);
|
|
38
|
-
}, duration);
|
|
39
|
-
// Cleanup the timeout if the component unmounts or if the duration changes
|
|
40
|
-
return () => clearTimeout(timer);
|
|
41
|
-
}, [duration]);
|
|
42
|
-
console.log("triggered");
|
|
43
|
-
return (react_1.default.createElement(core_1.Dialog, { open: open, onClose: () => setOpen(false), "aria-labelledby": "toast-modal-title", maxWidth: "xs", fullWidth: true, PaperProps: {
|
|
44
|
-
style: {
|
|
45
|
-
backgroundColor: '#323232', // Dark background to resemble toast style
|
|
46
|
-
color: '#fff', // White text
|
|
47
|
-
borderRadius: '8px',
|
|
48
|
-
display: 'flex',
|
|
49
|
-
justifyContent: 'center',
|
|
50
|
-
alignItems: 'center',
|
|
51
|
-
zIndex: 9999, // Ensure it’s on top of the MUI Dialog
|
|
52
|
-
position: 'absolute', // Absolute positioning to control location
|
|
53
|
-
top: position.includes('top') ? '10%' : 'auto',
|
|
54
|
-
bottom: position.includes('bottom') ? '10%' : 'auto',
|
|
55
|
-
right: position.includes('right') ? '10%' : 'auto',
|
|
56
|
-
left: position.includes('left') ? '10%' : 'auto',
|
|
57
|
-
},
|
|
58
|
-
} },
|
|
59
|
-
react_1.default.createElement(core_1.DialogContent, { style: { textAlign: 'center' } },
|
|
60
|
-
react_1.default.createElement(base_ui_1.Alert, { color: color, icon: icon, label: message, className: color === 'warning' ? 'bg-warning' : 'bg-success' }),
|
|
61
|
-
",")));
|
|
62
|
-
};
|
|
63
|
-
exports.default = ToastModal;
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
const react_1 = __importStar(require("react"));
|
|
27
|
+
const core_1 = require("@material-ui/core");
|
|
28
|
+
const base_ui_1 = require("@paro.io/base-ui");
|
|
29
|
+
const ToastModal = ({ color, icon, message, duration = 6000, // Default duration is 6 seconds
|
|
30
|
+
position = 'bottom-right', }) => {
|
|
31
|
+
const [open, setOpen] = (0, react_1.useState)(false);
|
|
32
|
+
// Automatically open the modal on mount
|
|
33
|
+
(0, react_1.useEffect)(() => {
|
|
34
|
+
setOpen(true);
|
|
35
|
+
// Automatically close the modal after the specified duration
|
|
36
|
+
const timer = setTimeout(() => {
|
|
37
|
+
setOpen(false);
|
|
38
|
+
}, duration);
|
|
39
|
+
// Cleanup the timeout if the component unmounts or if the duration changes
|
|
40
|
+
return () => clearTimeout(timer);
|
|
41
|
+
}, [duration]);
|
|
42
|
+
console.log("triggered");
|
|
43
|
+
return (react_1.default.createElement(core_1.Dialog, { open: open, onClose: () => setOpen(false), "aria-labelledby": "toast-modal-title", maxWidth: "xs", fullWidth: true, PaperProps: {
|
|
44
|
+
style: {
|
|
45
|
+
backgroundColor: '#323232', // Dark background to resemble toast style
|
|
46
|
+
color: '#fff', // White text
|
|
47
|
+
borderRadius: '8px',
|
|
48
|
+
display: 'flex',
|
|
49
|
+
justifyContent: 'center',
|
|
50
|
+
alignItems: 'center',
|
|
51
|
+
zIndex: 9999, // Ensure it’s on top of the MUI Dialog
|
|
52
|
+
position: 'absolute', // Absolute positioning to control location
|
|
53
|
+
top: position.includes('top') ? '10%' : 'auto',
|
|
54
|
+
bottom: position.includes('bottom') ? '10%' : 'auto',
|
|
55
|
+
right: position.includes('right') ? '10%' : 'auto',
|
|
56
|
+
left: position.includes('left') ? '10%' : 'auto',
|
|
57
|
+
},
|
|
58
|
+
} },
|
|
59
|
+
react_1.default.createElement(core_1.DialogContent, { style: { textAlign: 'center' } },
|
|
60
|
+
react_1.default.createElement(base_ui_1.Alert, { color: color, icon: icon, label: message, className: color === 'warning' ? 'bg-warning' : 'bg-success' }),
|
|
61
|
+
",")));
|
|
62
|
+
};
|
|
63
|
+
exports.default = ToastModal;
|
package/package.json
CHANGED
|
@@ -1,67 +1,67 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@paro.io/expert-shared-components",
|
|
3
|
-
"version": "1.14.
|
|
4
|
-
"description": "",
|
|
5
|
-
"main": "lib/index.js",
|
|
6
|
-
"scripts": {
|
|
7
|
-
"build": "tsc",
|
|
8
|
-
"prepare": "yarn build",
|
|
9
|
-
"test": "yarn test:build",
|
|
10
|
-
"test:build": "yarn build",
|
|
11
|
-
"clean": "yarn -rf lib",
|
|
12
|
-
"predeploy": "tsc && cp package.json README.md ./lib",
|
|
13
|
-
"link-local": "yarn link && cd node_modules/react && yarn link && cd ../react-dom && yarn link",
|
|
14
|
-
"unlink-local": "yarn unlink && cd node_modules/react && yarn unlink && cd ../react-dom && yarn unlink"
|
|
15
|
-
},
|
|
16
|
-
"repository": "https://github.com/paroadmin/expert-shared-components.git",
|
|
17
|
-
"keywords": [
|
|
18
|
-
"react",
|
|
19
|
-
"components",
|
|
20
|
-
"shared"
|
|
21
|
-
],
|
|
22
|
-
"author": "apande@paro.io",
|
|
23
|
-
"license": "MIT",
|
|
24
|
-
"dependencies": {
|
|
25
|
-
"@date-io/dayjs": "1.x",
|
|
26
|
-
"@fortawesome/fontawesome-svg-core": "^6.6.0",
|
|
27
|
-
"@fortawesome/free-solid-svg-icons": "^6.6.0",
|
|
28
|
-
"@fortawesome/react-fontawesome": "^0.2.2",
|
|
29
|
-
"@hookform/resolvers": "3.3.4",
|
|
30
|
-
"@material-ui/core": "^4.11.0",
|
|
31
|
-
"@material-ui/icons": "^4.11.3",
|
|
32
|
-
"@material-ui/lab": "^4.0.0-alpha.61",
|
|
33
|
-
"@material-ui/pickers": "^3.3.11",
|
|
34
|
-
"@paro.io/base-icons": "^1.0.4",
|
|
35
|
-
"@paro.io/base-ui": "^1.8.3",
|
|
36
|
-
"@types/react-input-mask": "^3.0.5",
|
|
37
|
-
"dayjs": "^1.10.7",
|
|
38
|
-
"lodash": "^4.17.21",
|
|
39
|
-
"react": "^18.2.0",
|
|
40
|
-
"react-copy-to-clipboard": "^5.0.4",
|
|
41
|
-
"react-datepicker": "^4.6.0",
|
|
42
|
-
"react-dom": "^17.0.2",
|
|
43
|
-
"react-hook-form": "7.51.1",
|
|
44
|
-
"react-hot-toast": "^2.4.1",
|
|
45
|
-
"react-input-mask": "^3.0.0-alpha.2",
|
|
46
|
-
"styled-components": "^5.3.3",
|
|
47
|
-
"uuid": "8.3.2",
|
|
48
|
-
"yup": "^0.32.11"
|
|
49
|
-
},
|
|
50
|
-
"devDependencies": {
|
|
51
|
-
"@types/lodash": "^4.14.170",
|
|
52
|
-
"@types/react": "18.3.12",
|
|
53
|
-
"@types/react-copy-to-clipboard": "^5.0.2",
|
|
54
|
-
"@types/react-datepicker": "^4.19.6",
|
|
55
|
-
"@types/react-dom": "^18.2.22",
|
|
56
|
-
"@types/styled-components": "^5.1.22",
|
|
57
|
-
"@types/uuid": "^10.0.0",
|
|
58
|
-
"@types/yup": "^0.29.13",
|
|
59
|
-
"typescript": "^5.3.3"
|
|
60
|
-
},
|
|
61
|
-
"files": [
|
|
62
|
-
"lib/**/*"
|
|
63
|
-
],
|
|
64
|
-
"directories": {
|
|
65
|
-
"lib": "lib"
|
|
66
|
-
}
|
|
67
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@paro.io/expert-shared-components",
|
|
3
|
+
"version": "1.14.3",
|
|
4
|
+
"description": "",
|
|
5
|
+
"main": "lib/index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"build": "tsc",
|
|
8
|
+
"prepare": "yarn build",
|
|
9
|
+
"test": "yarn test:build",
|
|
10
|
+
"test:build": "yarn build",
|
|
11
|
+
"clean": "yarn -rf lib",
|
|
12
|
+
"predeploy": "tsc && cp package.json README.md ./lib",
|
|
13
|
+
"link-local": "yarn link && cd node_modules/react && yarn link && cd ../react-dom && yarn link",
|
|
14
|
+
"unlink-local": "yarn unlink && cd node_modules/react && yarn unlink && cd ../react-dom && yarn unlink"
|
|
15
|
+
},
|
|
16
|
+
"repository": "https://github.com/paroadmin/expert-shared-components.git",
|
|
17
|
+
"keywords": [
|
|
18
|
+
"react",
|
|
19
|
+
"components",
|
|
20
|
+
"shared"
|
|
21
|
+
],
|
|
22
|
+
"author": "apande@paro.io",
|
|
23
|
+
"license": "MIT",
|
|
24
|
+
"dependencies": {
|
|
25
|
+
"@date-io/dayjs": "1.x",
|
|
26
|
+
"@fortawesome/fontawesome-svg-core": "^6.6.0",
|
|
27
|
+
"@fortawesome/free-solid-svg-icons": "^6.6.0",
|
|
28
|
+
"@fortawesome/react-fontawesome": "^0.2.2",
|
|
29
|
+
"@hookform/resolvers": "3.3.4",
|
|
30
|
+
"@material-ui/core": "^4.11.0",
|
|
31
|
+
"@material-ui/icons": "^4.11.3",
|
|
32
|
+
"@material-ui/lab": "^4.0.0-alpha.61",
|
|
33
|
+
"@material-ui/pickers": "^3.3.11",
|
|
34
|
+
"@paro.io/base-icons": "^1.0.4",
|
|
35
|
+
"@paro.io/base-ui": "^1.8.3",
|
|
36
|
+
"@types/react-input-mask": "^3.0.5",
|
|
37
|
+
"dayjs": "^1.10.7",
|
|
38
|
+
"lodash": "^4.17.21",
|
|
39
|
+
"react": "^18.2.0",
|
|
40
|
+
"react-copy-to-clipboard": "^5.0.4",
|
|
41
|
+
"react-datepicker": "^4.6.0",
|
|
42
|
+
"react-dom": "^17.0.2",
|
|
43
|
+
"react-hook-form": "7.51.1",
|
|
44
|
+
"react-hot-toast": "^2.4.1",
|
|
45
|
+
"react-input-mask": "^3.0.0-alpha.2",
|
|
46
|
+
"styled-components": "^5.3.3",
|
|
47
|
+
"uuid": "8.3.2",
|
|
48
|
+
"yup": "^0.32.11"
|
|
49
|
+
},
|
|
50
|
+
"devDependencies": {
|
|
51
|
+
"@types/lodash": "^4.14.170",
|
|
52
|
+
"@types/react": "18.3.12",
|
|
53
|
+
"@types/react-copy-to-clipboard": "^5.0.2",
|
|
54
|
+
"@types/react-datepicker": "^4.19.6",
|
|
55
|
+
"@types/react-dom": "^18.2.22",
|
|
56
|
+
"@types/styled-components": "^5.1.22",
|
|
57
|
+
"@types/uuid": "^10.0.0",
|
|
58
|
+
"@types/yup": "^0.29.13",
|
|
59
|
+
"typescript": "^5.3.3"
|
|
60
|
+
},
|
|
61
|
+
"files": [
|
|
62
|
+
"lib/**/*"
|
|
63
|
+
],
|
|
64
|
+
"directories": {
|
|
65
|
+
"lib": "lib"
|
|
66
|
+
}
|
|
67
|
+
}
|